Add column row styles to flex grid, closes #7718

diff --git a/scss/grid/_flex-grid.scss b/scss/grid/_flex-grid.scss
index 2ca920f9b77cf55ed3fc1d6fc2e9f031fd4f9b33..c8f06028620361ce7d141b3a93038ebe76ac7a35 100644 (file)
--- a/scss/grid/_flex-grid.scss
+++ b/scss/grid/_flex-grid.scss
@@ -170,8 +170,7 @@ $-zf-flex-align: (
     @include flex-grid-row;
 
     // Nesting behavior
-    & &,
-    .column-row & {
+    & & {
       @include flex-grid-row(nest, $base: false);
     }
 
@@ -190,6 +189,20 @@ $-zf-flex-align: (
     @include flex-grid-column;
   }
 
+  // Column row
+  // The double .row class is needed to bump up the specificity
+  .column.row.row {
+    float: none;
+
+    // To properly nest a column row, padding and margin is removed
+    .row & {
+      padding-left: 0;
+      padding-right: 0;
+      margin-left: 0;
+      margin-right: 0;
+    }
+  }
+
   @include -zf-each-breakpoint {
     @for $i from 1 through $grid-column-count {
       // Sizing (percentage)