compass-susy-plugin 0.9.beta.3 → 0.9

data/CHANGELOG.mkdn

@@ -0,0 +1,160 @@
+Susy Changelog
+==============
+
+v0.9 [Apr 25 2011]
+------------------
+
+Everything here is about simplicity. Susy has scaled back to it's most basic
+function: providing flexible grids. That is all.
+
+Deprecated:
+
+* The `susy/susy` import is deprecated in favor of simply importing `susy`.
+* The `show-grid` import is deprecated in favor of CSS3 gradient-based
+grid-images. You can now use the `susy-grid-background` mixin. See below.
+
+Removed:
+
+* Susy no longer imports all of compass.
+* Susy no longer establishes your baseline and no longer provides a reset.
+All of that is in the Compass core. You can (and should!) keep using them, but
+you will need to import them from compass.
+
+New:
+
+* Use the `susy-grid-background` mixin on any `container` to display the grid.
+This toggles on and off with the same controls that are used by the compass
+grid-background module.
+
+v0.9.beta.3 [Mar 16 2011]
+-------------------------
+
+Deprecated:
+
+* The `susy/reset` import has been deprecated in favor of the Compass core `compass/reset` import.
+* The `susy` mixin has been deprecated. If you plan to continue using vertical-rhythms, you should replace it with the `establish-baseline` mixin from the Compass Core.
+
+Removed:
+
+* The `vertical-rhythm` module has moved into compass core. The API remains the same, but if you were importing it directly, you will have to update that import.
+* The `defaults` template has been removed as 'out-of-scope'. This will not effect upgrading in any way, but new projects will not get a template with default styles.
+
+New Features:
+
+* Susy now supports RTL grids and bi-directional sites using the `$from-direction` variable (default: left) and an optional additional from-direction argument on all affected mixins. Thanks to @bangpound for the initial implementation.
+* Susy is now written in pure Sass! No extra Ruby functions included! Thanks to the Sass team for making it possible.
+
+v0.8.1 [Sep 24 2010]
+--------------------
+
+* Fixed typos in tutorial and `_defaults.scss`
+
+v0.8.0 [Aug 13 2010]
+--------------------
+
+Deprecated:
+
+* The `skip-link` was deprecated as it doesn't belong in Susy.
+* All the IE-specific mixins have been deprecated, along with the `$hacks` variable. Hacks are now used in the default mixins as per Compass.
+* The `hide` mixin was deprecated in favor of the Compass code `hide-text` mixin.
+
+Other Changes:
+
+* `inline-block-list` will be moved to the compass core soon. In preparation, I've cleaned it up some. You can now apply a padding of "0" to override previous padding arguments. You can also use `inline-block-list-container` and `inline-block-list-item` as you would with the Compass `horizontal-list` mixins.
+* The `$align` arguments have been removed from both the `susy` and `container` mixins. Text-alignment is no longer used or needed in achieving page centering. That was a cary-over from the IE5 Mac days.
+* The `container` mixin now uses the `pie-clearfix` compass mixin to avoid setting the overflow to hidden.
+* Default styles have been cleaned up to account for better font stacks and typography, html5 elements, vertically-rhythmed forms, expanded print styles, use of `@extend`, and overall simplification.
+
+v0.7.0 [Jun 01 2010]
+--------------------
+
+* updated documentation
+
+v0.7.0.rc2 [May 13 2010]
+------------------------
+
+* Fixes a bug with grid.png and a typo in the readme. Nothing major here.
+
+v0.7.0.rc1 [May 12 2010]
+------------------------
+
+* template cleanup & simplification - no more pushing CSSEdit comments, etc.
+* expanded base and defaults with better fonts & styles out-of-the-box
+* expanded readme documentation. This will expand out into a larger docs/tutorial site in the next week.
+
+v0.7.0.pre8 [Apr 20 2010]
+-------------------------
+
+* mostly syntax and gem cleanup
+* added `un-column` mixin to reset elements previously declared as columns.
+* added `rhythm` mixin as shortcut for leaders/trailers. accepts 4 args: leader, padding-leader, padding-trailer, trailer.
+* added a warning on `alpha` to remind you that `alpha` is not needed at nested levels.
+
+v0.7.0.pre7 [Apr 13 2010]
+-------------------------
+
+* *Requires HAML 3 and Compass 0.10.0.rc2*
+* Internal syntax switched to scss. This will have little or no effect on users. You can still use Susy with either (Sass/Scss) syntax.
+* `$default-rhythm-border-style` overrides default rhythm border styles
+* Better handling of sub-pixel rounding for IE6
+
+v0.7.0.pre6 [Mar 29 2010]
+-------------------------
+
+* Added `+h-borders()` shortcut for vertical_rhythm `+horizontal-borders()`
+* Fixed vertical rhythm font-size typo (thanks @oscarduignan)
+* Added to template styles, so susy is already in place from the start
+
+v0.7.0.pre5 [Mar 19 2010]
+-------------------------
+
+* Expanded and adjusted `_vertical_rhythm.sass` in ways that are not entirely backwards compatible. Check the file for details.
+* `_defaults.sass` is re-ordered from inline to block.
+* `:focus` defaults cleaned up.
+* README and docs updated.
+
+v0.7.0.pre4 [Jan 20 2010]
+-------------------------
+
+Update: pre2 was missing a file in the manifest. Use pre4.
+
+*Update:* Forgot to note one change: `+susy` is no longer assigned to the `body` tag, but instead at the top level of the document (not nested under anything).
+
+Warning: This update is not backwards compatible. We've changed some things. You'll have to change some things. Our changes were fairly major in cleaning up the code - yours will be minor and also clean up some code.
+
+Added:
+
+* new `_vertical_rhythm.sass` (thanks to Chris Eppstein) provides better establishing of the baseline grid, as well as mixins to help you manage it.
+* `!px2em` has replaced `px2em()` - see below.
+
+Removed:
+
+* `px2em()` has been removed and replaced with a simple variable `!px2em` which returns the size of one pixel relative to your basic em-height. Multiply against your desired px dimensions (i.e. `border-width = !px2em*5px` will output the em-equivalent of 5px).
+* `!base_font_size_px` and `!base_line_height_px` have been replaced with `!base_font_size` and `!base_line_height` which take advantage of sass's built-in unit handling.
+* `!grid_units` is not needed, as you can now declare your units directly in the other grid `_width` variables. Use any one type of units in declaring your grid. The units you use will be used in setting the container size.
+
+Once you've upgraded, before you compile your files, make these changes:
+
+* remove the "_px" from the font-size and line-height variables, and add "px" to their values.
+* remove the `!grid_units` variable and add units to your grid variable values.
+* find any uses of `px2em()` and replace them with something.
+* enjoy!
+
+v0.7.0.pre1 [Nov 30 2009]
+-------------------------
+
+Not a lot of new functionality here – it all moved over to Compass 0.10.0 – mostly just cleaning it up to match.
+
+* simplified the default styles and gave them their own project template (‘_defaults.sass’).
+* defaults not imported by ‘ie.sass’, as ‘ie.sass’ should be cascading on top of ‘screen.sass’ anyway
+* changed the syntax to match CSS and Compass (‘property:’ replaces ‘:property’)
+* added more inline documentation and brought tutorial up to date
+* moved CSS3 module over to Compass
+* import the compass HTML5 reset along with the normal reset by default (because Susy loves the future)
+* little internal management fixes and so on and so on…
+
+older…
+-------
+
+* not documented here.
+* check the commit log.

