compass-susy-plugin 0.7.0.pre6 → 0.7.0.pre7

data/templates/project/screen.scss

@@ -0,0 +1,36 @@
+/* Welcome to Susy. Use this file to define screen styles.
+ * Import this file using the following HTML or equivalent:
+ * <link href="/stylesheets/screen.css" media="screen" rel="stylesheet" type="text/css" /> */
+
+@import "defaults";
+
+/* @group STRUCTURE */
+
+@include susy;
+
+// change '#page' to match your HTML container element(s)
+#page {
+  @include container; }
+
+/* @end */
+
+/* @group COMPONENTS by type */
+
+/* @end */
+
+/* @group OVERRIDES by content */
+
+/* @end */
+
+/* @group OVERRIDES by page */
+
+/* @end */
+
+/* @group DEBUG */
+
+// Uncomment, adjust and use for debugging
+
+// #page {
+//   @include show-grid("your-grid-image.png"); }
+
+/* @end */

metadata

@@ -6,8 +6,8 @@ version: !ruby/object:Gem::Version
   - 0
   - 7
   - 0
-  - pre6
-  version: 0.7.0.pre6
+  - pre7
+  version: 0.7.0.pre7
 platform: ruby
 authors: 
 - Eric Meyer
@@ -15,7 +15,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2010-03-18 00:00:00 -06:00
+date: 2010-04-13 00:00:00 -06:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -29,8 +29,8 @@ dependencies:
         - 0
         - 10
         - 0
-        - pre1
-        version: 0.10.0.pre1
+        - rc2
+        version: 0.10.0.rc2
   type: :runtime
   version_requirements: *id001
 description: 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.
@@ -55,18 +55,18 @@ files:
 - lib/susy.rb
 - lib/susy/compass_plugin.rb
 - lib/susy/sass_extensions.rb
-- sass/susy/_grid.sass
-- sass/susy/_reset.sass
-- sass/susy/_susy.sass
-- sass/susy/_text.sass
-- sass/susy/_utils.sass
-- sass/susy/_vertical_rhythm.sass
-- templates/project/_base.sass
-- templates/project/_defaults.sass
-- templates/project/ie.sass
+- sass/susy/_grid.scss
+- sass/susy/_reset.scss
+- sass/susy/_susy.scss
+- sass/susy/_text.scss
+- sass/susy/_utils.scss
+- sass/susy/_vertical_rhythm.scss
+- templates/project/_base.scss
+- templates/project/_defaults.scss
+- templates/project/ie.scss
 - templates/project/manifest.rb
-- templates/project/print.sass
-- templates/project/screen.sass
+- templates/project/print.scss
+- templates/project/screen.scss
 has_rdoc: true
 homepage: http://github.com/ericam/compass-susy-plugin
 licenses: []

data/sass/susy/_grid.sass

@@ -1,126 +0,0 @@
-//** The Susy Grid **//
-// Updated 11.20.2009 by Eric A. Meyer
-
-
-// Your basic settings for the grid.
-// Override these in base.sass to customize your site.
-!total_cols ||= 12
-!col_width ||= 4em
-!gutter_width ||= 1em
-!side_gutter_width ||= !gutter_width
-
-
-// Susy will set your outer shell based on the variables above.
-!container_width = container(!total_cols, !col_width, !gutter_width, !side_gutter_width)
-
-
-// Set on the outer grid-containing element(s).
-=container(!align = "left")
-  // clear all floated columns
-  +clearfix
-  // align the text back to the left (override for other alignments)
-  text-align= !align
-  // use auto horizontal margins to center your page in the body
-  margin:
-    left: auto
-    right: auto
-  // set the page width based on column settings
-  width= !container_width
-  // never exceed 100% of the browser window (no side-scrolling)
-  max-width: 100%
-
-
-// Set on any column element, even nested ones.
-// The first agument [required] is the number of columns to span.
-// The second argument is the context (columns spanned by parent).
-//  - Context is required on any nested elements.
-//  - Context MUST NOT be declared on a top-level element.
-// By default a grid-column is floated left with a right gutter.
-//  - Override those with +float("right"), +alpha or +omega
-=columns(!n, !context = false)
-  // the column is floated left
-  +float("left")
-  // 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-right= gutter(!context)
-
-
-// Set on any element to add empty colums as padding before or after.
-=prefix(!n, !context = false)
-  padding-left= columns(!n, !context) + gutter(!context)
-
-=suffix(!n, !context = false)
-  padding-right= columns(!n, !context) + gutter(!context)
-
-
-// Set as a shortcut for both prefix and suffix.
-=pad(!p = 0, !s = 0, !c = false)
-  @if !p != 0
-    +prefix(!p,!c)
-  @if !s != 0
-    +suffix(!s,!c)
-
-
-// Set 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.
-=alpha(!nested = false)
-  @if !nested == false
-    margin-left= side_gutter()
-
-
-// When global constant !hacks == true:
-//  - this will be called automatically with hacks
-// When global constant !hacks == false:
-//  - you can call it yourself in ie.sass without the hacks
-=ie-omega(!nested = false, !dir = "right", !hack = false)
-  !s = side_gutter()
-  @if !dir == "right"
-    @if !hack
-      #margin-left: -1%
-    @else
-      margin-left: -1%
-  @else
-    @if !nested
-      @if !hack
-        #margin-right: -1%
-      @else
-        margin-right: -1%
-    @else
-      @if !hack
-        #margin-right= !s - 1%
-      @else
-        margin-right= !s - 1%
-
-
-// Sets the direction that +omega elements are floated
-//  - Override !omega_float globally or set +float locally to change
-!omega_float ||= "right"
-
-
-// Set omega on the last element of a row 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.
-=omega(!nested = false)
-  +float(!omega_float)
-  @if !nested
-    margin-right: 0
-  @else
-    margin-right= side_gutter()
-  @if !hacks
-    /* ugly hacks for IE6-7 */
-    +ie-omega(!nested, !omega_float, true)
-    /* end ugly hacks */
-    
-    
-// Set on an element that will span it's entire context.
-// - no need for +columns, +alpha or +omega on a +full element.
-=full(!nested = false)
-  clear: both
-  @if !nested == false
-    !s = side_gutter()
-    margin-right= !s
-    margin-left= !s

