Fix bug with nested grids

Nested grids were applying grid item styling to all descedent grid items, and not only direct children
nice-digital · Jan 19, 2018 · 5170fd6 · 5170fd6
1 parent 4b5ab43
commit 5170fd6
Showing 1 changed file with 14 additions and 14 deletions.
diff --git a/src/stylesheets/grid/_grid.scss b/src/stylesheets/grid/_grid.scss
@@ -74,55 +74,55 @@
 .grid {
   @include grid;
 
-  @include modifier('rev') {
+  &--rev {
     @include grid-reverse;
   }
 
-  @include modifier('gutterless') {
+  &--gutterless {
     @include grid-gutterless;
 
-    [data-g] {
+    > [data-g] {
       @include grid-item-gutterless;
     }
   }
 
-  @include modifier('compact') {
+  &--compact {
     @include grid-compact;
 
-    [data-g] {
+    > [data-g] {
       @include grid-item-compact;
     }
   }
 
-  @include modifier('loose') {
+  &--loose {
     @include grid-loose;
 
-    [data-g] {
+    > [data-g] {
       @include grid-item-loose;
     }
   }
 
-  @include modifier('right') {
+  &--right {
     @include grid-right;
   }
 
-  @include modifier('center') {
+  &--center {
     @include grid-center;
   }
 
-  @include modifier('middle') {
-    [data-g] {
+  &--middle {
+    > [data-g] {
       @include grid-item-middle;
     }
   }
 
-  @include modifier('bottom') {
-    [data-g] {
+  &--bottom {
+    > [data-g] {
       @include grid-item-bottom;
     }
   }
 
-  @include modifier('debug') {
+  &--debug {
     @include grid-debug;
 
     [data-g] {