data/Manifest

@@ -1,3 +1,4 @@
+CHANGELOG.mkdn
 LICENSE.txt
 Manifest
 README.mkdn
@@ -5,12 +6,9 @@ Rakefile
 VERSION
 compass-susy-plugin.gemspec
 lib/susy.rb
-lib/susy/compass_plugin.rb
+sass/_susy.scss
 sass/susy/_grid.scss
-sass/susy/_reset.scss
 sass/susy/_susy.scss
-sass/susy/_utils.scss
 templates/project/_base.scss
-templates/project/grid.png
 templates/project/manifest.rb
 templates/project/screen.scss

data/README.mkdn

@@ -1,35 +1,29 @@
-Susy - Compass Plugin 
+Susy - Compass Plugin
 =====================
 
 Susy is a semantic CSS grid system for designers.
 
-Build beautiful grids of any type, width and breakdown, without touching your
-markup or changing the way you work. Built entirely native to
-[Compass](http://compass-style.org/), Susy is an expert at fluid grids in an
-elastic (or fluid, or fixed) shell that stay where you want without ever
-activating that bloody side-scroll bar. Susy sets your width on the outer
-element (`container`), adds a `max-width` of `100%` and builds the rest of
-your grid in percentages. The philosophy and technique are based on [Natalie
-Downe](http://natbat.net/)'s "[CSS
-Systems](http://natbat.net/2008/Sep/28/css-systems/)" - which introduces
-difficult math in the service of beautiful structure. With the power of
-Compass/Sass, Susy will do that math and let you focus on your designs.
-
-Using simple mixins, columns can be created, suffixed, prefixed, and nested -
-always in flexible percentages and without touching your markup.
-
-Install 
+Use Susy anywhere. Static sites, Rails sites, Django sites, PHP sites,
+etc. You name it. Susy just helps you with the grid - whether you want it
+fixed, fluid, elastic or Susy's specialty: fluid on the inside and elastic on
+the outside. And Susy will do it all without ever touching your markup.
+
+Built entirely native to [Compass](http://compass-style.org/), Susy is based
+on the philosophy and techniques of [Natalie Downe](http://natbat.net/)'s
+"[CSS Systems](http://natbat.net/2008/Sep/28/css-systems/)" - which introduces
+difficult math in return for beautiful structure. Now Susy will do that math
+for you and let you focus on your designs.
+
+Install
 =======
 
     sudo gem install compass-susy-plugin
 
-Create a Susy-based Compass Project 
+Create a Susy-based Compass Project
 ===================================
 
     compass create <project name> -r susy -u susy
 
-Then edit your `_base.scss` and `screen.scss` files accordingly.
-
 Philosophy and Goals
 ====================
 
@@ -65,26 +59,26 @@ Grid Basics
 
 * Set up your default grid values (total columns, column width, gutter width,
   side gutter width) and important mixins in `_base.scss`.
-  
+
     Example:
-  
+
         $total-cols: 12;                    /* a 12-column grid */
-        $col-width: 4em;                    /* each column is 4em (64px) wide */
-        $gutter-width: 1em;                 /* 1em (16px) gutters between columns */
-        $side-gutter-width: $gutter-width;  /* 1em (16px) padding at the edges of the page as well */
+        $col-width: 4em;                    /* each column is 4em wide */
+        $gutter-width: 1em;                 /* 1em gutters between columns */
+        $side-gutter-width: $gutter-width;  /* 1em padding at the edges of the page as well */
 
-* Create your grid in `screen.scss`: apply the `container` mixin to the 
+* Create your grid in `screen.scss`: apply the `container` mixin to the
   element(s) that contains the page grid. This will set up your font sizes
   and grid container.
 
     Example:
-     
+
         #page {
-          @include container; 
+          @include container;
         }
-    
+
     CSS Output:
-    
+
         #page {
           *zoom: 1;
           margin: auto;
@@ -114,36 +108,36 @@ Grid Basics
   considered to be in the "root" context. Any element within other grid
   elements (with a nearest grid ancestor other than the `container`) is
   considered to be in a "nested" context.
-    
+
   This is important because side-gutters are handled at the root level, as
   margins on root grid elements. Margins that we don't want at nested levels.
   It is also important because Susy grid elements are %-based, and so the
   context is important to Susy's math. `Full` is simply a shortcut to replace
   `columns` when the span should be the full width.
-  
+
     The `columns` mixin:
-  
+
         @include columns($span, [$context]);
-  
+
     The `full` mixin:
-  
+
         @include full([$context]);
 
   *Note:* Context _must not_ be passed at the root level, and _must_ be passed at nested levels.
 
 * Use `alpha` and `omega` to declare elements which include
   the first or last column within their parent element.
-  
+
   *Note:* `alpha` is _only_ needed in the root level, and does
   nothing in nested contexts. Neither is needed with an `full` element.
-  
+
     The `alpha` and `omega` mixins:
-    
+
         @include alpha;
         @include omega([$context]);
-  
+
     Example Scss:
-    
+
         #page {
           @include container;
           header {
@@ -168,62 +162,60 @@ Grid Basics
             }
           }
         }
-      
+
   Susy's CSS output uses floats to arrange the columns, widths to set the
   spans, right-margins to set the getter, and both side margins to set the
   side-gutters on root `alpha` and `omega` elements.
 
 * Use `prefix` or `suffix` to pad (in columns) the width of
-  an element using left and right padding, or `pad` to give both `prefix` and 
+  an element using left and right padding, or `pad` to give both `prefix` and
   `@suffix` at once.
-  
+
     The `prefix`, `suffix` and `pad` mixins:
-    
+
         @include prefix($prefix-span [, $context])
         @include prefix($suffix-span [, $context])
         @include pad($prefix-span, $suffix-span [, $context])
-  
+
     Used with `full` these are subtractive, so the full width remains:
-    
+
         header {
           @include full;
           @prefix(2);
         }
-    
+
     Will result in a full-width element, with 2 columns of padding to the left.
-    
+
     Used with `columns` these are addative, so the content width remains:
-    
+
         aside {
           @include columns(3,9);
           @prefix(3,9)
         }
-    
-    Will result in a 6-column element, with 3 of those columns used as padding 
+
+    Will result in a 6-column element, with 3 of those columns used as padding
     on the left.
 
 That's it for the basics! Here's a sample Susy grid layout:
 
-    @include susy;
-     
     #page {
-      @include container; 
+      @include container;
     }
