carljm-compass-susy-plugin 0.3.0 → 0.3.1

data/Manifest

@@ -6,6 +6,8 @@ Rakefile
 README.mkdn
 sass/susy/_grid.sass
 sass/susy/_utils.sass
+sass/susy/_text.sass
+sass/susy/_susy.sass
 templates/project/print.sass
 templates/project/screen.sass
 templates/project/ie.sass

data/README.mkdn

@@ -18,14 +18,14 @@ easily - and always in flexible percentages.
 Install 
 =======
 
-  sudo gem sources --add http://gems.github.com/ 
-  sudo gem install chriseppstein-compass 
-  sudo gem install ericam-compass-susy-plugin
+    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>
+    compass -r susy -f susy <project name>
 
 Then edit your `_base.sass`, `screen.sass` and `print.sass` files accordingly.
 A reset is added automatically.
@@ -42,11 +42,11 @@ of columns), and `!gutter_width` (width of gutters) variables in your
 
 Example:
 
-  !grid_unit = "em" 
-  !total_cols = 10 
-  !col_width = 7 
-  !gutter_width = 1
-  !side_gutter_width = 2
+    !grid_unit = "em" 
+    !total_cols = 10 
+    !col_width = 7 
+    !gutter_width = 1
+    !side_gutter_width = 2
 
 The default values are 16 columns, 4em column widths, and 1em gutters and side
 gutters that match the internal ones.
@@ -59,8 +59,8 @@ percentage of the common browser default (16px) and apply them to your
 
 Example:
 
-  !base_font_size_px = 14 
-  !base_line_height_px = 16
+    !base_font_size_px = 14 
+    !base_line_height_px = 16
 
 The default values are 12px fonts with an 18px line-height.
 
