Apply SCSS breaking changes

gisktzh · Jan 7, 2025 · ec51ad7 · ec51ad7
1 parent b31a3e4
commit ec51ad7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 13 deletions.
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
@@ -12,7 +12,9 @@
     height: map-layout-variables.$navbar-height;
     overflow: hidden;
     @include mixins.hide-on-small-screens;
-    z-index: z-index-variables.$navbar;
+    & {
+      z-index: z-index-variables.$navbar;
+    }
   }
 
   .app__dev-mode-banner {

diff --git a/src/app/map/components/map-controls/map-rotation-button/map-rotation-button.component.scss b/src/app/map/components/map-controls/map-rotation-button/map-rotation-button.component.scss
@@ -16,7 +16,9 @@
 
   &--mobile {
     @include mixins.tool-button;
-    padding: 0;
+    & {
+      padding: 0;
+    }
 
     .mat-icon {
       height: 24px;

diff --git a/src/app/map/map-page.component.scss b/src/app/map/map-page.component.scss
@@ -21,14 +21,13 @@
 
 .map-container {
   height: calc(100vh - #{map-layout-variables.$navbar-height}); // subtracts height of navbar
+  position: relative;
+  $minimal-bottom-height: map-layout-variables.$esri-attribution-widget-height;
 
   @supports (height: 100dvh) {
     height: calc(100dvh - #{map-layout-variables.$navbar-height}); // subtracts height of navbar
   }
 
-  position: relative;
-  $minimal-bottom-height: map-layout-variables.$esri-attribution-widget-height;
-
   &--dev-mode {
     height: calc(100vh - #{map-layout-variables.$navbar-height} - #{map-layout-variables.$dev-mode-banner-height});
 
@@ -72,15 +71,15 @@
   }
 
   .map-container__all-map-items-container {
-    @include mixins.hide-on-small-screens;
-
     position: absolute;
     top: 12px;
     left: 12px;
     bottom: calc(12px + $minimal-bottom-height);
     width: map-layout-variables.$map-overlay-width;
     pointer-events: none;
 
+    @include mixins.hide-on-small-screens;
+
     .map-container__all-map-items-container__inner-container {
       display: flex;
       flex-direction: column;
@@ -121,12 +120,14 @@
     @include mixins.hide-on-small-screens;
     @include material-mixins.mat-icon-custom-svg-size(16px);
 
-    position: absolute;
-    top: 12px;
-    left: calc(24px + #{map-layout-variables.$map-overlay-width});
-    height: 48px;
-    width: map-layout-variables.$legend-button-width;
-    background-color: ktzh-variables.$zh-background-color;
+    & {
+      position: absolute;
+      top: 12px;
+      left: calc(24px + #{map-layout-variables.$map-overlay-width});
+      height: 48px;
+      width: map-layout-variables.$legend-button-width;
+      background-color: ktzh-variables.$zh-background-color;
+    }
   }
 
   .map-container__map-attribute-filter {