Permalink
Browse files

Refactor with settings

  • Loading branch information...
1 parent 737c57c commit 220e72e37588e2353f724e0f44c2c47b143e9f97 Matt Berridge committed Aug 24, 2012
Showing with 17 additions and 9 deletions.
  1. +17 −9 grids.scss
View
@@ -1,19 +1,27 @@
+//-------------------------------------------------------
+// GRID SETTINGS
+//-------------------------------------------------------
+
// this is the fixed gutter between columns
-$gutter : 3em;
+$gutter: 3em;
-// for smaller gutters
-$half-gutter : $gutter / 2;
+// this sets your class names
+$grid-wrap-class: grid-wrap;
+$grid-col-class: grid-col;
+//-------------------------------------------------------
+// GRID MIXINS
+//-------------------------------------------------------
+$half-gutter : $gutter / 2;
-// core grid configuration
@mixin grid-config {
- .grid-wrap {
+ .#{$grid-wrap-class} {
margin-left: -$gutter; /* the same as your gutter */
overflow: hidden;
clear: both; }
- .grid-col {
+ .#{$grid-col-class} {
float: left;
padding-left: $gutter; /* this is your gutter between columns */
width: 100%;
@@ -24,7 +32,7 @@ $half-gutter : $gutter / 2;
.half-gutter {
margin-left: -$half-gutter;
- .grid-col {
+ .#{$grid-col-class} {
padding-left: $half-gutter; }
}
@@ -48,10 +56,10 @@ $half-gutter : $gutter / 2;
@mixin grid-oldie-config {
.oldie {
- .grid-wrap {
+ .#{$grid-wrap-class} {
margin-left: 0; }
- .grid-col {
+ .#{$grid-col-class} {
padding: 0;
margin-left: 5%;

0 comments on commit 220e72e

Please sign in to comment.