-     
+
     header {
       @include full;
       @include pad(1,1);
-      
+
       h1 {
         @include full(10);
-      } 
+      }
     }
-        
+
     nav {
       @include columns(3);
       @include alpha;
     }
-     
+
     #content {
       @include columns(9);
       @include omega;
@@ -241,14 +233,12 @@ Tutorial
 
 Check out the tutorial at [susy.oddbird.net/tutorial/](http://susy.oddbird.net/tutorial/) for more details.
 
-Extra Utility Mixins 
-=====================
-
-Extra utilities are included in Susy's `_utils.scss`:
-
-* `show-grid($src)` - Repeat the specified grid image on an element.
-  Good for testing your baseline and grid.
+Show your grids
+===============
 
+* `@include susy-grid-background` - For testing it can be helpful to see your
+grid. Using CSS3 gradients, Susy will show you that grid - and it will flex
+right along with your site.
 
 Advanced Options
 ================
@@ -261,7 +251,7 @@ advanced options hidden inside. Here are a few:
   size of a gutter in your given context as a percentage.
 
     Example:
-        
+
         #nav {
           padding-right: gutter(5);
         }
@@ -272,19 +262,19 @@ advanced options hidden inside. Here are a few:
   shortcut.
 
     Example:
-        
+
         #nav {
           padding-left: columns(3,5);
         }
 
