Iterate on basis reset

diff --git a/scss/xy-grid/_classes.scss b/scss/xy-grid/_classes.scss
index 0321005210877d29b63f115d43be2f98866b22e0..7d914fd68b7a30d38fecf08e40bb084da0b6eee3 100644 (file)
--- a/scss/xy-grid/_classes.scss
+++ b/scss/xy-grid/_classes.scss
@@ -41,11 +41,6 @@
       @include xy-cell-static(shrink, false);
     }
 
-    @include -zf-each-breakpoint() {
-      > [class*="#{$-zf-size}-"] {
-        flex-basis: auto;
-      }
-    }
   }
 
   // Auto width
@@ -63,6 +58,10 @@
 
     }
 
+    .grid-x > [class*="#{$-zf-size}-"] {
+      flex-basis: auto;
+    }
+
     @for $i from 1 through $grid-columns {
       // Sizing (percentage)
       .#{$-zf-size}-#{$i} {
@@ -259,6 +258,10 @@
 
       }
 
+      > [class*="#{$-zf-size}-"] {
+        flex-basis: auto;
+      }
+
       @for $i from 1 through $grid-columns {
         // Sizing (percentage)
         > .#{$-zf-size}-#{$i} {
@@ -266,11 +269,6 @@
         }
       }
 
-      @include -zf-each-breakpoint() {
-        > [class*="#{$-zf-size}-"] {
-          flex-basis: auto;
-        }
-      }
     }
   }
 

diff --git a/test/visual/xy-grid/margin-grid.html b/test/visual/xy-grid/margin-grid.html
index 387b0c35845c84665e411b587c661c28f1ab9899..333513ab4494cac93afbcc8eb8d1508219c766e8 100644 (file)
--- a/test/visual/xy-grid/margin-grid.html
+++ b/test/visual/xy-grid/margin-grid.html
@@ -61,8 +61,8 @@
     <h2>Auto and Shrink</h2>
 
     <div class="grid-x grid-margin-x">
-      <div class="cell medium-shrink"><div class="demo">Shrink on medium</div></div>
-      <div class="cell medium-auto"><div class="demo">Auto on medium</div></div>
+      <div class="cell medium-shrink large-10"><div class="demo">Shrink on medium, 10 on large</div></div>
+      <div class="cell medium-auto large-2"><div class="demo">Auto on medium, 2 large</div></div>
     </div>
 
     <h2>Collapse</h2>