zen-grids 2.0.0.alpha.1 → 2.0.0.alpha.2

data/README.txt

@@ -22,7 +22,7 @@ to a 12 column grid.
                             // each side of each column.
 
   .container {
-    @include zen-grid-container;  // Define the container for your grid items.
+    @include zen-grid-container();  // Define the container for your grid items.
   }
 
   $zen-column-count: 12;  // Set the number of grid columns to use in this media
@@ -31,13 +31,13 @@ to a 12 column grid.
 
   @media all and (min-width: 50em) {
     .sidebar1 {
-      @include zen-grid-item(3, 1);  // Span 3 columns starting in 1st column
+      @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
+      @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
+      @include zen-grid-item(3, 10);  // Span 3 columns starting in 10th column.
     }
   }
 
@@ -76,8 +76,10 @@ of your .sass or .scss files and start creating!
 REQUIREMENTS
 ------------
 
-- Sass 3.1 or later
-- Compass 0.11 or later
+- Sass 3.2 or later
+
+For the zen-grids/background module only:
+- Compass 0.12 or later
 
 
 LICENSE

data/component.json

@@ -1,6 +1,6 @@
 {
   "name": "zen-grids",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.2",
   "author": ["John Albin Wilkins"],
   "homepage": "http://zengrids.com/",
   "styles": [

data/templates/unit-tests/manifest.rb

@@ -6,11 +6,11 @@ stylesheet 'sass/function-zen-half-gutter.scss',     :media => 'all', :to => 'fu
 stylesheet 'sass/function-zen-unit-width.scss',      :media => 'all', :to => 'function-zen-unit-width.scss'
 stylesheet 'sass/zen-clear.scss',                    :media => 'all', :to => 'zen-clear.scss'
 stylesheet 'sass/zen-float.scss',                    :media => 'all', :to => 'zen-float.scss'
+stylesheet 'sass/zen-grid-background.scss',          :media => 'all', :to => 'zen-grid-background.scss'
 stylesheet 'sass/zen-grid-container.scss',           :media => 'all', :to => 'zen-grid-container.scss'
 stylesheet 'sass/zen-grid-flow-item.scss',           :media => 'all', :to => 'zen-grid-flow-item.scss'
 stylesheet 'sass/zen-grid-item-base.scss',           :media => 'all', :to => 'zen-grid-item-base.scss'
 stylesheet 'sass/zen-grid-item.scss',                :media => 'all', :to => 'zen-grid-item.scss'
-stylesheet 'sass/zen-nested-container.scss',         :media => 'all', :to => 'zen-nested-container.scss'
 
 file 'test-results/function-zen-direction-flip.css'
 file 'test-results/function-zen-grid-item-width.css'
@@ -22,7 +22,6 @@ file 'test-results/zen-grid-container.css'
 file 'test-results/zen-grid-flow-item.css'
 file 'test-results/zen-grid-item-base.css'
 file 'test-results/zen-grid-item.css'
-file 'test-results/zen-nested-container.css'
 
 file 'README.txt'
 

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

@@ -25,3 +25,13 @@
   $legacy-support-for-ie6: false;
   $legacy-support-for-ie7: false;
 }
+
+#test-zen-grid-container-4 {
+  /* Test zen-grid-container() with $context = 'grid-item' */
+  @include zen-grid-container('grid-item');
+}
+
+#test-zen-grid-container-5 {
+  /* Test zen-grid-container() with $context = 'flow' */
+  @include zen-grid-container('flow');
+}

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

@@ -38,3 +38,31 @@
 #test-zen-grid-container-3:after {
   clear: both;
 }
+
+#test-zen-grid-container-4 {
+  /* Test zen-grid-container() with $context = 'grid-item' */
+  padding-left: 0;
+  padding-right: 0;
+}
+#test-zen-grid-container-4:before, #test-zen-grid-container-4:after {
+  content: "";
+  display: table;
+}
+#test-zen-grid-container-4:after {
+  clear: both;
+}
+
+#test-zen-grid-container-5 {
+  /* Test zen-grid-container() with $context = 'flow' */
+  margin-left: -10px;
+  margin-right: -10px;
+  padding-left: 0;
+  padding-right: 0;
+}
+#test-zen-grid-container-5:before, #test-zen-grid-container-5:after {
+  content: "";
+  display: table;
+}
+#test-zen-grid-container-5:after {
+  clear: both;
+}

data/zen-grids.gemspec

@@ -9,13 +9,13 @@ Gem::Specification.new do |s|
   s.homepage    = 'http://zengrids.com'
   s.rubyforge_project =
 
-  s.version     = '2.0.0.alpha.1'
-  s.date        = '2013-02-19'
+  s.version     = '2.0.0.alpha.2'
+  s.date        = '2013-02-25'
 
   s.authors     = ['John Albin Wilkins']
   s.email       = 'virtually.johnalbin@gmail.com'
 
-  s.add_runtime_dependency('sass', ">= 3.1")
+  s.add_runtime_dependency('sass', ">= 3.2")
 
   s.files       = %w[
     component.json
@@ -46,7 +46,6 @@ Gem::Specification.new do |s|
     templates/unit-tests/sass/zen-grid-flow-item.scss
     templates/unit-tests/sass/zen-grid-item-base.scss
     templates/unit-tests/sass/zen-grid-item.scss
-    templates/unit-tests/sass/zen-nested-container.scss
     templates/unit-tests/test-results/function-zen-direction-flip.css
     templates/unit-tests/test-results/function-zen-grid-item-width.css
     templates/unit-tests/test-results/function-zen-half-gutter.css
@@ -58,7 +57,6 @@ Gem::Specification.new do |s|
     templates/unit-tests/test-results/zen-grid-flow-item.css
     templates/unit-tests/test-results/zen-grid-item-base.css
     templates/unit-tests/test-results/zen-grid-item.css
-    templates/unit-tests/test-results/zen-nested-container.css
     zen-grids.gemspec
   ]
 end