@@ -71,10 +71,9 @@ ought have a default (but don't because of the reset).
 Making Semantic Grids 
 =====================
 
-* Use the `+susy` mixin to get things ready, set your base fonts and
-  center your grid in the browser window. Change the alignment of your
-  grid in the window with an optional `left | center | right`
-  argument.
+* Use the `+susy` mixin to get things ready, set your base font sizes and
+  center your grid in the browser window. Change the alignment of your grid
+  in the window with an optional `left | center | right` argument.
 
 * Use the `+container` mixin to declare your container
   element. Besides building the grid shell, this sets your horizontal
@@ -82,15 +81,18 @@ Making Semantic Grids
   text-alignment to "left". Change the internal text alignment with an
   optional `left | center | right` argument.
 
-* Use the `+column` mixin to declare a grid element. The first
-  argument is the number of columns to span, the second (optional)
-  argument is the size (in columns) of the containing element when
-  nesting (defaults to the container's `!total_cols`).
+* Use the `+columns` mixin to set the width (in columns) of a grid element. 
+  The first argument is the number of columns to span, the second (optional)
+  argument is the width (in columns) of the containing element when nesting
+  (defaults to the container's `!total_cols`). By default, the left margin
+  is set to 0 and the right margin is set to the width of a gutter. Modify
+  this for first and last elements with the `+alpha` and `+omega` mixins
+  (below), or set larger margins using `+prefix` and `+suffix`.
 
 * Use the `+alpha` and `+omega` mixins to declare the first and last
-  elements in a row, or inside a nested element. In the latter case,
-  each of these mixins takes one argument, which is the size (in
-  columns) of the containing element.
+  elements in a row, or inside a nested element. In the latter case, each of
+  these mixins takes one argument, which is the size (in columns) of the
+  containing element.
 
 * Use the `+prefix` and `+suffix` mixins with one argument to add that
   many grid columns as margin before or after a grid element. These
@@ -99,23 +101,23 @@ Making Semantic Grids
 
 Example:
 
-  body 
-    +susy
-
-    #page 
-      +container 
-      #left-nav 
-        +columns(3) 
-        +alpha
-        #main-content 
-          +prefix(2)
-          +columns(4, 10) 
-          +omega 
-          .header 
-            +columns(1, 4) 
-          .article 
-            +columns(3, 4) 
-            +omega
+    body 
+      +susy
+
+      #page 
+        +container 
+        #left-nav 
+          +columns(3) 
+          +alpha
+          #main-content 
+            +prefix(2)
+            +columns(4, 10) 
+            +omega 
+            .header 
+              +columns(1, 4) 
+            .article 
+              +columns(3, 4) 
+              +omega
 
 Extra Utility Mixins 
 =====================

data/VERSION

@@ -1 +1 @@
-0.3.0
+0.3.1

data/compass-susy-plugin.gemspec

@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |s|
   s.name = %q{compass-susy-plugin}
-  s.version = "0.3.0"
+  s.version = "0.3.1"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 1.2") if s.respond_to? :required_rubygems_version=
   s.authors = ["Eric Meyer"]
@@ -10,7 +10,7 @@ Gem::Specification.new do |s|
   s.description = %q{Susy is a ground-up native Compass plugin grid system that takes full advantage of Sass' capabilities to remove the tedium from grid-based web design.}
   s.email = %q{eric@oddbird.net}
   s.extra_rdoc_files = ["lib/susy/compass_plugin.rb", "lib/susy/sass_extensions.rb", "lib/susy.rb", "README.mkdn"]
-  s.files = ["lib/susy/compass_plugin.rb", "lib/susy/sass_extensions.rb", "lib/susy.rb", "Manifest", "Rakefile", "README.mkdn", "sass/susy/_grid.sass", "sass/susy/_utils.sass", "templates/project/_base.sass", "templates/project/screen.sass", "templates/project/print.sass", "templates/project/ie.sass", "templates/project/manifest.rb", "VERSION", "LICENSE.txt", "compass-susy-plugin.gemspec"]
+  s.files = ["lib/susy/compass_plugin.rb", "lib/susy/sass_extensions.rb", "lib/susy.rb", "Manifest", "Rakefile", "README.mkdn", "sass/susy/_grid.sass", "sass/susy/_utils.sass", "sass/susy/_text.sass", "sass/susy/_susy.sass", "templates/project/_base.sass", "templates/project/screen.sass", "templates/project/print.sass", "templates/project/ie.sass", "templates/project/manifest.rb", "VERSION", "LICENSE.txt", "compass-susy-plugin.gemspec"]
   s.homepage = %q{http://github.com/ericam/compass-susy-plugin}
   s.rdoc_options = ["--line-numbers", "--inline-source", "--title", "Compass-Susy-plugin", "--main", "README.mkdn"]
   s.require_paths = ["lib"]

data/sass/susy/_susy.sass

@@ -0,0 +1,14 @@
+@import utils.sass
+@import text.sass
+@import grid.sass
+
+//** 
+  body font size set to browser default (usually 16px)
+=susy(!align = "center")
+  //  text-align set to center by default for auto-centering layouts 
+  //  (override !align for left/right-aligned designs)
+  :text-align= !align
+  //  set your base font sizes
+  :font-size= !base_font_size
+  :line-height= !base_line_height
+

data/sass/susy/_text.sass

@@ -0,0 +1,19 @@
+//** Text Settings **//
+
+//** 
+  You set the font and line heights in pixels
+!base_font_size_px ||= 12
+!base_line_height_px ||= 18
+
+
+//** 
+  Susy can do the math to make that relative
+!base_font_size = (!base_font_size_px / 16) * 100 + "%"
+!base_line_height = (!base_line_height_px / !base_font_size_px) * 100 + "%"
+
+//** 
+  Because some serif fonts add line-height when switching to italics inline:
+=inline-italic
+  :font-style italic
+  :line-height .5
+

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification 
 name: carljm-compass-susy-plugin
 version: !ruby/object:Gem::Version 
-  version: 0.3.0
+  version: 0.3.1
 platform: ruby
 authors: 
 - Eric Meyer
@@ -52,6 +52,8 @@ files:
 - README.mkdn
 - sass/susy/_grid.sass
 - sass/susy/_utils.sass
+- sass/susy/_text.sass
+- sass/susy/_susy.sass
 - templates/project/_base.sass
 - templates/project/screen.sass
 - templates/project/print.sass