Move responsive gutter logic to mixins instead of class output. Otherwise, the respon...

diff --git a/scss/grid/_classes.scss b/scss/grid/_classes.scss
index 1869953dc9e3286c38600d666f0638313f4c77d6..89bf04f5ebd3fb59e471ef5e6cb9efe722df8883 100644 (file)
--- a/scss/grid/_classes.scss
+++ b/scss/grid/_classes.scss
@@ -65,18 +65,6 @@
         @include grid-col-end;
       }
     }
-
-    // Responsive gutters
-    @if $grid-column-gutter == null {
-      @each $breakpoint, $gutter in $grid-column-responsive-gutter {
-        $padding: rem-calc($gutter) / 2;
-        
-        @include breakpoint($breakpoint) {
-          padding-left: $padding;
-          padding-right: $padding;
-        }
-      }
-    }
   }
 
   // Column row

diff --git a/scss/grid/_column.scss b/scss/grid/_column.scss
index 1c3de8c361b3fa02770d60d29e835f3524b06e02..ed2638988d19b8d992eb8bf39d2d1cf74f9f8d53 100644 (file)
--- a/scss/grid/_column.scss
+++ b/scss/grid/_column.scss
@@ -60,6 +60,16 @@
   @if $gutter != null {
     $gutter: rem-calc($gutter) / 2;
   }
+  @else {
+    @each $breakpoint, $gutter in $grid-column-responsive-gutter {
+      $padding: rem-calc($gutter) / 2;
+      
+      @include breakpoint($breakpoint) {
+        padding-left: $padding;
+        padding-right: $padding;
+      }
+    }
+  }
 
   @include grid-column-size($columns);
   float: $global-left;

diff --git a/scss/grid/_flex-grid.scss b/scss/grid/_flex-grid.scss
index b4101915b5ef220efaf0f2011e396ee30a6f9638..ff7024f1ed427905af1ee295207665582345d0a9 100644 (file)
--- a/scss/grid/_flex-grid.scss
+++ b/scss/grid/_flex-grid.scss
@@ -94,6 +94,16 @@ $-zf-flex-align: (
   @if $gutter != null {
     $gutter: rem-calc($gutter) / 2;
   }
+  @else {
+    @each $breakpoint, $gutter in $grid-column-responsive-gutter {
+      $padding: rem-calc($gutter) / 2;
+      
+      @include breakpoint($breakpoint) {
+        padding-left: $padding;
+        padding-right: $padding;
+      }
+    }
+  }
 
   flex: flex-grid-column($columns);
   padding-left: $gutter;
@@ -178,18 +188,6 @@ $-zf-flex-align: (
   // Column
   %flex-column {
     @include flex-grid-column;
-
-    // Responsive gutters
-    @if $grid-column-gutter == null {
-      @each $breakpoint, $gutter in $grid-column-responsive-gutter {
-        $padding: rem-calc($gutter) / 2;
-        
-        @include breakpoint($breakpoint) {
-          padding-left: $padding;
-          padding-right: $padding;
-        }
-      }
-    }
   }
 
   .column,