-* `side_gutter()` returns the percentage width of a side-gutter and takes no 
+* `side_gutter()` returns the percentage width of a side-gutter and takes no
   arguments since it can always used at the top nesting level.
 
-Susy now also supports right-to-left and bi-directional documents. For a 
-simple toggle, set the default `$from-direction` (defaults to `left`). For 
-more specific control, you can pass an additional, localized `$from-direction` 
-artgument to any of the Susy mixins that need to know:
+Susy now also supports right-to-left and bi-directional documents. For a
+simple toggle, set the default `$from-direction` (defaults to `left`). For
+more specific control, you can pass an additional, localized `$from-direction`
+argument to any of the Susy mixins that need to know:
 
-* `columns`, `un-column`
+* `columns`, `reset-column`
 * `alpha`, `omega`
 * `prefix`, `suffix`, `pad`

data/Rakefile

@@ -3,17 +3,17 @@ require 'sass'
 
 begin
   require 'echoe'
- 
+
   Echoe.new('compass-susy-plugin', open('VERSION').read) do |p|
     p.summary = "A responsive grid system plugin for Compass."
     p.description = "Responsive web design with grids the quick and reliable way."
     p.url = "http://susy.oddbird.net/"
     p.author = "Eric Meyer"
     p.email = "eric@oddbird.net"
-    p.dependencies = ["compass >=0.11.beta.3"]
+    p.dependencies = ["compass >=0.11.1"]
     p.has_rdoc = false
   end
- 
+
 rescue LoadError => boom
   puts "You are missing a dependency required for meta-operations on this gem."
   puts "#{boom.to_s.capitalize}."

data/VERSION

