From b5034a917e4268d38e9a2c7edce92a2262893555 Mon Sep 17 00:00:00 2001
From: Chris Eppstein <chris@eppsteins.net>
Date: Sat, 29 Nov 2008 01:15:12 -0800
Subject: [PATCH] Added the YUI grids module. It compiles and generates roughly
 the expected output, but is not well tested yet.

---
 frameworks/yui/stylesheets/yui/_screen.sass   |   4 +-
 .../yui/stylesheets/yui/modules/_grids.sass   | 333 ++++++++++++++++++
 test/compass_test.rb                          |  27 +-
 test/fixtures/yui/templates/grids.sass        |   3 +
 4 files changed, 355 insertions(+), 12 deletions(-)
 create mode 100644 frameworks/yui/stylesheets/yui/modules/_grids.sass
 create mode 100644 test/fixtures/yui/templates/grids.sass

diff --git a/frameworks/yui/stylesheets/yui/_screen.sass b/frameworks/yui/stylesheets/yui/_screen.sass
index 680fa8f3..2b78b098 100644
--- a/frameworks/yui/stylesheets/yui/_screen.sass
+++ b/frameworks/yui/stylesheets/yui/_screen.sass
@@ -1,5 +1,7 @@
 @import modules/base.sass
 @import modules/fonts.sass
+@import modules/grids.sass
 =yui
   +yui-base