data/sass/susy/_reset.sass

@@ -1,6 +0,0 @@
-/* @group reset */
-@import compass/reset.sass
-
-// HTML5 reset
-+reset-html5
-/* @end */

data/sass/susy/_susy.sass

@@ -1,22 +0,0 @@
-//** Susy **//
-// Updated 01.19.2010 by Eric A. Meyer
-
-
-// Tell susy whether you are using hacks or conditional comments.
-!hacks ||= true
-
-
-// Import all the Important Stuff.
-@import compass/css3.sass
-@import utils.sass
-@import text.sass
-@import grid.sass
-
-
-// Set Susy on your BODY element to get things started.
-=susy(!align = "center")
-  +establish-baseline
-  // text-align set to center by default for auto-centering layouts 
-  //  - override !align for left/right-aligned designs
-  body
-    text-align= !align

data/sass/susy/_text.sass

@@ -1,6 +0,0 @@
-//** Susy Text Settings **//
-// Updated 01.19.2010 by Eric A. Meyer
-
-@import vertical_rhythm.sass
-
-!px2em = 1em / !base_font_size

data/sass/susy/_utils.sass

@@ -1,80 +0,0 @@
-//** Susy Utilities **//
-// Updated 11.20.2009 by Eric A. Meyer
-
-
-// An extension of the Compass Core Utilities
-@import compass/utilities.sass
-
-
-// Apply to you container element(s) to show a grid image.
-//  - You need to supply the image. Susy can't do everything.
-=show-grid(!src)
-  background:
-    image= image_url(!src)
-    repeat: repeat 
-    position= !side_gutter_width 0
-
-// Brings IE in line with inline-block display
-//  - Using hacks if called automatically because !hacks == true
-//  - Or not, if you call it from ie.sass because !hacks == false
-=ie-inline-block(!hack = false)
-  @if !hack
-    /* ugly hacks for IE6-7 */
-    #display: inline
-    // fixes alignment against native input/button on IE6
-    #vertical-align: auto
-    /* end ugly hacks */
-  @else
-    display: inline
-    // fixes alignment against native input/button on IE6
-    vertical-align: auto
-
-
-// An override for compass inline-block that lets you take advantage
-// of Susys !hacks constant. if true, hacks. if false, use ie-inline-block
-// to help ie along in your ie.sass
-=inline-block
-  display: -moz-inline-box
-  -moz-box-orient: vertical
-  display: inline-block
-  vertical-align: middle
-  @if !hacks
-    +ie-inline-block(true)
-
-
-// An inline-block list that works in IE
-// For those awkward moments when a floated horizontal list just wont cut it
-// NOTE: If global !hacks == false:
-//  - you'll need to fix list items in ie.sass with +ie-inline-block
-=inline-block-list(!hpad = 0)
-  +horizontal-list-container
-  li
-    +no-bullet
-    +inline-block
-    white-space: no-wrap
-    padding:
-      left= !hpad
-      right= !hpad
-
-
-// Hide an element from the viewport, but keep it around for accessability
-=hide
-  position: absolute
-  top: -9999em
-
-
-// Apply to skip-to-content accessibility links that will appear on focus.
-//  - Set the location arguments if you care where it appears.
-=skip-link(!t = 0, !r = false, !b = false, !l = false)
-  +hide
-  display: block
-  &:focus
-    @if !t
-      top= !t
-    @if !r
-      right= !r
-    @if !b
-      bottom= !b
-    @if !l
-      left= !l
-    z-index: 999