@@ -1 +1 @@
-0.9.beta.3
+0.9

data/compass-susy-plugin.gemspec

@@ -2,31 +2,31 @@
 
 Gem::Specification.new do |s|
   s.name = %q{compass-susy-plugin}
-  s.version = "0.9.beta.3"
+  s.version = "0.9"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 1.2") if s.respond_to? :required_rubygems_version=
   s.authors = ["Eric Meyer"]
-  s.date = %q{2011-03-16}
+  s.date = %q{2011-04-25}
   s.description = %q{Responsive web design with grids the quick and reliable way.}
   s.email = %q{eric@oddbird.net}
-  s.extra_rdoc_files = ["LICENSE.txt", "README.mkdn", "lib/susy.rb", "lib/susy/compass_plugin.rb"]
-  s.files = ["LICENSE.txt", "Manifest", "README.mkdn", "Rakefile", "VERSION", "compass-susy-plugin.gemspec", "lib/susy.rb", "lib/susy/compass_plugin.rb", "sass/susy/_grid.scss", "sass/susy/_reset.scss", "sass/susy/_susy.scss", "sass/susy/_utils.scss", "templates/project/_base.scss", "templates/project/grid.png", "templates/project/manifest.rb", "templates/project/screen.scss"]
+  s.extra_rdoc_files = ["CHANGELOG.mkdn", "LICENSE.txt", "README.mkdn", "lib/susy.rb"]
+  s.files = ["CHANGELOG.mkdn", "LICENSE.txt", "Manifest", "README.mkdn", "Rakefile", "VERSION", "compass-susy-plugin.gemspec", "lib/susy.rb", "sass/_susy.scss", "sass/susy/_grid.scss", "sass/susy/_susy.scss", "templates/project/_base.scss", "templates/project/manifest.rb", "templates/project/screen.scss"]
   s.homepage = %q{http://susy.oddbird.net/}
   s.rdoc_options = ["--line-numbers", "--inline-source", "--title", "Compass-susy-plugin", "--main", "README.mkdn"]
   s.require_paths = ["lib"]
   s.rubyforge_project = %q{compass-susy-plugin}
-  s.rubygems_version = %q{1.5.2}
+  s.rubygems_version = %q{1.7.2}
   s.summary = %q{A responsive grid system plugin for Compass.}
 
   if s.respond_to? :specification_version then
     s.specification_version = 3
 
     if Gem::Version.new(Gem::VERSION) >= Gem::Version.new('1.2.0') then
-      s.add_runtime_dependency(%q<compass>, [">= 0.11.beta.3"])
+      s.add_runtime_dependency(%q<compass>, [">= 0.11.1"])
     else
-      s.add_dependency(%q<compass>, [">= 0.11.beta.3"])
+      s.add_dependency(%q<compass>, [">= 0.11.1"])
     end
   else
-    s.add_dependency(%q<compass>, [">= 0.11.beta.3"])
+    s.add_dependency(%q<compass>, [">= 0.11.1"])
   end
 end

data/lib/susy.rb

@@ -1 +1,4 @@
-require File.join(File.dirname(__FILE__), 'susy', 'compass_plugin')
+require 'compass'
+Compass::Frameworks.register('susy',
+                             :stylesheets_directory => File.join(File.dirname(__FILE__), '..', 'sass'),
+                             :templates_directory => File.join(File.dirname(__FILE__), '..', 'templates'))

data/sass/_susy.scss

@@ -0,0 +1,3 @@
+// Imports -------------------------------------------------------------------
+
+@import "susy/grid";

data/sass/susy/_grid.scss

@@ -1,24 +1,26 @@
-//** Susy Grid **//
+// Imports -------------------------------------------------------------------
+
+@import "compass/utilities/general/clearfix";
+@import "compass/utilities/general/float";
+@import "compass/layout/grid-background";
 
 // Variables -----------------------------------------------------------------
 
 // Your basic settings for the grid.
-// Override these in base.sass to customize your site.
 $total-cols         : 12            !default;
 $col-width          : 4em           !default;
 $gutter-width       : 1em           !default;
 $side-gutter-width  : $gutter-width !default;
 
 // Controls for right-to-left or bi-directional sites.
-// You can override these case-by-case as needed for bi-directional sites.
 $from-direction     : left          !default;
 
-// Sets the direction that +omega elements are floated by deafult.
+// The direction that +omega elements are floated by deafult.
 $omega-float        : opposite-position($from-direction)    !default;
 
 // Functions -----------------------------------------------------------------
 
-// Return the width of 'n' columns plus 'n - 1' gutters 
+// Return the width of 'n' columns plus 'n - 1' gutters
 // plus page padding in non-nested contexts
 @function columns-width(
   $n: false
@@ -43,7 +45,7 @@ $omega-float        : opposite-position($from-direction)    !default;
 
 // Return the percentage width of 'n' columns in a context of 'c'
 @function columns(
-  $n, 
+  $n,
   $c: false
 ) {
   $columns: percent-width(columns-width($n), columns-width($c));
@@ -76,7 +78,7 @@ $omega-float        : opposite-position($from-direction)    !default;
 
 // Base Mixin ----------------------------------------------------------------
 
-// Set +container() on the outer grid-containing element(s).
+// Set the outer grid-containing element(s).
 @mixin container() {
   @include pie-clearfix;
   margin: auto;
@@ -94,8 +96,8 @@ $omega-float        : opposite-position($from-direction)    !default;
 // By default a grid-column is floated left with a right gutter.
 //  - Override those with +float("right"), +alpha or +omega
 @mixin columns(
-  $n, 
-  $context  : false, 
+  $n,
+  $context  : false,
   $from     : $from-direction
 ) {
   $to   : opposite-position($from);
@@ -104,21 +106,26 @@ $omega-float        : opposite-position($from-direction)    !default;
   // the width of the column is set as a percentage of the context
   width: columns($n, $context);
   // the right gutter is added as a percentage of the context
-  margin-#{$to}: gutter($context); 
+  margin-#{$to}: gutter($context);
 }
 
-// Set +un-column to reset a column element to default block behavior
-@mixin un-column(
+// @include `reset-column` to reset a column element to default block behavior
+@mixin reset-column(
   $from : $from-direction
 ) {
   $to   : opposite-position($from);
-  float: none;
-  display: block;
+  @include reset-float;
   width: auto;
-  margin-#{$to}: auto;  
+  margin-#{$to}: auto;
+}
+
+@mixin un-column(
+  $from : $from-direction
+) {
+  @include reset-column($from);
 }
 
-// Set +full on an element that will span it's entire context.
+// @include `full` on an element that will span it's entire context.
 // There is no need for +columns, +alpha or +omega on a +full element.
 @mixin full(
   $nested: false
@@ -127,55 +134,56 @@ $omega-float        : opposite-position($from-direction)    !default;
   @if not $nested {
     margin: {
       left: side-gutter();
-      right: side-gutter();      
+      right: side-gutter();
     }
-  } 
+  }
 }
 
 // Padding Mixins ------------------------------------------------------------
 
-// Set +prefix() on any element to add empty colums as padding 
-// before or after.
+// add empty colums as padding before an element.
 @mixin prefix(
-  $n, 
-  $context  : false, 
+  $n,
+  $context  : false,
   $from     : $from-direction
 ) {
-  padding-#{$from}: columns($n, $context) + gutter($context); 
+  padding-#{$from}: columns($n, $context) + gutter($context);
 }
 
+// add empty colums as padding after an element.
 @mixin suffix(
-  $n, 
-  $context  : false, 
+  $n,
+  $context  : false,
   $from     : $from-direction
 ) {
   $to       : opposite-position($from);
-  padding-#{$to}: columns($n, $context) + gutter($context); 
+  padding-#{$to}: columns($n, $context) + gutter($context);
 }
 
-// Set as a shortcut for both prefix and suffix.
+// add empty colums as padding before and after an element.
 @mixin pad(
-  $p    : false, 
-  $s    : false, 
-  $c    : false, 
+  $p    : false,
+  $s    : false,
+  $c    : false,
   $from : $from-direction
 ) {
   @if $p {
-    @include prefix($p, $c, $from); 
-  } 
+    @include prefix($p, $c, $from);
+  }
   @if $s {
-    @include suffix($s, $c, $from); 
-  } 
+    @include suffix($s, $c, $from);
+  }
 }
 
 // Alpha & Omega Mixins ------------------------------------------------------
+// I recommend that you pass the actual nested contexts (when nested) rather
+// than a true/false argument for the sake of consistency. Effect is the same,
+// but your code will be much more readable.
 
-// Set +alpha on any element spanning the first column in non-nested 
-// context to take side-gutters into account. Recommended that you pass 
-// the actual nested contexts (when nested) rather than a true/false 
-// argument for the sake of consistency. Effect is the same.
+// @include on any element spanning the first column in non-nested context to
+// take side-gutters into account.
 @mixin alpha(
-  $nested : false, 
+  $nested : false,
   $from   : $from-direction
 ) {
   @if not $nested {
@@ -185,24 +193,35 @@ $omega-float        : opposite-position($from-direction)    !default;
   }
 }
 
-// Set +omega() on the last element of a row, in order to take side-gutters
-// and the page edge into account. Set the $nested argument for nested 
-// columns. It is recommended that you pass the actual nested context when 
-// nested, rather than a true/false argument, for the sake of consistency. 
-// Effect is the same.
+// @include on the last element of a row, in order to take side-gutters and
+// the page edge into account. Set the $nested argument for nested columns.
 @mixin omega(
-  $nested : false, 
+  $nested : false,
   $from   : $from-direction
 ) {
   $to     : opposite-position($from);
   $hack   : opposite-position($omega-float);
   $sg     : 0;
   @if not $nested {
-    $sg: side-gutter(); 
+    $sg: side-gutter();
   }
   @include float($omega-float);
   margin-#{$to}: $sg;
   @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
     #margin-#{$hack}: - $gutter-width;
   }
+}
+
+// Susy Grid Backgrounds -----------------------------------------------------
+
+@mixin susy-grid-background {
+  @include column-grid-background($total-cols, $col-width, $gutter-width, $side-gutter-width, $force-fluid: true);
+}
+
+@mixin show-grid($img:false) {
+  @warn "show-grid is deprecated in favor of susy-grid-background.";
+  @if $img {
+    @warn "show-grid and susy-grid-background no longer use any images or take any arguments.";
+  }
+  @include susy-grid-background;
 }

data/sass/susy/_susy.scss

@@ -1,13 +1,5 @@
-//** Susy **//
+@warn "The 'susy/susy' import is deprecated. Instead: simply import 'susy'.";
 
-// Import all the Important Stuff.
-@import "compass";
-@import "utils";
-@import "grid";
+// Imports -------------------------------------------------------------------
 
-@mixin susy {
-  @warn 'The Susy mixin has been deprecated and is no longer needed. If you 
-  would like to keep using vertical-rhythms (now in compass core), you should 
-  include the establish-baseline mixin instead.';
-  @include establish-baseline;
-}
+@import "grid";

data/templates/project/_base.scss

@@ -1,28 +1,12 @@
-//**
-//  Susy: Un-obtrusive grids for designers
-//  By: Eric A. Meyer and OddBird
-//  Site: susy.oddbird.net
-//**
+// Imports -------------------------------------------------------------------
 
-// Settings --------------------------------------------------------------
-// Susy & Compass use HTML hacks to support IE 6 and 7. You can turn that off:
-// $legacy-support-for-ie6 : false;
-// $legacy-support-for-ie7 : false;
+@import "susy";
 
-// Font Sizes --------------------------------------------------------------
+// Grid ----------------------------------------------------------------------
 
-$base-font-size     : 16px;
-$base-line-height   : 24px;
+$total-cols             : 12;
+$col-width              : 4em;
+$gutter-width           : 1em;
+$side-gutter-width      : $gutter-width;
 
-// Grid --------------------------------------------------------------
-
-$total-cols         : 12;
-$col-width          : 4em;
-$gutter-width       : 1em;
-$side-gutter-width  : $gutter-width;
-
-// Don't move this @import above the GRID variables.
-@import "susy/susy";
-
-// Mixins --------------------------------------------------------------
-// Include additional default settings, variables and mixins here.
+$show-grid-backgrounds  : true;

data/templates/project/manifest.rb

@@ -1,6 +1,5 @@
 stylesheet 'screen.scss', :media => "screen, projection"
 stylesheet '_base.scss'
-image 'grid.png'
 
 description "Susy: a flexible static/fluid/elastic grid system native to compass."
 

data/templates/project/screen.scss

@@ -1,20 +1,10 @@
-//** SCREEN STYLES **//
+// Imports -------------------------------------------------------------------
 
-// Imports --------------------------------------------------------------
-
-@import "compass/reset";
 @import "base";
 
-/* Layout -------------------------------------------------------------- */
-
-// establish your vertical baseline grid.
-// see the compass typography module for details on vertical rhythm.
-@include establish-baseline;
+/* Layout ------------------------------------------------------------------*/
 
-// change '.container' to match your HTML container element
-// or @extend it to apply multiple containers on your site.
 .container {
   @include container;
-  @include show-grid; }
-
-/* Styles -------------------------------------------------------------- */
+  @include susy-grid-background;
+}