-  +yui-base-fonts
\ No newline at end of file
+  +yui-base-fonts
+  +yui-grids
\ No newline at end of file
diff --git a/frameworks/yui/stylesheets/yui/modules/_grids.sass b/frameworks/yui/stylesheets/yui/modules/_grids.sass
new file mode 100644
index 00000000..93dab7d1
--- /dev/null
+++ b/frameworks/yui/stylesheets/yui/modules/_grids.sass
@@ -0,0 +1,333 @@
+@import compass/utilities/general/clearfix.sass
+@import fonts.sass
+
+// Note: This is not really tested yet. Use at your own risk.
+
+=yui-grids
+  +yui-grids-init
+  #ft
+    :clear both
+  #bd
+    +clearfix
+  #doc
+    +yui-document(750px)
+  #doc2
+    +yui-document(950px)
+  #doc3
+    +yui-document("fluid")
+  #doc4
+    +yui-document(974px)
+  .yui-t1
+    +yui-two-column-left-template(160px)
+  .yui-t2
+    +yui-two-column-left-template(180px)
+  .yui-t3
+    +yui-two-column-left-template(300px)
+  .yui-t4
+    +yui-two-column-right-template(180px)
+  .yui-t5
+    +yui-two-column-right-template(240px)
+  .yui-t6
+    +yui-two-column-right-template(300px)
+  +yui-grid-divisions
+
+=yui-grids-init(!footer_id = "ft", !content_id = "bd")
+  body
+    :text-align center
+
+=em-size(!style, !px_size, !base_font_size = !default_base_font_size)
+  :#{!style}= 1em * !px_size / !base_font_size
+
+=em-size-hacked(!style, !px_size, !base_font_size = !default_base_font_size)
+  +em-size(!style, !px_size, !base_font_size)
+  +em-size("*"+!style, !px_size * 39 / 40, !base_font_size)
+
+// All documents must have these styles. Setting a min-width is optional, but recommended. To omit it, pass false as the min_width value.
+=yui-document-base(!min_width = 750px)
+  :margin auto
+  :text-align left
+  @if !min_width
+    :min-width= !min_width
+
+=yui-block-base
+  :position relative
+  :_position static
+
+=yui-main-block
+  :position static
+  :float none
+  :width auto
+
+
+// Creates a fixed width document container
+// Pass "fluid" for the width to create a document that grows with the width of the browser.
+=yui-document(!width, !min_width = 750px, !base_font_size = !default_base_font_size)
+  +yui-document-base(!min_width)
+  @if !width == "fluid"
+    :margin auto 10px
+    :width auto
+  @else
+    +em-size-hacked("width", !width, !base_font_size)
+
+=yui-two-column-left-template(!column_width, !main_selector = "#yui-main", !block_selector = ".yui-b", !document_width = 750px, !min_width = 750px, !base_font_size = !default_base_font_size)
+  +yui-document(!document_width, !min_width, !base_font_size)
+  #{!main_selector}
+    :width 100%
+    :float right
+    +em-size("margin-left", -!column_width - 10px, !base_font_size)
+    #{!block_selector}
+      +yui-main-block
+      +em-size-hacked("margin-left", !column_width, !base_font_size)
+  #{!block_selector}
+    +yui-block-base
+    :float left
+    +em-size-hacked("width", !column_width, !base_font_size)
+
+=yui-two-column-right-template(!column_width, !main_selector = "#yui-main", !block_selector = ".yui-b", !document_width = 750px, !min_width = 750px, !base_font_size = !default_base_font_size)
+  +yui-document(!document_width, !min_width, !base_font_size)
+  #{!main_selector}
+    :width 100%
+    :float left
+    +em-size("margin-right", -!column_width - 10px, !base_font_size)
+    #{!block_selector}
+      +yui-main-block
+      +em-size-hacked("margin-right", !column_width, !base_font_size)
+  #{!block_selector}
+    +yui-block-base
+    :float right
+    +em-size-hacked("width", !column_width, !base_font_size)
+
+=yui-one-column-template(!main_selector = "#yui-main", !block_selector = ".yui-b", !document_width = 750px, !min_width = 750px, !base_font_size = !default_base_font_size)
+  +yui-document(!document_width, !min_width, !base_font_size)
+  #{!main_selector}
+    :width 100%
+    #{!block_selector}
+      +yui-main-block
+      :display block
+      :margin 0 0 1em 0
+  #{!block_selector}
+    +yui-block-base
+
+=yui-custom-template(!main_selector = "#yui-main", !block_selector = ".yui-b")
+  #{!main_selector}
+    :width 100%
+    #{!block_selector}
+      +yui-main-block
+  #{!block_selector}
+    +yui-block-base
+
+=yui-one-third-grid
+  float: left
+  margin-left: 2%
+  width: 32%
+
+=yui-grid-divisions(!unit = ".yui-u", !g_50_50 = ".yui-g", !g_33_33_33 = ".yui-gb", !g_67_33 = ".yui-gc", !g_33_67 = ".yui-gd", !g_75_25 = ".yui-ge", !g_25_75 = ".yui-gf")
+  #{nest(!g_50_50, !g_33_33_33, !unit)},
+  #{nest(!g_67_33, !unit)},
+  #{nest(!g_67_33, !g_50_50)},
+  #{nest(!g_33_67, !unit)}
+    +yui-one-third-grid
+
+  #{!g_33_33_33}
+    #{!g_50_50},
+    #{!g_33_33_33},
+    #{!g_67_33},
+    #{!g_33_67},
+    #{!g_75_25},
+    #{!g_25_75},
+    #{!unit}
+      +yui-one-third-grid
+    #{!g_33_33_33},
+    #{!g_67_33}
+      #{!unit}
+        *margin-left: 1.8%
+        _margin-left: 4%
+
+  #{nest(!g_50_50, !g_33_33_33, !unit)}
+    _margin-left: .8%
+
+  #{nest(!g_33_33_33, !unit)}
+    float: right
+
+  #{nest(!g_33_33_33, div.first)}
+    margin-left: 0
+    float: left
+
+  #{!g_50_50},
+  #{!g_33_33_33}
+    #{!g_33_33_33}
+      div.first
+        *margin-right: 0
+        *width: 32%
+        _width: 31.7%
+
+  #{!g_33_33_33}
+    #{!g_67_33},
+    #{!g_33_67}
+      div.first
+    *margin-right: 0
+
+  #{nest(!g_33_33_33, !g_33_67, !unit)}
+    *width: 66%
+    _width: 61.2%
+
+  #{nest(!g_33_33_33, !g_33_67, div.first)}
+    *width: 31%
+    _width: 29.5%
+
+  #{!g_50_50},
+  #{!g_33_33_33}
+    #{!g_67_33}
+      #{!unit}
+        width: 32%
+        _float: right
+        margin-right: 0
+        _margin-left: 0
+
+  #{nest(!g_33_33_33, !g_67_33, div.first)}
+    width: 66%
+    *float: left
+    *margin-left: 0
+
+  #{!g_33_33_33}
+    #{!g_75_25},
+    #{!g_25_75}
+      #{!unit}
+        margin: 0
+
+  #{nest(!g_50_50, !unit)},
+  #{nest(!g_50_50, !g_50_50)},
+  #{nest(!g_50_50, !g_33_33_33)},
+  #{nest(!g_50_50, !g_67_33)},
+  #{nest(!g_50_50, !g_33_67)},
+  #{nest(!g_50_50, !g_75_25)},
+  #{nest(!g_50_50, !g_25_75)},
+  #{nest(!g_67_33, !unit)},
+  #{nest(!g_33_67, !g_50_50)},
+  #{nest(!g_50_50, !g_67_33, !unit)},
+  #{nest(!g_75_25, !unit)},
+  #{nest(!g_75_25, !g_50_50)},
+  #{nest(!g_25_75, !g_50_50)},
+  #{nest(!g_25_75, !unit)}
+    float: right
+
+  #{nest(!g_50_50, !g_67_33)},
+  #{nest(!g_50_50, !g_75_25)},
+  #{!g_50_50},
+  #{!g_67_33},
+  #{nest(!g_67_33, div.first)},
+  #{!g_33_67},
+  #{!g_75_25},
+  #{!g_25_75}
+    div.first
+      float: left
+
+  #{!g_50_50},
+  #{!g_33_33_33},
+  #{!g_67_33},
+  #{!g_33_67},
+  #{!g_75_25},
+  #{!g_25_75}
+    #{!g_50_50}
+      #{!unit}
+        width: 49%
+        *width: 48.1%
+        *margin-left: 0
+
+  #{nest(!g_50_50, !g_50_50, div.first)}
+    *margin: 0
+
+  #{nest(!g_33_33_33, !g_50_50, div.first)}
+    *margin-right: 4%
+    _margin-right: 1.3%
+
+  #{nest(!g_33_33_33, !g_33_33_33, !unit)}
+    _margin-left: .7%
+
+  #{nest(!g_33_33_33, !g_50_50)},
+  #{nest(!g_33_33_33, !g_33_33_33)}
+    div.first
+      *margin-left: 0
+
+  #{!g_67_33},
+  #{!g_33_67}
+    #{!g_50_50}
+      #{!unit}
+        *width: 48.1%
+        *margin-left: 0
+
+  #{!g_50_50}
+    #{!unit},
+    #{!g_50_50},
+    #{!g_33_33_33},
+    #{!g_67_33},
+    #{!g_33_67},
+    #{!g_75_25},
+    #{!g_25_75}
+      width: 49.1%
+
+  #{nest(!g_50_50, !g_33_33_33)},
+  #{!g_33_33_33},
+  #{!g_67_33},
+  #{!g_33_67}
+    div.first
+      margin-left: 0
+
+  #{nest(!g_50_50, !g_67_33, div.first)},
+  #{nest(!g_67_33, div.first)},
+  #{nest(!g_33_67, !g_50_50)},
+  #{nest(!g_33_67, !unit)}
+    width: 66%
+
+  #{!g_33_67},
+  #{nest(!g_33_33_33, !g_33_67)}
+    div.first
+      width: 32%
+
+  #{nest(!g_50_50, !g_33_67, div.first)}
+    _width: 29.9%
+
+  #{nest(!g_75_25, !unit)},
+  #{nest(!g_75_25, !g_50_50)},
+  #{nest(!g_25_75, div.first)}
+    width: 24%
+
+  #{!g_33_33_33}
+    #{!g_75_25},
+    #{!g_25_75}
+      div#{!unit}
+        float: right
+
+  #{!g_33_33_33}
+    #{!g_75_25},
+    #{!g_25_75}
+      div.first
+        float: left
+
+  #{nest(!g_75_25, div.first)},
+  #{nest(!g_25_75, !g_50_50)},
+  #{nest(!g_25_75, !unit)}
+    width: 74.2%
+
+  #{!g_33_33_33}
+    #{nest(!g_75_25, !unit)},
+    #{nest(!g_25_75, div.first)}
+      *width: 24%
+      _width: 20%
+
+  #{!g_33_33_33}
+    #{nest(!g_75_25, div.first)},
+    #{nest(!g_25_75, !unit)}
+      *width: 73.5%
+      _width: 65.5%
+
+  #{!g_50_50},
+  #{!g_33_33_33},
+  #{!g_67_33},
+  #{!g_33_67},
+  #{!g_75_25},
+  #{!g_25_75}
+    +clearfix
+
+  #{nest(!g_33_33_33, !unit)}
+    float: left
diff --git a/test/compass_test.rb b/test/compass_test.rb
index 42436fc4..a953d557 100644
--- a/test/compass_test.rb
+++ b/test/compass_test.rb
@@ -4,21 +4,19 @@ require 'compass'
 
 class CompassTest < Test::Unit::TestCase
   def setup
