Merge pull request #11145 from DanielRuf/fix/block-grid-breakpoints-m…

…argins-11121

fix: use the right breakpoints in block-grid for gutter calculation

scss/xy-grid/_classes.scss

@@ -188,7 +188,7 @@
     @include -zf-each-breakpoint {
       @for $i from 1 through $xy-block-grid-max {
         .#{$-zf-size}-up-#{$i} {
-          @include xy-grid-layout($i, '.cell', false, $gutter-type: padding);
+          @include xy-grid-layout($n: $i, $selector: '.cell', $gutter-output: false, $gutter-type: padding, $breakpoint: $-zf-size);
         }
       }
     }
@@ -203,15 +203,15 @@
           @each $bp in -zf-breakpoints-less-than($-zf-size) {
             @if(map-has-key($grid-margin-gutters, $bp)) {
               .grid-margin-x.#{$bp}-up-#{$i} {
-                @include xy-grid-layout($i, '.cell', false, $gutter-type: margin, $breakpoint: $bp);
+                @include xy-grid-layout($n: $i, $selector: '.cell', $gutter-output: false, $gutter-type: margin, $breakpoint: $-zf-size);
               }
             }
           }
         }
       }
       @for $i from 1 through $xy-block-grid-max {
         .grid-margin-x.#{$-zf-size}-up-#{$i} {
-          @include xy-grid-layout($i, '.cell', false, $gutter-type: margin, $breakpoint: $-zf-size);
+          @include xy-grid-layout($n: $i, $selector: '.cell', $gutter-output: false, $gutter-type: margin, $breakpoint: $-zf-size);
         }
       }
     }

scss/xy-grid/_layout.scss

@@ -14,6 +14,7 @@
 /// @param {Number|Map} $gutters [$grid-margin-gutters] - Map or single value for gutters.
 /// @param {Keyword} $gutter-type [margin] - Type of gutter to output. Accepts `margin` or `padding`.
 /// @param {List} $gutter-position [right left] - The position to apply gutters to. Accepts `top`, `bottom`, `left`, `right` in any combination.
+/// @param {String} $breakpoint [null] - The breakpoint to use for the cell generation.
 /// @param {Boolean} $vertical [false] - Set to true to output vertical (height) styles rather than widths.
 @mixin xy-grid-layout(
   $n,
@@ -22,7 +23,7 @@
   $gutters: $grid-margin-gutters,
   $gutter-type: margin,
   $gutter-position: right left,
-  $breakpoint: $-zf-zero-breakpoint,
+  $breakpoint: null,
   $vertical: false
 ) {
   $size: percentage(1/$n);