data/sass/susy/_vertical_rhythm.sass

@@ -1,101 +0,0 @@
-//** Vertical Rhythm **//
-// By Chris Eppstein and Eric Meyer, living here on a temporary basis
-
-
-// set the default border style for rhythm borders
-!default_rhythm_border_style = "solid"
-
-// The IE font ratio is a fact of life. Deal with it.
-!ie_font_ratio = 16px / 100%
- 
-// The base line height is the basic unit of line hightness.
-!base_line_height ||= 18px
- 
-// The base font size
-!base_font_size ||= 12px
- 
-// The basic unit of font rhythm
-!base_rhythm_unit= !base_line_height / !base_font_size * 1em
- 
-// The leader is the amount of whitespace in a line.
-// It might be useful in your calculations
-!base_leader = (!base_line_height - !base_font_size) * 1em / !base_font_size
- 
-// The half-leader is the amount of whitespace above and below a line.
-// It might be useful in your calculations
-!base_half_leader = !base_leader / 2
- 
-// Establishes a font baseline for the given font-size in pixels
-=establish-baseline(!font_size = !base_font_size)
-  body
-    font-size= !font_size / !ie_font_ratio
-    +adjust-leading-to(1, !font_size)
-  html>body
-    font-size= !font_size
- 
-// Show a background image that can be used to debug your alignments.
-=debug-vertical-alignment
-  background: url(underline.png)
- 
-// Adjust a block to have a different font size and leading to maintain the rhythm.
-// !lines is a number that is how many times the baseline rhythm this
-// font size should use up. Does not have to be an integer, but it defaults
-// to the smallest integer that is large enough to fit the font.
-// Use !from_size to adjust from a non-base font-size.
-=adjust-font-size-to(!to_size, !lines = ceil(!to_size / !base_line_height), !from_size = !base_font_size)
-  font-size= 1em * !to_size / !from_size
-  +adjust-leading-to(!lines, !to_size)
-
-=adjust-leading-to(!lines, !font_size = !base_font_size)
-  line-height= 1em * !lines * !base_line_height / !font_size
- 
-// Apply leading whitespace
-=leader(!lines = 1, !font_size = !base_font_size, !property = "margin")
-  #{!property}-top= 1em * !lines * !base_line_height / !font_size
-
-=padding-leader(!lines = 1, !font_size = !base_font_size)
-  +leader(!lines, !font_size, "padding")
-
-=margin-leader(!lines = 1, !font_size = !base_font_size)
-  +leader(!lines, !font_size, "margin")
-
-// Apply trailing whitespace
-=trailer(!lines = 1, !font_size = !base_font_size, !property = "margin")
-  #{!property}-bottom= 1em * !lines * !base_line_height / !font_size
-
-=padding-trailer(!lines = 1, !font_size = !base_font_size)
-  +trailer(!lines, !font_size, "padding")
-
-=margin-trailer(!lines = 1, !font_size = !base_font_size)
-  +trailer(!lines, !font_size, "margin")
- 
-// Apply a border width to any side without destroying the vertical rhythm
-=apply-side-rhythm-border(!side, !width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  border-#{!side}:
-    style= !border_style
-    width= 1em * !width / !font_size
-  padding-#{!side}= (1em / !font_size) * ((!lines * !base_line_height) - !width)
-
-// Aplly rhythm borders equally to all sides 
-=rhythm-borders(!width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  border:
-    style= !border_style
-    width= 1em * !width / !font_size
-  padding= (1em / !font_size) * ((!lines * !base_line_height) - !width)
-
-// Apply a leading rhythm border 
-=leading-border(!width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  +apply-side-rhythm-border("top", !width, !lines, !font_size, !border_style)
-
-// Apply a trailing rhythm border
-=trailing-border(!width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  +apply-side-rhythm-border("bottom", !width, !lines, !font_size, !border_style)
-
-// Apply both leading and trailing rhythm borders
-=horizontal-borders(!width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  +leading-border(!width, !lines, !font_size, !border_style) 
-  +trailing-border(!width, !lines, !font_size, !border_style)
-
-=h-borders(!width = 1px, !lines = 1, !font_size = !base_font_size, !border_style = !default_rhythm_border_style)
-  +horizontal-borders(!width, !lines, !font_size, !border_style)
-