metadata

@@ -1,14 +1,12 @@
 --- !ruby/object:Gem::Specification 
 name: compass-susy-plugin
 version: !ruby/object:Gem::Version 
-  hash: 62196253
-  prerelease: 4
+  hash: 25
+  prerelease: 
   segments: 
   - 0
   - 9
-  - beta
-  - 3
-  version: 0.9.beta.3
+  version: "0.9"
 platform: ruby
 authors: 
 - Eric Meyer
@@ -16,8 +14,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2011-03-16 00:00:00 -06:00
-default_executable: 
+date: 2011-04-25 00:00:00 Z
 dependencies: 
 - !ruby/object:Gem::Dependency 
   name: compass
@@ -27,13 +24,12 @@ dependencies:
     requirements: 
     - - ">="
       - !ruby/object:Gem::Version 
-        hash: 62196237
+        hash: 49
         segments: 
         - 0
         - 11
-        - beta
-        - 3
-        version: 0.11.beta.3
+        - 1
+        version: 0.11.1
   type: :runtime
   version_requirements: *id001
 description: Responsive web design with grids the quick and reliable way.
@@ -43,11 +39,12 @@ executables: []
 extensions: []
 
 extra_rdoc_files: 
+- CHANGELOG.mkdn
 - LICENSE.txt
 - README.mkdn
 - lib/susy.rb
