Susy - Compass Plugin
================================

This plugin is a native grid system framework for [Compass](http://compass-style.org/).

Install
=======

    sudo gem sources --add http://gems.github.com/
    sudo gem install chriseppstein-compass
    sudo gem install ericam-compass-susy-plugin

Create a Susy-based Compass Project
==================================

    compass -r susy -f susy <project name>

Then edit your `screen.sass` and `print.sass` files accordingly. A reset is added automatically.

Customizing your Grid System
============================

To create a grid system, set the !grid_unit, !total_cols, !col_width, and
!gutter_width variables and then use the `+grid-container` mixin to declare
!your container element.

Example:

    !grid_unit = "em"
    !total_cols = 10
    !col_width = 7
    !gutter_width = 1

    #page
      +grid-container

The default values are 16 columns, column width of 4em and gutter width 1em.

Making Semantic Grids
=====================

* Use the `+grid-container` mixin to declare your container element.

* Use the `+grid-col` mixin to declare a grid element.  The first argument
is the number of cols, the second is the size (in grid columns) of the
containing element (defaults to the containers total_cols).  The third
argument should be true if this is the final column (defaults to false), and
the fourth argument should be true if this element should be floated right
instead of left.

* Use the `+grid-prefix` and `+grid-suffix` mixins to add grid columns
before or after a grid element.

Example:

    #page
      +grid-container
      #left-nav
        +grid-col(3)
      #main-content
        +grid-prefix(1)
        +grid-col(4, 10, true)