data/zen-grids/_grids.scss

@@ -33,13 +33,20 @@ $zen-reverse-all-floats           : false       !default;
 
 
 //
-// Apply this to the grid container element.
+// Apply this to create a grid container element.
 // @see http://zengrids.com/help/#zen-grid-container
 //
-@mixin zen-grid-container {
+@mixin zen-grid-container(
+  $context          : 'none',
+  $gutter-width     : $zen-gutter-width,
+  $float-direction  : $zen-float-direction
+) {
+
+  // @TODO: This is a pre-IE8 line of code; don't remember why its needed.
   @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
-    *position: relative; // @TODO: This is a pre-IE8 line of code; don't remember why its needed.
+    *position: relative;
   }
+
   // We use the "micro clearfix", instead of Compass' clearfix or pie-clearfix.
   &:before,
   &:after {
@@ -52,16 +59,21 @@ $zen-reverse-all-floats           : false       !default;
   @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
     *zoom: 1;
   }
-}
 
-//
-// Apply this to any grid item that is also a grid container element for a
-// nested grid. @see http://zengrids.com/help/#zen-nested-container
-//
-@mixin zen-nested-container {
-  padding: {
-    left: 0;
-    right: 0;
+  // Un-do the gutter padding of the parent grid item.
+  @if $context == 'flow' {
+    margin: {
+      left: -(zen-half-gutter($gutter-width, left, $float-direction));
+      right: -(zen-half-gutter($gutter-width, right, $float-direction));
+    }
+  }
+
+  // Prevent any padding from messing up the alignment of the nested grid.
+  @if $context == 'grid-item' or $context == 'flow' {
+    padding: {
+      left: 0;
+      right: 0;
+    }
   }
 }
 

metadata

@@ -7,8 +7,8 @@ version: !ruby/object:Gem::Version
   - 0
   - 0
   - alpha
-  - 1
-  version: 2.0.0.alpha.1
+  - 2
+  version: 2.0.0.alpha.2
 platform: ruby
 authors: 
 - John Albin Wilkins
@@ -16,7 +16,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2013-02-19 00:00:00 +08:00
+date: 2013-02-25 00:00:00 +08:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -28,8 +28,8 @@ dependencies:
       - !ruby/object:Gem::Version 
         segments: 
         - 3
-        - 1
-        version: "3.1"
+        - 2
+        version: "3.2"
   type: :runtime
   version_requirements: *id001
 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.
@@ -69,7 +69,6 @@ files:
 - templates/unit-tests/sass/zen-grid-flow-item.scss
 - templates/unit-tests/sass/zen-grid-item-base.scss
 - templates/unit-tests/sass/zen-grid-item.scss
-- templates/unit-tests/sass/zen-nested-container.scss
 - templates/unit-tests/test-results/function-zen-direction-flip.css
 - templates/unit-tests/test-results/function-zen-grid-item-width.css
 - templates/unit-tests/test-results/function-zen-half-gutter.css
@@ -81,7 +80,6 @@ files:
 - templates/unit-tests/test-results/zen-grid-flow-item.css
 - templates/unit-tests/test-results/zen-grid-item-base.css
 - templates/unit-tests/test-results/zen-grid-item.css
-- templates/unit-tests/test-results/zen-nested-container.css
 - zen-grids.gemspec
 has_rdoc: true
 homepage: http://zengrids.com
@@ -110,7 +108,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: 1.3.1
 requirements: []
 
-rubyforge_project: 2.0.0.alpha.1
+rubyforge_project: 2.0.0.alpha.2
 rubygems_version: 1.3.6
 signing_key: 
 specification_version: 3

data/templates/unit-tests/sass/zen-nested-container.scss

@@ -1,27 +0,0 @@
-/**
- * @file
- * Test zen-nested-container()
- */
-
-@import "zen-grids";
-
-#test-zen-nested-container {
-  /* Test zen-nested-container() */
-  @include zen-nested-container();
-}
-
-#test-zen-nested-container-2 {
-  /* Test zen-nested-container() with $legacy-support-for-ie7: true */
-  $legacy-support-for-ie7: true;
-  @include zen-nested-container();
-  $legacy-support-for-ie7: false;
-}
-
-#test-zen-nested-container-3 {
-  /* Test zen-nested-container() with $legacy-support-for-ie6: true */
-  $legacy-support-for-ie6: true;
-  $legacy-support-for-ie7: true;
-  @include zen-nested-container();
-  $legacy-support-for-ie6: false;
-  $legacy-support-for-ie7: false;
-}

data/templates/unit-tests/test-results/zen-nested-container.css

@@ -1,21 +0,0 @@
-/**
- * @file
- * Test zen-nested-container()
- */
-#test-zen-nested-container {
-  /* Test zen-nested-container() */
-  padding-left: 0;
-  padding-right: 0;
-}
-
-#test-zen-nested-container-2 {
-  /* Test zen-nested-container() with $legacy-support-for-ie7: true */
-  padding-left: 0;
-  padding-right: 0;
-}
-
-#test-zen-nested-container-3 {
-  /* Test zen-nested-container() with $legacy-support-for-ie6: true */
-  padding-left: 0;
-  padding-right: 0;
-}