]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
feat: ignore `gutter-output` for margin grid in `xy-cell` mixins
authorDaniel Ruf <daniel@daniel-ruf.de>
Sun, 29 Apr 2018 21:26:14 +0000 (23:26 +0200)
committerDaniel Ruf <daniel.ruf@ueberbit.de>
Mon, 30 Apr 2018 08:04:32 +0000 (10:04 +0200)
`gutter-output` cannot be set to `false` for margin grid as the gutter (margin)
is defined with the width. Gutters can only be set or reset to 0, which does
not fullful the role of `gutter-output`.

See discussion at https://github.com/zurb/foundation-sites/pull/11081

**BREAKING CHANGE**

Before:
```scss
@include xy-cell(12, $gutter-type: margin, $gutter-output: false);
@include xy-cell-static(full, $gutter-type: margin, $gutter-output: false);
```

After
```scss
@include xy-cell(12, $gutter-type: margin, $gutters: 0);
@include xy-cell-static(full, $gutter-type: margin, $gutters: 0);
```

Co-authored-by: Nicolas Coden <nicolas@ncoden.fr>
Co-authored-by: SassNinja <kai.falkowski@gmail.com>
scss/xy-grid/_cell.scss

index 016318839b4fd7cce08c92f84bf000a267e92086..ad7fd55e821ea9ea70fc495309b7ed2562a59943 100644 (file)
     // Base flex properties
     @include xy-cell-base($size);
 
-    @if($gutter-output == true and $gutter-type == 'margin') {
-      @include -xy-cell-properties($size, $gutter, $vertical);
-    }
-    @else {
-      @include -xy-cell-properties($size, 0, $vertical);
-    }
+    $-gutter-output: if($gutter-type == 'margin', true, $gutter-output);
+    $-gutter-margin: if($gutter-type == 'margin', $gutter, 0);
 
-    @if $gutter-output {
+    @include -xy-cell-properties($size, $-gutter-margin, $vertical);
+    @if ($-gutter-output) {
       @include xy-gutters($gutter, $gutter-type, $gutter-position);
     }
   }
   $gutter: -zf-get-bp-val($gutters, $breakpoint);
   $gutter-position: if($vertical == true, top bottom, left right);
 
-  @if($gutter-output == true and $gutter-type == 'margin') {
-    @include -xy-cell-properties($size, $gutter, $vertical);
-  }
-  @else {
-    @include -xy-cell-properties($size, 0, $vertical);
-  }
+  $-gutter-output: if($gutter-type == 'margin', true, $gutter-output);
+  $-gutter-margin: if($gutter-type == 'margin', $gutter, 0);
 
-  // If we want to output the gutters
-  @if($gutter-output) {
-    // TODO: Figure out if we need to pass breakpoint in here too.
+  @include -xy-cell-properties($size, $-gutter-margin, $vertical);
+  @if ($-gutter-output) {
     @include xy-gutters($gutter, $gutter-type, $gutter-position);
   }
 }