Merge branch 'css3-v2' of github.com:chriseppstein/compass into css3-v2

doc-src/content/CHANGELOG.markdown

@@ -7,33 +7,81 @@ layout: article
 COMPASS CHANGELOG
 =================
 
-0.11.alpha.1 (UNRELEASED)
+Upgrading compass is really easy.
--------------------------
+Don't let all these details [scare you...](/docs/tutorials/upgrading/im-scared/)
+
+The Documentation for the [latest stable release](http://compass-style.org/docs/):
+
+The Documentation for the [latest preview release](http://beta.compass-style.org/docs/)
+
+0.11.alpha.1   (11/16/2010)
+---------------------------
+
+Note: Compass does not currently support Sass 3.1 alphas.
+
+### Deprecations
 
 * Deprecated imports and APIs from v0.10 have been removed.
-* Changed defaults for the box-shadow and text-shadow mixin. Previously the horizontal and vertical offset were both 1, which expected a top left light source. They are now set to 0 which assumes a direct light source, a more generic default.
+* Changed defaults for the box-shadow and text-shadow mixins.
+  Previously the horizontal and vertical offset were both 1, which
+  expected a top left light source. They are now set to 0 which assumes
+  a direct light source, a more generic default.
+* The linear-gradient and radial-gradient mixins have been deprecated.
+  Instead use the background-image mixin and pass it a gradient function.
+  The deprecation warning will print out the correct call for you to use.
+* The `css3` import is deprecated as well as the following css3 modules:
+  `box-shadow`, `text-shadow`, and `transform`. Instead import `css3/version-2`,
+  `box-shadow-v2`, `text-shadow-v2`, and `transform-v2` respectively.
+  However, you will only get deprecation warnings if you actually use
+  one of the deprecated mixins. The imports will be restored by 1.0
+  with the new, betterer APIs.
+* Passing an argument to the `blueprint-scaffolding` mixin is not necessary
+  and has been deprecated.
+* Some blueprint color defaults now use color functions instead of color arithmetic.
+  This may result in different output for those who have color customizations.
 
 ### Blueprint
 
-* Deprecations:
-  - Passing an argument to the blueprint-scaffolding mixin is not necessary
-    and has been deprecated.
-* Some color defaults now use color functions instead of color arithmetic.
-  This may result in different output for those who have color customizations.
 * Updated from blueprint 0.9 to blueprint 1.0
-  * Added detailed explanations to core uncompressed CSS files [CMM]
   * Added .info and .alert classes to forms.css [CMM]
   * Fixed numerous bugs in forms, including the fieldset padding bug in IE6-8 [CMM]
   * Fixed specificity problems in typography.css and grid.css [CMM]
   * See Lighthouse for more bug fixes
-  * Full [changelog][blueprint_10_change]
+  * Full [blueprint changelog][blueprint_10_change]
   * If for some reason you'd like to stay on the older version of blueprint you can run
     the following command in your project before you upgrade (or after temporarily downgrading):
     `compass unpack blueprint`
 
+### CSS3 v2.0
+
+Our CSS3 module makes writing CSS3 today almost as easy as it will be when all
+the browsers officially support the new features. The second version of the
+compass CSS module brings the API up to date with developments over the past
+6 to 9 months of browser changes and more closely matching the most recent CSS
+specifications. Summary of changes:
+
+* Support for multiple box shadows and text shadows
+* Support for 2d and 3d transforms
+* Opt-in SVG support for gradients in opera and IE9.
+  Set `$experimental-support-for-svg : true` in your
+  stylesheet to enable it.
+* Fixed a radial gradient position bug.
+* To generate a simple linear gradient in IE6 & 7, you can now use
+  the `filter-gradient` mixin.
+* New `background-image` mixin with gradient support and allowing
+  up to 10 images.
+* Gradient support for the border-image property.
+* Gradient support for list-style-image property.
+* Gradient support for the content property.
 
 ### Helpers
 
+* `linear-gradient()` & `radial-gradient()` helpers now intercept standard css
+  functions and parse them into Sass Literals. These work with new vendor helpers
+  (`-moz()`, `-webkit`, `-o`, `-ie`, and `-svg` (yes I know svg is not a vendor))
+  to return specific representations of the linear & radial gradients. The
+  `prefixed()` function will check a value to see if it has a certain
+  vendor-specific representation.
 * New color helpers: `adjust-lightness`, `adjust-saturation`, `scale-lightness`, and `scale-saturation`
   make it easier to construct apis that manipulate these color attributes.
 * The `elements-of-type()` helper now returns html5 elements when the display is `block`
@@ -48,12 +96,34 @@ COMPASS CHANGELOG
   If you provide a number with units of `deg` then it will return a unitless number
   after converting to radians. Otherwise, it assumes the number is a radian length measure
   and passes the units along to the result.
+* `ie-hex-str($color)` returns a #AARRGGBB formatted color suitable for
+  passing to IE filters.
 * A new function `if()` that allows you to switch on a value without using `@if`.
   Usage: `if($truth-value, $value-if-true, $value-if-false)`.
+* Compass has added a number of new helper functions for lists that begin with
+  `-compass`, helpers that begin with `-compass` should be considered "private" and
+  are not to be used by compass users. Sass 3.1 will have proper list support,
+  these are a work around until that time.
+
+### Configuration
+
+* Added a new configuration property to disable sass warnings: `disable_warnings`
+
+### Core Framework
+
+* New layout mixins for absolute positioning: stretch, stretch-x, stretch-y
 
 ### Rails
 
-* Better integration with rails 3 (XXX Details)
+* In rails 3, there's no need for an initializer. Instead we use a
+  Railstie.
+* We now default to app/stylesheets for sass files and public/stylesheets for
+  css files -- though they can still be changed after installation or on the
+  command line during project initialization.
+* Compass is now a gem plugin in a rails environment.
+* In a rails3 environment the compass configuration can now be
+  changed without restarting the rails server process.
+
 
 0.10.7 (UNRELEASED)
 -------------------

doc-src/content/reference/compass/css3/images.haml

@@ -0,0 +1,16 @@
+--- 
+title: Compass Images
+crumb: Images
+framework: compass
+stylesheet: compass/css3/_images.scss
+meta_description: Specify linear gradients and radial gradients for many browsers.
+layout: core
+classnames:
+  - reference
+  - core
+  - css3
+---
+- render 'reference' do
+  %p
+    Provides mixins that work across many modern browsers with the latest
+    CSS3 image rendering primitives.

doc-src/content/tutorials/configuration-reference.markdown

@@ -202,6 +202,13 @@ command line will override the corresponding settings in your configuration file
 		  approach.
 		</td> 
 	</tr> 
+	<tr> 
+		<td style="vertical-align:top;"><code>disable_warnings</code> </td> 
+		<td style="vertical-align:top;">Boolean </td> 
+		<td style="vertical-align:top;">
+		  Set this to true to silence deprecation warnings.
+		</td> 
+	</tr> 
 	<tr> 
 		<td style="vertical-align:top;"><code>sass_options</code> </td> 
 		<td style="vertical-align:top;">Hash </td> 

doc-src/content/tutorials/upgrading/css3-v2.markdown

@@ -0,0 +1,10 @@
+The `css3` import is deprecated as well as the following css3 modules:
+`box-shadow`, `text-shadow`, and `transform`. Instead import `css3/version-2`,
+`box-shadow-v2`, `text-shadow-v2`, and `transform-v2` respectively.
+However, you will only get deprecation warnings if you actually use
+one of the deprecated mixins. The imports will be restored by 1.0
+with the new, betterer APIs.
+
+You should read about what changed, update your stylesheets accordingly
+and then update your imports to the new version.
+

doc-src/content/tutorials/upgrading/im-scared.markdown

@@ -0,0 +1,58 @@
+---
+title: I'm Scared to Upgrade
+layout: tutorial
+crumb: Scared to Upgrade?
+classnames:
+  - tutorial
+---
+# I'm scared to upgrade.
+
+Why? Don't ya trust me? I won't break your stylesheets. Cross my heart. All those
+200+ github issues were feature requests. Honest. But you know, they might change
+a little. Probably not in any meaningful way. Like a default that used to be
+specified in the output might be omitted because it's the browser default anyway.
+
+## Trust but verify.
+
+But you should probably keep me on my toes. Follow these simple steps to see
+what changed to your stylesheets:
+
+*(Steps beginning with a $ are command line commands. Don't type the $.)*
+
+1. $ cd my_compass_project
+2. $ compass compile --force
+3. $ cp -r stylesheets stylesheets.backup
+4. $ gem install compass --pre # you might need to type sudo first if you're on mac or linux.
+5. $ compass compile --force
+6. Take note of any deprecation warnings printed in red during the compile.
+7. If you have textmate and installed the `mate` command line tool:<br>
+   $ diff -r stylesheets.backup stylesheets | mate
+8. If you have not installed the `mate` tool:<br>
+   $ sudo ln -s /Applications/TextMate.app/Contents/Resources/mate /usr/local/bin/mate
+   Then perform step 7.
+9. If you do not have Textmate, run the diff command like so:
+   $ diff -y -r stylesheets.backup stylesheets | less
+10. Scroll or use your arrow keys to review the differences between the files.
+11. If you're satisfied: $ git commit -a -m "Upgraded compass"
+12. If you're scared again:
+    A. Don't panic.
+    B. Read the [CHANGELOG](http://compass-style.org/docs/CHANGELOG/) and
+       see if the changes are explained there.
+    B. Send an email to the [mailing list](http://groups.google.com/group/compass-users)
+       explaining the problem and providing enough context like snippets from your diff
+       and the relevant snippets of your sass/scss files. In rare cases we might request
+       that you construct a simple compass project that exhibits the issue and make an
+       archive of it and send us an email with it attached.
+    C. If it's pretty obviously a bug. Please file an issue
+       on [github](http://github.com/chriseppstein/compass/issues). If you're experiencing
+       a crash, please run the command with the --trace option and record the output for
+       diagnostic purposes.
+    D. $ sudo gem uninstall compass
+       Select the newest version of compass. You have now downgraded to the old
+       version of compass.
+    E. $ compass compile --force
+    F. Diff the folders as in steps 7 through 9.
+13. Breathe a sigh of relief.
+       
+       
+

frameworks/compass/stylesheets/compass/css3/_box-shadow-v2.scss

@@ -69,23 +69,10 @@ $default-box-shadow-inset : false !default;
   }
   
   @if $shadow-1 == default {
-    $shadow-1 : $default-box-shadow-h-offset $default-box-shadow-v-offset;
+    $shadow-1 : -compass-space-list(compact(if($default-box-shadow-inset, inset), $default-box-shadow-h-offset, $default-box-shadow-v-offset, $default-box-shadow-blur, $default-box-shadow-spread, $default-box-shadow-color));
-    @if $default-box-shadow-blur    { $shadow-1: $shadow-1 $default-box-shadow-blur;   }
-    @if $default-box-shadow-spread  { $shadow-1: $shadow-1 $default-box-shadow-spread; }
-    @if $default-box-shadow-color   { $shadow-1: $shadow-1 $default-box-shadow-color;  }
-    @if $default-box-shadow-inset   { $shadow-1: inset $shadow-1;   }
   }
   
-  $shadow : $shadow-1;
+  $shadow : compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9, $shadow-10);
-  @if $shadow-2  { $shadow: $shadow, $shadow-2;  }
-  @if $shadow-3  { $shadow: $shadow, $shadow-3;  }
-  @if $shadow-4  { $shadow: $shadow, $shadow-4;  }
-  @if $shadow-5  { $shadow: $shadow, $shadow-5;  }
-  @if $shadow-6  { $shadow: $shadow, $shadow-6;  }
-  @if $shadow-7  { $shadow: $shadow, $shadow-7;  }
-  @if $shadow-8  { $shadow: $shadow, $shadow-8;  }
-  @if $shadow-9  { $shadow: $shadow, $shadow-9;  }
-  @if $shadow-10 { $shadow: $shadow, $shadow-10; }
   @include experimental(box-shadow, $shadow,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );

frameworks/compass/stylesheets/compass/css3/_columns.scss

@@ -1,55 +1,60 @@
 @import "shared";
 
 // Specify the number of columns
-@mixin column-count($n) {
+@mixin column-count($count) {
-  @include experimental(column-count, $n,
+  @include experimental(column-count, $count,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
 // Specify the gap between columns e.g. `20px`
-@mixin column-gap($u) {
+@mixin column-gap($width) {
-  @include experimental(column-gap, $u,
+  @include experimental(column-gap, $width,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
 // Specify the width of columns e.g. `100px`
-@mixin column-width($u) {
+@mixin column-width($width) {
-  @include experimental(column-width, $u,
+  @include experimental(column-width, $width,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
 // Specify the width of the rule between columns e.g. `1px`
-@mixin column-rule-width($w) {
+@mixin column-rule-width($width) {
-  @include experimental(rule-width, $w,
+  @include experimental(rule-width, $width,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
 // Specify the style of the rule between columns e.g. `dotted`.
 // This works like border-style.
-@mixin column-rule-style($s) {
+@mixin column-rule-style($style) {
-  @include experimental(rule-style, unquote($s),
+  @include experimental(rule-style, unquote($style),
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
-// Specify the style of the rule between columns e.g. `dotted`.
+// Specify the color of the rule between columns e.g. `blue`.
 // This works like border-color.
-
+@mixin column-rule-color($color) {
-@mixin column-rule-color($c) {
+  @include experimental(rule-color, $color,
-  @include experimental(rule-color, unquote($s),
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }
 
-// Mixin encompassing all column rule rules
+// Mixin encompassing all column rule properties
 // For example:
-//     +column-rule(1px, solid, #c00)
+//
-@mixin column-rule($w, $s: solid, $c: black) {
+//     @include column-rule(1px, solid, #c00)
-  @include experimental(column-rule, $w $s $c,
+//
+// Or the values can be space separated:
+//
+//     @include column-rule(1px solid #c00)
+@mixin column-rule($width, $style: false, $color: false) {
+  $full : -compass-space-list(compact($width, $style, $color));
+  @include experimental(column-rule, $full,
     -moz, -webkit, -o, not -ms, not -khtml, official
   );
 }

frameworks/compass/stylesheets/compass/css3/_gradient.scss

@@ -33,7 +33,21 @@
 // - Firefox 3.6
 // - Opera
 
-@mixin linear-gradient($color-stops, $start: top, $image: false) {
+@mixin linear-gradient($color-stops, $start: false, $image: false) {
+  @if $image {
+    @if $start {
+      @warn "The linear-gradient mixin is deprecated. Instead use: @include background-image(#{$image}, linear-gradient(#{$start}, #{$color-stops}))";
+    } @else {
+      @warn "The linear-gradient mixin is deprecated. Instead use: @include background-image(#{$image}, linear-gradient(#{$color-stops}))";
+    }
+  } @else {
+    @if $start {
+      @warn "The linear-gradient mixin is deprecated. Instead use: @include background-image(linear-gradient(#{$start}, #{$color-stops}))";
+    } @else {
+      @warn "The linear-gradient mixin is deprecated. Instead use: @include background-image(linear-gradient(#{$color-stops}))";
+    }
+  }
+  @if not $start { $start: top; }
   @include background-image($image, linear-gradient($start, $color-stops));
 }
 
@@ -73,6 +87,20 @@
 // - Firefox 3.6
 // - Opera
 
-@mixin radial-gradient($color-stops, $center-position: center center, $image: false) {
+@mixin radial-gradient($color-stops, $center-position: false, $image: false) {
+  @if $image {
+    @if $center-position {
+      @warn "The radial-gradient mixin is deprecated. Instead use: @include background-image(#{$image}, radial-gradient(#{$center-position}, #{$color-stops}))";
+    } @else {
+      @warn "The radial-gradient mixin is deprecated. Instead use: @include background-image(#{$image}, radial-gradient(#{$color-stops}))";
+    }
+  } @else {
+    @if $center-position {
+      @warn "The radial-gradient mixin is deprecated. Instead use: @include background-image(radial-gradient(#{$center-position}, #{$color-stops}))";
+    } @else {
+      @warn "The radial-gradient mixin is deprecated. Instead use: @include background-image(radial-gradient(#{$color-stops}))";
+    }
+  }
+  @if not $center-position { $center-position: center center; }
   @include background-image($image, radial-gradient($center-position, $color-stops));
 }

lib/compass/commands/update_project.rb

@@ -47,10 +47,10 @@ module Compass
 
       def new_compiler_instance(additional_options = {})
         compiler_opts = Compass.sass_engine_options
-        compiler_opts.merge!(:quiet => options[:quiet],
+        compiler_opts.merge!(:force => options[:force],
-                             :force => options[:force],
                              :sass_files => explicit_sass_files,
                              :dry_run => options[:dry_run])
+        compiler_opts[:quiet] = options[:quiet] if options[:quiet]
         compiler_opts.merge!(additional_options)
         Compass::Compiler.new(working_path,
           Compass.configuration.sass_path,

lib/compass/configuration.rb

@@ -36,7 +36,8 @@ module Compass
       :asset_cache_buster,
       :line_comments,
       :color_output,
-      :preferred_syntax
+      :preferred_syntax,
+      :disable_warnings
     ].flatten
 
   end

lib/compass/configuration/adapters.rb

@@ -46,6 +46,7 @@ module Compass
         engine_opts[:line_comments] = line_comments
         engine_opts[:cache] = cache
         engine_opts[:cache_location] = cache_path
+        engine_opts[:quiet] = disable_warnings if disable_warnings
         engine_opts.merge!(sass_options || {})
       end
 

lib/compass/sass_extensions/functions/gradient_support.rb

@@ -328,6 +328,16 @@ module Compass::SassExtensions::Functions::GradientSupport
       end
     end
 
+    def _compass_space_list(list)
+      if list.is_a?(List) && !list.is_a?(SpaceList)
+        SpaceList.new(*list.values)
+      elsif list.is_a?(SpaceList)
+        list
+      else
+        SpaceList.new(list)
+      end
+    end
+
     # slice a sublist from a list
     def _compass_slice(list, start_index, end_index = nil)
       end_index ||= Sass::Script::Number.new(-1)

lib/compass/sass_extensions/functions/if.rb

@@ -1,9 +1,9 @@
 module Compass::SassExtensions::Functions::If
-  def if(truth, if_true, if_false)
+  def if(truth, if_true, if_false = nil)
     if truth.to_bool
       if_true
     else
-      if_false
+      if_false || Sass::Script::Bool.new(false)
     end
   end
 end

test/fixtures/stylesheets/compass/config.rb

@@ -12,3 +12,5 @@ line_comments = false
 asset_cache_buster do |path, file|
   "busted=true"
 end
+
+disable_warnings = true

test/fixtures/stylesheets/compass/css/box_shadow.css

@@ -0,0 +1,17 @@
+.box-shadow {
+  -moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  -webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  -o-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; }
+
+.single-box-shadow {
+  -moz-box-shadow: 0px 0px 5px #333333;
+  -webkit-box-shadow: 0px 0px 5px #333333;
+  -o-box-shadow: 0px 0px 5px #333333;
+  box-shadow: 0px 0px 5px #333333; }
+
+.multiple-box-shadows {
+  -moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  -webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  -o-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
+  box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; }

test/fixtures/stylesheets/compass/css/columns.css

@@ -0,0 +1,47 @@
+.column-count {
+  -moz-column-count: 5;
+  -webkit-column-count: 5;
+  -o-column-count: 5;
+  column-count: 5; }
+
+.column-gap {
+  -moz-column-gap: 10px;
+  -webkit-column-gap: 10px;
+  -o-column-gap: 10px;
+  column-gap: 10px; }
+
+.column-width {
+  -moz-column-width: 90px;
+  -webkit-column-width: 90px;
+  -o-column-width: 90px;
+  column-width: 90px; }
+
+.column-rule-width {
+  -moz-rule-width: 1px;
+  -webkit-rule-width: 1px;
+  -o-rule-width: 1px;
+  rule-width: 1px; }
+
+.column-rule-style {
+  -moz-rule-style: dotted;
+  -webkit-rule-style: dotted;
+  -o-rule-style: dotted;
+  rule-style: dotted; }
+
+.column-rule-color {
+  -moz-rule-color: blue;
+  -webkit-rule-color: blue;
+  -o-rule-color: blue;
+  rule-color: blue; }
+
+.column-rule {
+  -moz-column-rule: 1px solid blue;
+  -webkit-column-rule: 1px solid blue;
+  -o-column-rule: 1px solid blue;
+  column-rule: 1px solid blue; }
+
+.column-rule-spaced {
+  -moz-column-rule: 1px solid blue;
+  -webkit-column-rule: 1px solid blue;
+  -o-column-rule: 1px solid blue;
+  column-rule: 1px solid blue; }

test/fixtures/stylesheets/compass/sass/box_shadow.scss

@@ -0,0 +1,5 @@
+@import "compass/css3/box-shadow-v2";
+
+.box-shadow { @include box-shadow(default, 2px 2px 5px #222);}
+.single-box-shadow { @include single-box-shadow;}
+.multiple-box-shadows { @include multiple-box-shadows(default, 2px 2px 5px #222);}

test/fixtures/stylesheets/compass/sass/columns.scss

@@ -0,0 +1,10 @@
+@import "compass/css3/columns";
+
+.column-count       { @include column-count(5);               }
+.column-gap         { @include column-gap(10px);              }
+.column-width       { @include column-width(90px);            }
+.column-rule-width  { @include column-rule-width(1px);        }
+.column-rule-style  { @include column-rule-style(dotted);     }
+.column-rule-color  { @include column-rule-color(blue);       }
+.column-rule        { @include column-rule(1px, solid, blue); }
+.column-rule-spaced { @include column-rule(1px solid blue);   }