Decanter 161 grid version v04

scss/core/grid/_grid.scss

@@ -0,0 +1,61 @@
+@charset "UTF-8";
+
+//
+// Class-based Grid.
+//
+// Markup: ../../templates/core/grid/grid.twig
+//
+
+// The grid.
+.grid--container {
+  @include grid--container;
+}
+
+.grid--item {
+  @include grid--item;
+}
+
+// Got classes if you want them.
+.grid--3-of-12 {
+  @include grid--3-of-12;
+}
+
+.grid--9-of-12 {
+  @include grid--9-of-12;
+}
+
+.grid--4-of-12 {
+  @include grid--4-of-12;
+}
+
+.grid--8-of-12 {
+  @include grid--8-of-12;
+}
+
+.grid--6-of-12 {
+  @include grid--6-of-12;
+}
+
+.grid--12-of-12 {
+  @include grid--12-of-12;
+}
+
+.grid--2-of-12 {
+  @include grid--2-of-12;
+}
+
+.grid--10-of-12 {
+  @include grid--10-of-12;
+}
+
+.grid--1-of-12 {
+  @include grid--1-of-12;
+}
+
+.grid--5-of-12 {
+  @include grid--5-of-12;
+}
+
+.grid--7-of-12 {
+  @include grid--7-of-12;
+}

scss/core/grid/index.scss

@@ -0,0 +1,8 @@
+@charset "UTF-8";
+
+///
+/// ROLL UP
+///
+
+@import
+  'grid';

scss/core/index.scss

@@ -11,6 +11,12 @@
 //
 // Style guide: Core.Fonts
 
+// Grid
+//
+// Markup: ../../templates/core/grid/grid.twig
+//
+// Style guide: Core.Grid
+
 // Colors
 //
 // Markup: ../templates/core/colors/colors.twig
@@ -19,4 +25,5 @@
 
 @import
   'fonts/index',
+  'grid/index',
   'base';

scss/kss/_class-based-grid.scss

@@ -1,12 +1,12 @@
 @charset "UTF-8";
 
 // Margins to aid in demonstration of markup.
-.decanter-grid {
+.grid--container {
   margin-bottom: 20px;
 }
 
 // Colors to distinguish odd vs. even cells.
-.decanter-grid--item {
+.grid--item {
   padding: 10px;
   overflow: hidden;
   background-color: rgba(black, .125);

scss/kss/_colors-demo.scss

@@ -0,0 +1,20 @@
+.colors-demo {
+  line-height: 1.2;
+
+  &--item {
+    margin-bottom: 1em;
+
+    .inner {
+      padding: .5em;
+    }
+  }
+
+  &--colorname {
+    font-size: .8em;
+    margin-bottom: .16em;
+  }
+
+  &--colorhex {
+    font-family: monospace;
+  }
+}