From 0e151d2b1aff92782141e0bb4185632d1ccd257f Mon Sep 17 00:00:00 2001
From: piensaenpixel <piensaenpixel@gmail.com>
Date: Wed, 27 Jan 2016 10:54:59 +0100
Subject: [PATCH] add first proposal #23

---
 src/scss/cdb-components/grid.scss | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 src/scss/cdb-components/grid.scss

diff --git a/src/scss/cdb-components/grid.scss b/src/scss/cdb-components/grid.scss
new file mode 100644
index 0000000..3ab688b
--- /dev/null
+++ b/src/scss/cdb-components/grid.scss
@@ -0,0 +1,30 @@
+// Grid layout
+// ----------------------------------------------
+
+/* SG
+# Grid/gaps
+
+```
+  <div class="Grid">
+    <div class="CDB-Width-1" style="background: green; height: 100px;">&nbsp;</div>
+    <div class="CDB-Width-2" style="background: orange">&nbsp;</div>
+    <div class="CDB-Width-3" style="background: red">&nbsp;</div>
+    <div class="CDB-Width-20" style="background: blue">&nbsp;</div>
+  </div>
+  <div class="CDB-Col12" style="margin: 20px 0; background: blue">&nbsp;</div>
+```
+*/
+
+@import '../cdb-variables/sizes';
+
+.Grid {
+  display: flex;
+}
+
+@for $i from 1 through 180 {
+  .CDB-Col#{$baseSize * $i} {
+      width: $baseSize * $i;
+      flex: 0 0 $baseSize * $i;
+      max-width: $baseSize * $i;
+  }
+}