-- lib/susy/compass_plugin.rb
 files: 
+- CHANGELOG.mkdn
 - LICENSE.txt
 - Manifest
 - README.mkdn
@@ -55,16 +52,12 @@ files:
 - VERSION
 - compass-susy-plugin.gemspec
 - lib/susy.rb
-- lib/susy/compass_plugin.rb
+- sass/_susy.scss
 - sass/susy/_grid.scss
-- sass/susy/_reset.scss
 - sass/susy/_susy.scss
-- sass/susy/_utils.scss
 - templates/project/_base.scss
-- templates/project/grid.png
 - templates/project/manifest.rb
 - templates/project/screen.scss
-has_rdoc: true
 homepage: http://susy.oddbird.net/
 licenses: []
 
@@ -100,7 +93,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
 requirements: []
 
 rubyforge_project: compass-susy-plugin
-rubygems_version: 1.5.2
+rubygems_version: 1.7.2
 signing_key: 
 specification_version: 3
 summary: A responsive grid system plugin for Compass.

data/lib/susy/compass_plugin.rb

@@ -1,5 +0,0 @@
-options = Hash.new
-options[:stylesheets_directory] = File.expand_path(File.join(File.dirname(__FILE__), '..', '..', 'sass'))
-options[:templates_directory] = File.expand_path(File.join(File.dirname(__FILE__), '..', '..', 'templates'))
-
-Compass::Frameworks.register('susy', options)

data/sass/susy/_reset.scss

@@ -1,9 +0,0 @@
-//** Susy Reset **//
-
-@warn 'The Susy reset is deprecated, as it is now identical to the core Compass 
-reset. It will be removed in the near future. Please change your import from 
-susy/reset to compass/reset.';
-
-/* Reset --------------------------------------------------------------*/
-
-@import "compass/reset";

data/sass/susy/_utils.scss

@@ -1,10 +0,0 @@
-//** Susy Utilities **//
-
-// Apply to your container element(s) to show a grid image.
-@mixin show-grid($src:"grid.png") {
-  background: {
-    image: image-url($src);
-    repeat: repeat;
-    position: $side-gutter-width 0; 
-  }; 
-}