-    Dir.glob("fixtures/*/templates").each do |dirname|
-      dirname = dirname[9..-11]
-      mkdir_clean tempfile_loc(dirname)
-    end
     mkdir_clean absolutize("tmp")
     mkdir_clean absolutize("tmp/blueprint")
     mkdir_clean tempfile_loc("default")
+    mkdir_clean tempfile_loc("yui")
+    @original_options = Sass::Plugin.options
   end
   
   def teardown
-    FileUtils.rm_r absolutize("tmp/blueprint")
-    Dir.glob("fixtures/*/templates").each do |dirname|
-      dirname = dirname[9..-11]
-      FileUtils.rm_r tempfile_loc(dirname)
-    end
+    FileUtils.rm_rf absolutize("tmp")
+    FileUtils.rm_rf absolutize("tmp/blueprint")
+    FileUtils.rm_rf tempfile_loc("default")
+    FileUtils.rm_rf tempfile_loc("yui")
+    Sass::Plugin.options = @original_options
   end
 
   def test_blueprint_generates_no_files
@@ -38,7 +36,13 @@ class CompassTest < Test::Unit::TestCase
       end
     end
   end
-  
+  def test_yui
+    with_templates('yui') do
+      each_css_file(tempfile_loc('yui')) do |css_file|
+        assert_no_errors css_file, 'yui'
+      end
+    end
+  end
   private
   def assert_no_errors(css_file, folder)
     file = css_file[(tempfile_loc(folder).size+1)..-1]
@@ -47,7 +51,8 @@ class CompassTest < Test::Unit::TestCase
   end
 
   def with_templates(folder)
-    old_template_loc = Sass::Plugin.options[:template_location].dup
+    old_template_loc = Sass::Plugin.options[:template_location]
+    Sass::Plugin.options[:template_location] = old_template_loc.dup
     begin
       Sass::Plugin.options[:template_location][template_loc(folder)] = tempfile_loc(folder)
       Compass::Frameworks::ALL.each do |framework|
diff --git a/test/fixtures/yui/templates/grids.sass b/test/fixtures/yui/templates/grids.sass
new file mode 100644
index 00000000..e751fae8
--- /dev/null
+++ b/test/fixtures/yui/templates/grids.sass
@@ -0,0 +1,3 @@
+@import yui/modules/grids.sass
+
++yui-grids
\ No newline at end of file