WIP -- adding default gutters -- it's mid process so likely borked un…

…til I finish
AgnosticUI · Sep 26, 2020 · c831995 · c831995
1 parent a016599
commit c831995
Showing 1 changed file with 14 additions and 0 deletions.
diff --git a/agnosticui-css/flexboxgrid-custom.css b/agnosticui-css/flexboxgrid-custom.css
@@ -1,4 +1,8 @@
 :root {
+  --agnosticui-default-gutter-width: 0;
+  --gutter-width: var(--agnosticui-gutter-width, var(--agnosticui-default-gutter-width));
+  --gutter-compensation: calc((var(--gutter-width) * 0.5) * -1);
+  --half-gutter-width: calc((var(--gutter-width) * 0.5));
   --agnosticui-default-sm-min: 576px;
   --agnosticui-default-md-min: 768px;
   --agnosticui-default-lg-min: 992px;
@@ -45,6 +49,8 @@
   flex: 0 1 auto;
   flex-direction: row;
   flex-wrap: wrap;
+  margin-right: var(--gutter-compensation);
+  margin-left: var(--gutter-compensation);
 }
 
 .row.reverse {
@@ -188,6 +194,8 @@
   box-sizing: border-box;
   flex: 0 0 auto;
   flex-basis: 100%;
+  padding-right: var(--half-gutter-width);
+  padding-left: var(--half-gutter-width);
   max-width: 100%;
 }
 
@@ -607,6 +615,8 @@
   .col-md-offset-12 {
     box-sizing: border-box;
     flex: 0 0 auto;
+    padding-right: var(--half-gutter-width);
+    padding-left: var(--half-gutter-width);
   }
 
   .col-md {
@@ -800,6 +810,8 @@
   .col-lg-offset-12 {
     box-sizing: border-box;
     flex: 0 0 auto;
+    padding-right: var(--half-gutter-width);
+    padding-left: var(--half-gutter-width);
   }
 
   .col-lg {
@@ -993,6 +1005,8 @@
   .col-xl-offset-12 {
     box-sizing: border-box;
     flex: 0 0 auto;
+    padding-right: var(--half-gutter-width);
+    padding-left: var(--half-gutter-width);
   }
 
   .col-xl {