Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

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

  • Loading branch information...
commit 40c26b4de162c926297186f8f40960f985a88e79 2 parents e6c28d8 + 38faf77
@imathis imathis authored
View
92 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)
-------------------
View
16 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.
View
7 doc-src/content/tutorials/configuration-reference.markdown
@@ -203,6 +203,13 @@ command line will override the corresponding settings in your configuration file
</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>
<td style="vertical-align:top;">These options are passed directly to the
View
10 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.
+
View
58 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.
+
+
+
View
17 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;
- @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-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));
}
- $shadow : $shadow-1;
- @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; }
+ $shadow : compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9, $shadow-10);
@include experimental(box-shadow, $shadow,
-moz, -webkit, -o, not -ms, not -khtml, official
);
View
41 frameworks/compass/stylesheets/compass/css3/_columns.scss
@@ -1,55 +1,60 @@
@import "shared";
// Specify the number of columns
-@mixin column-count($n) {
- @include experimental(column-count, $n,
+@mixin column-count($count) {
+ @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) {
- @include experimental(column-gap, $u,
+@mixin column-gap($width) {
+ @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) {
- @include experimental(column-width, $u,
+@mixin column-width($width) {
+ @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) {
- @include experimental(rule-width, $w,
+@mixin column-rule-width($width) {
+ @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) {
- @include experimental(rule-style, unquote($s),
+@mixin column-rule-style($style) {
+ @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($c) {
- @include experimental(rule-color, unquote($s),
+@mixin column-rule-color($color) {
+ @include experimental(rule-color, $color,
-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 experimental(column-rule, $w $s $c,
+//
+// @include column-rule(1px, solid, #c00)
+//
+// 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
);
}
View
32 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));
}
View
4 lib/compass/commands/update_project.rb
@@ -47,10 +47,10 @@ def dry_run?
def new_compiler_instance(additional_options = {})
compiler_opts = Compass.sass_engine_options
- compiler_opts.merge!(:quiet => options[:quiet],
- :force => options[:force],
+ compiler_opts.merge!(: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,
View
3  lib/compass/configuration.rb
@@ -36,7 +36,8 @@ def self.attributes_for_directory(dir_name, http_dir_name = dir_name)
:asset_cache_buster,
:line_comments,
:color_output,
- :preferred_syntax
+ :preferred_syntax,
+ :disable_warnings
].flatten
end
View
1  lib/compass/configuration/adapters.rb
@@ -46,6 +46,7 @@ def to_sass_engine_options
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
View
10 lib/compass/sass_extensions/functions/gradient_support.rb
@@ -328,6 +328,16 @@ def _compass_nth(list, place)
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)
View
4 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
View
2  test/fixtures/stylesheets/compass/config.rb
@@ -12,3 +12,5 @@
asset_cache_buster do |path, file|
"busted=true"
end
+
+disable_warnings = true
View
17 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; }
View
47 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; }
View
5 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);}
View
10 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); }
Please sign in to comment.
Something went wrong with that request. Please try again.