perf: update mixins to support new npm spec

AlaskaAirlines · Feb 8, 2025 · 2004ac7 · 2004ac7
1 parent 66e5743
commit 2004ac7
Showing 1 changed file with 19 additions and 19 deletions.
diff --git a/src/style.scss b/src/style.scss
@@ -54,7 +54,7 @@
     padding: var(--ds-size-400, $ds-size-400) var(--ds-size-200, $ds-size-200);
     overflow: hidden;
 
-    @include auro_breakpoint--md {
+    @include auro_grid-breakpoint--md {
       padding: var(--ds-size-200, $ds-size-200);
     }
   }
@@ -70,7 +70,7 @@
   .contentWrapper {
     margin-bottom: 150px;
 
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       margin-bottom: 0;
     }
   }
@@ -80,19 +80,19 @@
 :host([billboard]) {
   @extend %auro-banner;
 
-  @include auro_breakpoint--sm {
+  @include auro_grid-breakpoint--sm {
     max-height: 24rem;
   }
 
   .bodyWrapper {
     align-items: center;
     padding: var(--ds-size-400, $ds-size-400);
 
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       padding: var(--ds-size-400, $ds-size-400) 8rem;
     }
 
-    @include auro_breakpoint--md {
+    @include auro_grid-breakpoint--md {
       padding: var(--ds-size-400, $ds-size-400) 10rem;
     }
   }
@@ -102,7 +102,7 @@
   }
 
   .contentWrapper {
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       margin-bottom: 0;
     }
   }
@@ -124,7 +124,7 @@
     margin: 0 auto;
   }
 
-  @include auro_breakpoint--sm {
+  @include auro_grid-breakpoint--sm {
     .displayImage {
       max-width: 50%;
       right: 0;
@@ -170,7 +170,7 @@
   .displayImage {
     display: none;
 
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       display: block;
       max-width: 50%;
       right: 0;
@@ -183,7 +183,7 @@
     }
   }
   .description {
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       padding-bottom: var(--ds-size-300, $ds-size-300);
       padding-right: var(--ds-size-300, $ds-size-300);
     }
@@ -197,7 +197,7 @@
   .bodyWrapper {
     text-align: left;
     padding: var(--ds-size-400, $ds-size-400) var(--ds-size-400, $ds-size-400) var(--ds-size-400, $ds-size-400) 0;
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       width: 50%;
       padding-left: 0;
     }
@@ -214,11 +214,11 @@
   .bodyWrapper {
     padding: var(--ds-size-300, $ds-size-300);
 
-    @include auro_breakpoint--md {
+    @include auro_grid-breakpoint--md {
       padding: var(--ds-size-400, $ds-size-400);
     }
 
-    @include auro_breakpoint--lg {
+    @include auro_grid-breakpoint--lg {
       padding: var(--ds-size-600, $ds-size-600);
     }
   }
@@ -238,7 +238,7 @@
   .contentWrapper {
     margin: 0 auto;
 
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       flex-basis: 70%;
       flex-grow: 1;
     }
@@ -256,21 +256,21 @@
     align-items: center;
     padding: var(--ds-size-200, $ds-size-200);
 
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       flex-direction: row;
     }
 
-    @include auro_breakpoint--md {
+    @include auro_grid-breakpoint--md {
       padding: var(--ds-size-300, $ds-size-300);
     }
 
-    @include auro_breakpoint--lg {
+    @include auro_grid-breakpoint--lg {
       padding: var(--ds-size-400, $ds-size-400);
     }
   }
 
   .imageWrapper {
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       flex-basis: 30%;
       display: flex;
       margin-right: var(--ds-size-400, $ds-size-400);
@@ -298,12 +298,12 @@
 // =-=-=-=-= slim -=-=-=-=-=-=
 :host([slim]) {
   .bodyWrapper {
-    @include auro_breakpoint--sm {
+    @include auro_grid-breakpoint--sm {
       padding: var(--ds-size-400, $ds-size-400);
       min-height: unset;
     }
 
-    @include auro_breakpoint--md {
+    @include auro_grid-breakpoint--md {
       padding: var(--ds-size-400, $ds-size-400) var(--ds-size-600, $ds-size-600);
     }
   }