possible solution for #8257

taking first breakpoint and check if smallest and define it as zero-breakpoint

diff --git a/scss/grid/_flex-grid.scss b/scss/grid/_flex-grid.scss
index 788313311e7f5edfdc0596fe96ef153492d6fabc..2f67fe02c1bbc02b552e5109c39d22fbfc8d3109 100644 (file)
--- a/scss/grid/_flex-grid.scss
+++ b/scss/grid/_flex-grid.scss
@@ -213,7 +213,7 @@
       }
     }
 
-    @if $-zf-size != small {
+    @if $-zf-size != $zero-breakpoint-name {
       // Sizing (expand)
       @include breakpoint($-zf-size) {
         .#{$-zf-size}-expand {

diff --git a/scss/util/_breakpoint.scss b/scss/util/_breakpoint.scss
index cfa08d43678322b5abdd67ec761c851f1af7c207..6c4a5ca00812da263aec0f7fc13f8d73872a2fea 100644 (file)
--- a/scss/util/_breakpoint.scss
+++ b/scss/util/_breakpoint.scss
@@ -18,11 +18,12 @@ $breakpoints: (
   xxlarge: 1440px,
 ) !default;
 
-@if not map-has-key($breakpoints, small) or not map-has-key($breakpoints, medium) {
-  @error 'Your list of breakpoints (defined in $breakpoints) must include one named "small" and one named "medium".';
-}
-@else if map-get($breakpoints, small) != 0 {
-  @error 'Your "small" breakpoint (defined in $breakpoints) must be set to "0".';
+$zero-breakpoint-name: small !default;
+
+@if nth(map-values($breakpoints),1) != 0 {
+  @error 'Your smallest breakpoint (defined in $breakpoints) must be set to "0".';
+} @else {
+  $zero-breakpoint-name: nth(map-keys($breakpoints),1);
 }
 
 /// All of the names in this list will be output as classes in your CSS, like `.small-12`, `.medium-6`, and so on. Each value in this list must also be in the `$breakpoints` map.
@@ -32,7 +33,7 @@ $breakpoint-classes: (small medium large) !default;
 /// Generates a media query string matching the input value. Refer to the documentation for the `breakpoint()` mixin to see what the possible inputs are.
 ///
 /// @param {Keyword|Number} $val [small] - Breakpoint name, or px, rem, or em value to process.
-@function breakpoint($val: small) {
+@function breakpoint($val: $zero-breakpoint-name) {
   // Size or keyword
   $bp: nth($val, 1);
   // Value for max-width media queries

diff --git a/scss/util/_mixins.scss b/scss/util/_mixins.scss
index a984aa75517f115c635609ffa8213721c43b9334..e11e514245a0b5d6f22fbbde64a723ef4f466c3c 100644 (file)
--- a/scss/util/_mixins.scss
+++ b/scss/util/_mixins.scss
@@ -220,7 +220,7 @@
   $map: $breakpoint-classes;
 
   @if not $small {
-    $map: map-remove($map, small);
+    $map: map-remove($map, $zero-breakpoint-name);
   }
 
   @each $size in $map {