fix: prevent leaking of `-zf-size` in `-zf-each-breakpoint` mixin

Closes https://github.com/zurb/foundation-sites/issues/10818
Note: this also remove some useless logic in `@mixin breakpoint`

diff --git a/scss/util/_breakpoint.scss b/scss/util/_breakpoint.scss
index 8948c7baccc5bac417e0c6ff5cc7628028b21e86..59782acf07015fbe379bff2154717a5bd942c747 100644 (file)
--- a/scss/util/_breakpoint.scss
+++ b/scss/util/_breakpoint.scss
@@ -172,12 +172,7 @@ $breakpoint-classes: (small medium large) !default;
     }
   }
 
-  @if $old-zf-size != null {
-    // Restore the old breakpoint size
-    $-zf-size: $old-zf-size !global;
-  } @else {
-    $-zf-size: null !global;
-  }
+  $-zf-size: $old-zf-size !global;
 }
 
 /// Convers the breakpoints map to a URL-encoded string, like this: `key1=value1&key2=value2`. The value is then dropped into the CSS for a special `<meta>` tag, which is read by the Foundation JavaScript. This is how we transfer values from Sass to JavaScript, so they can be defined in one place.

diff --git a/scss/util/_mixins.scss b/scss/util/_mixins.scss
index d5dbfdb656b408994c59d3be7202d0add0d99599..f208fb4219539a7db80af75171d6db11790bf8e4 100644 (file)
--- a/scss/util/_mixins.scss
+++ b/scss/util/_mixins.scss
@@ -7,7 +7,7 @@
 ////
 
 /// Creates an inner box-shadow for only one side
-/// 
+///
 /// @param {Keyword} $side - Side the shadow is supposed to appear. Can be `top`, `left`, `right` or `bottom`.
 /// @param {Number} $size - Width for the target side.
 /// @param {Color} $color - Color of the shadow.
@@ -267,6 +267,10 @@
   }
 
   @each $name in $list {
+    $old-zf-size: null;
+    @if global-variable-exists(-zf-size) {
+      $old-zf-size: $-zf-size;
+    }
     $-zf-size: $name !global;
 
     @if $auto-insert-breakpoints {
@@ -277,6 +281,8 @@
     @else {
       @content;
     }
+
+    $-zf-size: $old-zf-size !global;
   }
 }