Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@mirisuzanne
Forked from hdc/_grid.sass
Created July 10, 2012 03:15
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mirisuzanne/3080741 to your computer and use it in GitHub Desktop.
Save mirisuzanne/3080741 to your computer and use it in GitHub Desktop.
susy grid mixin
//-----------------------------------------------------------------------------
// Imports
@import compass
@import susy
//-----------------------------------------------------------------------------
// Grid Settings
=grid-settings($cols: $total-columns, $width: $column-width, $gutter: $gutter-width, $padding: $grid-padding)
// keep the defaults around
$default-cols: $total-columns
$default-width: $column-width
$default-gutter: $gutter-width
$default-padding: $grid-padding
// use the new settings
$total-columns: $cols
$column-width: $width
$gutter-width: $gutter
$grid-padding: $padding
// apply to contents
@content
// re-instate the defaults
$total-columns: $default-cols
$column-width: $default-width
$gutter-width: $default-gutter
$grid-padding: $default-padding
//-----------------------------------------------------------------------------
// Imports
@import grid
//-----------------------------------------------------------------------------
// Grid Settings
$grid-background-column-color: rgba(255, 236, 0, 0.2)
//-----------------------------------------------------------------------------
// Other Settings
*
+box-sizing(border-box)
+grid-settings(6,9.188em,1.313em,1.313em)
.wrapper
+container()
+susy-grid-background
#main,#sub
width: columns(2,6) + gutter()/2
float: left
border-right: 1px solid lighten(#444444,20%)
padding: gutter()/2
#aside
+span-columns(2 omega,6)
padding: gutter()/2 0
+grid-settings(4,14.500em,1.313em,1.313em)
footer
clear: both
+container()
+susy-grid-background
div
+span-columns(4,16)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment