zen-grids 1.0.rc.2 → 1.0

data/README.txt

@@ -1,9 +1,11 @@
 ABOUT zen-grids
 ---------------
 
-The Zen Grids system is a fluid responsive grid system that is immune to
-rounding errors and overflowing content. With an easy-to-use Sass mixin set, the
-Zen Grids system can be applied to an infinite number of layouts.
+Zen Grids is an intuitive, flexible grid system that leverages the natural
+source order of your content to make it easier to create fluid responsive
+designs. With an easy-to-use Sass mixin set, the Zen Grids system can be applied
+to an infinite number of layouts, including responsive, adaptive, fluid and
+fixed-width layouts.
 
 
 USAGE
@@ -14,21 +16,27 @@ to a 12 column grid.
 
   @import "zen";
 
-  $zen-column-count: 12;    // Set the total number of columns in the grid.
   $zen-gutter-width: 40px;  // Set the gutter size. A half-gutter is used on
                             // each side of each column.
 
   .container {
-    @include zen-grid-container;
+    @include zen-grid-container;  // Define the container for your grid items.
   }
-  .sidebar1 {
-    @include zen-grid-item(3, 1);  // Span 3 columns starting in 1st column
-  }
-  .content {
-    @include zen-grid-item(6, 4);  // Span 6 columns starting in 4th column
-  }
-  .sidebar2 {
-    @include zen-grid-item(3, 10); // Span 3 columns starting in 10th column
+
+  $zen-column-count: 12;  // Set the number of grid columns to use in this media
+                          // query. You'll likely want a different grid for
+                          // different screen sizes.
+
+  @media all and (min-width: 50em) {
+    .sidebar1 {
+      @include zen-grid-item(3, 1);  // Span 3 columns starting in 1st column
+    }
+    .content {
+      @include zen-grid-item(6, 4);  // Span 6 columns starting in 4th column
+    }
+    .sidebar2 {
+      @include zen-grid-item(3, 10); // Span 3 columns starting in 10th column
+    }
   }
 
 Within the .container element, the .sidebar1, .sidebar2 and .content elements
@@ -57,10 +65,6 @@ line:
 
   require 'zen-grids'
 
-For Rails projects, from the project's root directory, run:
-
-  compass install zen-grids
-
 You can then start using Zen Grids in your Sass files. Just add this line to one
 of your .sass or .scss files and start creating!
 

data/stylesheets/zen/_background-grid.scss

@@ -1,22 +1,8 @@
 @import "zen/grids";
 
-// Specify the number of columns in the grid.
-$bg-grid-column-count: $zen-column-count !default;
-
-// Specify the width of the gutters; half of the gutter will be placed on each
-// side of a grid column.
-$bg-grid-gutter-width: $zen-gutter-width !default;
-
 // Specify the column background color.
 $bg-grid-color: #ffdede !default;
 
-// Specify the width of the entire grid. Defaults to 100% for a fluid responsive
-// design, but you can change this to a pixel value if you need a fixed grid.
-$bg-grid-width: $zen-grid-width !default;
-
-// Specify the default floating direction for zen's mixins.
-$bg-float-direction: $zen-float-direction !default;
-
 
 //
 // This mixin currently requires the following markup at the top of the responsive container (e.g. body or div#page, etc.).
@@ -26,11 +12,11 @@ $bg-float-direction: $zen-float-direction !default;
 // </p>
 //
 @mixin -experimental-bg-grid(
-  $column-count: $bg-grid-column-count,
-  $gutter-width: $bg-grid-gutter-width,
+  $column-count: $zen-column-count,
+  $gutter-width: $zen-gutter-width,
   $grid-color: $bg-grid-color,
-  $grid-width: $bg-grid-width,
-  $flow-direction: $bg-float-direction
+  $grid-width: $zen-grid-width,
+  $flow-direction: $zen-float-direction
 ) {
 
   // Internal variables.
@@ -48,7 +34,8 @@ $bg-float-direction: $zen-float-direction !default;
   position: absolute;
   position: fixed;
   z-index: -1;
-  margin: 0 auto;
+  margin-left: auto;
+  margin-right: auto;
   width: $grid-width;
   height: 100%;
   font-size: $font-size;
@@ -67,6 +54,7 @@ $bg-float-direction: $zen-float-direction !default;
   @for $i from 1 through $column-count {
     .bgcol-#{$i} {
       @include zen-grid-item(1, $i, $column-count: $column-count, $gutter-width: $gutter-width, $float-direction: $dir, $auto-include-item-base: false);
+      display: block; // Override display: none applied for grids with different column numbers.
       height: 100%;
       margin-bottom: -($line-height);
       background-color: $grid-color;
@@ -80,6 +68,7 @@ $bg-float-direction: $zen-float-direction !default;
         @include zen-clear();
       }
       @include zen-grid-item(1, $i, $column-count: $column-count, $gutter-width: $gutter-width, $float-direction: $rev, $auto-include-item-base: false);
+      display: block; // Override display: none applied for grids with different column numbers.
     }
   }
   @for $i from ($column-count + 1) through 30 {

data/stylesheets/zen/_grids.scss

@@ -4,7 +4,7 @@
 
 
 // Specify the number of columns in the grid.
-$zen-column-count: 12 !default;
+$zen-column-count: 1 !default;
 
 // Specify the width of the gutters; half of the gutter will be placed on each
 // side of a grid column.

data/templates/project/manifest.rb

@@ -7,7 +7,7 @@ stylesheet 'styles.scss', :media => 'all'
 html 'example.html'
 
 help %Q{
-Zen Grids includes a fluid responsive grid system with an intuitive, flexible layout mechanism that leverages the natural source order of your content. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including adaptive and fixed-width layouts. To learn more, visit:
+Zen Grids is an intuitive, flexible grid system that leverages the natural source order of your content to make it easier to create fluid responsive designs. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including responsive, adaptive, fluid and fixed-width layouts. To learn more, visit:
 
   http://zengrids.com
 }

data/templates/unit-tests/sass/zen-grid-item.scss

@@ -7,6 +7,7 @@
 
 #test-zen-grid-item {
   /* Test zen-grid-item(6, 4) with 12 column grid and 20px gutter */
+  $zen-column-count: 12;
   @include zen-grid-item(6, 4);
 
   /* Test zen-grid-item(3, 3) with box-sizing: content-box, 5 column grid and 10% gutter */

data/templates/unit-tests/test-results/zen-grid-flow-item.css

@@ -7,7 +7,7 @@
   /* Test zen-grid-flow-item(1) without setting $column-count */
   margin-left: -10px;
   margin-right: 10px;
-  width: 8.333%;
+  width: 100%;
   padding-left: 10px;
   padding-right: 10px;
   -moz-box-sizing: border-box;

data/zen-grids.gemspec

@@ -4,13 +4,13 @@ Gem::Specification.new do |s|
   s.name        = 'zen-grids'
 
   s.summary     = %q{A Compass plugin for Zen Grids, a fluid responsive grid system}
-  s.description = %q{Zen Grids includes a fluid responsive grid system with an intuitive, flexible layout mechanism that leverages the natural source order of your content. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including adaptive and fixed-width layouts.}
+  s.description = %q{Zen Grids is an intuitive, flexible grid system that leverages the natural source order of your content to make it easier to create fluid responsive designs. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including responsive, adaptive, fluid and fixed-width layouts.}
 
   s.homepage    = 'http://zengrids.com'
   s.rubyforge_project =
 
-  s.version     = '1.0.rc.2'
-  s.date        = '2012-04-03'
+  s.version     = '1.0'
+  s.date        = '2012-04-26'
 
   s.authors     = ['John Albin Wilkins']
   s.email       = 'virtually.johnalbin@gmail.com'

metadata

@@ -1,13 +1,11 @@
 --- !ruby/object:Gem::Specification 
 name: zen-grids
 version: !ruby/object:Gem::Version 
-  prerelease: true
+  prerelease: false
   segments: 
   - 1
   - 0
-  - rc
-  - 2
-  version: 1.0.rc.2
+  version: "1.0"
 platform: ruby
 authors: 
 - John Albin Wilkins
@@ -15,7 +13,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2012-04-03 00:00:00 +08:00
+date: 2012-04-26 00:00:00 +08:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -31,7 +29,7 @@ dependencies:
         version: "3.1"
   type: :runtime
   version_requirements: *id001
-description: Zen Grids includes a fluid responsive grid system with an intuitive, flexible layout mechanism that leverages the natural source order of your content. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including adaptive and fixed-width layouts.
+description: Zen Grids is an intuitive, flexible grid system that leverages the natural source order of your content to make it easier to create fluid responsive designs. With an easy-to-use Sass mixin set, the Zen Grids system can be applied to an infinite number of layouts, including responsive, adaptive, fluid and fixed-width layouts.
 email: virtually.johnalbin@gmail.com
 executables: []
 
@@ -88,16 +86,14 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: "0"
 required_rubygems_version: !ruby/object:Gem::Requirement 
   requirements: 
-  - - ">"
+  - - ">="
     - !ruby/object:Gem::Version 
       segments: 
-      - 1
-      - 3
-      - 1
-      version: 1.3.1
+      - 0
+      version: "0"
 requirements: []
 
-rubyforge_project: 1.0.rc.2
+rubyforge_project: "1.0"
 rubygems_version: 1.3.6
 signing_key: 
 specification_version: 3