_OverlayItem.scss 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. /**
  2. * NOTE:
  3. * Overlay items are drawn using canvas when using the takeScreenshot
  4. * API. Please take care that the visual styles stay the same. Most styling
  5. * should happen using inline styles, while the CSS should be concerned with
  6. * positioning only.
  7. */
  8. .esri-text-overlay-item {
  9. display: block;
  10. position: absolute;
  11. overflow: hidden;
  12. white-space: nowrap;
  13. font-size: $font-size;
  14. font-family: $font-family;
  15. line-height: $line-height;
  16. }
  17. .esri-text-overlay-item-anchor-bottom {
  18. transform: translate(-50%, -100%);
  19. }
  20. .esri-text-overlay-item-anchor-bottom-right {
  21. transform: translate(-100%, -100%);
  22. }
  23. .esri-text-overlay-item-anchor-bottom-left {
  24. transform: translate(0, -100%);
  25. }
  26. .esri-text-overlay-item-anchor-top {
  27. transform: translate(-50%, 0);
  28. }
  29. .esri-text-overlay-item-anchor-top-right {
  30. transform: translate(-100%, 0);
  31. }
  32. .esri-text-overlay-item-anchor-top-left {
  33. transform: translate(0, 0);
  34. }
  35. .esri-text-overlay-item-anchor-center {
  36. transform: translate(-50%, -50%);
  37. }
  38. .esri-text-overlay-item-anchor-right {
  39. transform: translate(-100%, -50%);
  40. }
  41. .esri-text-overlay-item-anchor-left {
  42. transform: translate(0, -50%);
  43. }
  44. .esri-line-overlay-item {
  45. display: block;
  46. position: absolute;
  47. overflow: hidden;
  48. white-space: nowrap;
  49. }