_Weather.scss 790 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. @mixin weather() {
  2. .esri-weather {
  3. position: relative;
  4. overflow: hidden;
  5. padding: $cap-spacing $side-spacing;
  6. width: fit-content;
  7. &__content {
  8. display: flex;
  9. flex-direction: column;
  10. gap: $cap-spacing;
  11. }
  12. &__selector {
  13. display: flex;
  14. align-items: center;
  15. flex-direction: row;
  16. gap: $side-spacing--half;
  17. }
  18. &__warning {
  19. display: flex;
  20. flex-direction: row;
  21. align-items: center;
  22. gap: $side-spacing--half;
  23. font-size: $font-size--small;
  24. calcite-icon {
  25. color: var(--calcite-ui-warning);
  26. }
  27. }
  28. &__coverage-slider calcite-slider {
  29. margin: -7px; // Align slider to the buttons, header, etc
  30. }
  31. }
  32. }
  33. @if $include_Weather==true {
  34. @include weather();
  35. }