mirror of https://github.com/zhigang1992/sass.git synced 2026-04-30 02:05:44 +08:00

Files

Nathan Weizenbaum 7ac58c2e08 Fix a crash for @for loops.

Closes #1468

2014-10-16 18:10:56 -07:00

125 KiB

Raw Blame History

Sass Changelog

Table of contents {:toc}

3.4.6 (Unreleased)

Parent selectors now work in selector pseudoclasses (for example, :not(&)).
@for loops no longer crash when one bound is an integer-like float.

3.4.5 (19 September 2014)

Fix sass-convert --recursive.
When using sass --watch, imported stylesheets within the working directory will be watched for changes. This matches the behavior of Sass 3.3.
Set exit code 65, indicating a data error, when the compiler fails due to a Sass error.

3.4.4 (12 September 2014)

Produce more useful error messages when paths have incompatible encodings on Windows.
Allow @keyframes selectors to use arbitrary identifiers to support libraries like Skrollr.
sass-convert now preserves double-star mutliline comments (e.g. /** foo */).

3.4.3 (4 September 2014)

Don't crash when a non-existent directory is on the load path.
Fix --watch on Windows.
Passing too many arguments to a function via ... is now a warning rather than silently discarding additional arguments. In future versions of Sass, this will become an error.

3.4.2 (28 August 2014)

Properly detect the output format from the output filename for sass-convert.
Properly parse interpolation immediately following a string.
Fix --watch for symlinked files and directories.

3.4.1 (22 August 2014)

Fix --watch.
Don't generate :not() selectors that contain more than one complex selector.
Fix a parsing bug with attribute selectors containing single quotes.
Don't put rulesets inside @keyframes directives when bubbling them up to the top level.
Properly handle @keyframes rules that contain no properties.
Properly handle --sourcemap=none with --update.
Silence "template deleted" notifications for templates that weren't being watched.
Top-level control structures can assign to global variables without needing !global. Variables first defined in these structures will still be local without !global.

3.4.0 (18 August 2014)

Using `&` in SassScript

For a long time, Sass has supported a special {file:SASS_REFERENCE.md#parent-selector "parent selector", &}, which is used when nesting selectors to describe how a nested selector relates to the selectors above it. Until now, this has only been usable in selectors, but now it can be used in SassScript as well.

In a SassScript expression, & refers to the current parent selector. It's a comma-separated list of space-separated lists. For example:

.foo.bar .baz.bang, .bip.qux {
  $selector: &;
}

The value of $selector is now ((".foo.bar" ".baz.bang"), ".bip.qux"). The compound selectors are quoted here to indicate that they're strings, but in reality they would be unquoted.

If there is no parent selector, the value of & will be null. This means you can use it in a mixin to detect whether a parent selector exists:

@mixin does-parent-exist {
  @if & {
    &:hover {
      color: red;
    }
  } @else {
    a {
      color: red;
    }
  }
}

Selector Functions

Complementing the ability to use & in SassScript, there's a new suite of functions that use Sass's powerful @extend infrastructure to allow users to manipulate selectors. These functions take selectors in the fully-parsed format returned by &, plain strings, or anything in between. Those that return selectors return them in the same format as &.

The {Sass::Script::Functions#selector_nest selector-nest($selectors...) function} nests each selector within one another just like they would be nested in the stylesheet if you wrote them separated by spaces. For example, selector-nest(".foo, .bar", ".baz") returns .foo .baz, .bar .baz (well, technically (("foo" ".baz") (".bar" ".baz"))).
The {Sass::Script::Functions#selector_append selector-append($selectors...) function} concatenates each selector without a space. It handles selectors with commas gracefully, so it's safer than just concatenating the selectors using #{}. For example, selector-append(".foo, .bar", "-suffix") returns .foo-suffix, .bar-suffix.
The {Sass::Script::Functions#selector_extend selector-extend($selector, $extendee, $extender) function} works just like @extend. It adds new selectors to $selector as though you'd written $extender { @extend $extendee; }.
The {Sass::Script::Functions#selector_replace selector-replace($selector, $original, $replacement) function} replaces all instances of $original in $selector with $replacement. It uses the same logic as @extend, so you can replace complex selectors with confidence.
The {Sass::Script::Functions#selector_unify selector-unify($selector1, $selector2) function} returns a selector that matches only elements matched by both $selector1 and $selector2.
The {Sass::Script::Functions#is_superselector is-superselector($super, $sub) function} returns whether or not $super matches a superset of the elements $sub matches.
The {Sass::Script::Functions#simple_selectors simple-selectors($selector) function} takes only a selector with no commas or spaces (that is, a compound selector). It returns the list of simple selectors that make up that compound selector.
The {Sass::Script::Functions#selector_parse selector-parse($selector) function} takes a selector in any format accepted by selector functions and returns it in the same format returned by &. It's useful for getting a selector into a consistent format before manually manipulating its contents.

One of the most straightforward applications of selector functions and & is adding multiple suffixes to the same parent selector. For example:

.list {
  @at-root #{selector-append(&, "--big", &, "--active")} {
    color: red;
  }
}

Smaller Improvements

Sourcemaps are now generated by default when using the sass or scss executables and when using Sass as a plugin. This can be disabled by passing --sourcemap=none on the command line or setting the :sourcemap option to :none in Ruby.
If a relative URI from a sourcemap to a Sass file can't be generated, it will now fall back to using an absolute "file:" URI. In addition, --sourcemap=file can be passed on the command line to force all URIs to Sass files to be absolute.
To guarantee that a sourcemap will be portable, --sourcemap=inline can be passed to include the full source text in the sourcemap. Note that this can cause very large sourcemaps to be generated for large projects.
@extend can now extend selectors within selector pseudoclasses such as :not and :matches. This also means that placeholder selectors can be used within selector pseudoclasses. This behavior can be detected using feature-exists(extend-selector-pseudoclass).
Sass now supports an @error directive that prints a message as a fatal error. This is useful for user-defined mixins and functions that want to validate arguments and throw useful errors for unexpected conditions. Support for this directive can be detected using feature-exists(at-error).
When using colors in SassScript, the original representation of the color will be preserved wherever possible. If you write #f00, it will be rendered as #f00, not as red or #ff0000. In compressed mode, Sass will continue to choose the most compact possible representation for colors.
Add support for unit arithmetic with many more units, including angles, times, frequencies, and resolutions. This behavior can be detected using feature-exists(units-level-3).
Sass now follows the CSS Syntax Level 3 specification for determining a stylesheet's encoding. In addition, it now only emits UTF-8 CSS rather than trying to match the source encoding.

Sass now allows numbers to be written using scientific notation. It will not emit numbers in scientific notation until it's more widely supported in browsers.
Sass now allows almost any identifier to be used as a custom numeric unit. Identifiers that are ambiguous with subtraction, such as px-1px, are disallowed.
Sass now supports using ids as values in SassScript as defined in the CSS Basic User Interface Module. They're treated as unquoted strings.
SassScript strings and @import directives now support the full CSS string grammar. This includes handling escape codes and ignoring backslashes followed by newlines.
When the sass and scss executables encounter an error, they will now produce a CSS file describing that error. Previously this was enabled only for --watch and --update mode; now it's enabled whenever a CSS file is being written to disk.
The command-line --help documentation for the sass, scss, and sass-convert executables is revised and re-organized.
The map-remove function now allows multiple map keys to be removed at once.
The new rebeccapurple color is now supported.
The rgb(), rgba(), hsl(), and hsla() functions now follow the CSS spec by clamping their arguments to the valid ranges rather than emitting an error. Sass-specific color functions still throw errors for out-of-range values.
Sass will now emit a warning when a named color is used directly in interpolation (#{}) in a context where the hex representation would likely be invalid. This should help users avoid having their stylesheets break in compressed output mode.
Fix a bug where some @media queries would be followed by newlines in compressed mode.

Backwards Incompatibilities -- Must Read!

The current working directory will no longer be placed onto the Sass load path by default. If you need the current working directory to be available, set SASS_PATH=. in your shell's environment.
Sass will now throw an error when a list of pairs is passed to a map function.
mix()'s deprecated argument names, $color-1 and $color-2, will now throw errors. Use $color1 and $color2 instead.
comparable()'s deprecated argument names, $number-1 and $number-2, will now throw errors. Use $number1 and $number2 instead.
percentage()'s, round()'s, ceil()'s, floor()'s, and abs()'s deprecated argument name, $value, will now throw an error. Use $number instead.
index() now returns null rather than false if the value isn't found in the list.
All variable assignments not at the top level of the document are now local by default. If there's a global variable with the same name, it won't be overwritten unless the !global flag is used. For example, $var: value !global will assign to $var globally. This behavior can be detected using feature-exists(global-variable-shadowing).
Unescaped newlines in SassScript strings in SCSS are deprecated, since they're invalid according to the CSS string grammar. To include a newline in a string, use "\a" or "\a " as in CSS.
The subject selector operator, !, is deprecated and will produce a warning if used. The :has() selector should be used instead.
Quoted strings in lists will now be unquoted when those lists are interpolated in anything else. This makes it much easier to add user-defined strings to selector lists returned by &. This is unlikely to be behavior anyone's relying on and would be difficult to deprecate gracefully, so there will be no deprecation period for this change.

3.3.14 (1 August 2014)

Improved edge-case parsing of special-syntax functions like calc() and expression().
Fixed a bug when using --update with absolute paths on Windows.

3.3.13 (31 July 2014)

Fixed a bug on ruby 2.0 where watching several folders was broken. Work around for a bug in listen.

3.3.12 (29 July 2014)

The Sass::Compiler class has a number of new minor features to support Compass's compilation needs:
- The template_deleted event of the Sass Compiler class now runs before the side-effect events.
- The Sass Compiler class can now be used to clean output files.
- The Sass Compiler class now exposes an updating_stylesheets callback that runs before stylesheets are mass-updated.
- The Sass Compiler class now exposes a the compilation_starting callback that runs before an individual stylesheet is compiled.
- The Sass Compiler class now runs the updated_stylesheets callback after stylesheets are mass-updated.
- The Sass Compiler can now be made to skip the initial update when watching.

3.3.11 (25 July 2014)

str-slice() now correctly returns an empty string when $end-at is 0.

3.3.10 (11 July 2014)

Properly encode URLs in sourcemaps.

3.3.9 (27 June 2014)

Defining a function named "and", "or", or "not" is now an error at definition-time. This isn't considered a backwards-incompatible change because although these functions could be defined previously, they could never be successfully invoked.
Fix deprecation warnings for using File.exists? on recent Ruby versions.
Fix a bug where @extend within @at-root could crash the compiler.
Gracefully handle the inability to change cache files' permissions.

3.3.8 (20 May 2014)

When a use of @at-root doesn't add any new rules, it will no longer split its containing block in two (issue 1239).
Fix a sass-convert bug where rules would occasionally be folded together incorrectly when converting from CSS to Sass.
Fix error messages for dynamically-generated @media queries with empty queries.

3.3.7 (2 May 2014)

Properly set the default Sass::Plugin options in Rails 3.0.
Fix a few cases where source ranges were being computed incorrectly for SassScript expressions.

3.3.6 (25 April 2014)

The inspect() function will only interpret / between numbers as division under the same circumstances that it would be interpreted as division when used in a property.
Fix several cases where parsing pathological comments would cause Sass to take exponential time and consume all available CPU.

3.3.5 (14 April 2014)

Fix LoadErrors when using --watch with the bundled version of Listen.
Properly parse negative numbers preceded by a comment.
Avoid unnecessary interpolation when running sass-convert on media queries.
Avoid freezing Ruby's true or false values.

3.3.4 (21 March 2014)

Improve the warning message for index(...) == false.
Fix the use of directives like @font-face within @at-root.
Fix a sass --watch issue on Windows where too many files would be updated on every change.
Avoid freezing Ruby's nil value.

3.3.3 (14 March 2014)

Fix a bug in Sass that was causing caching errors when unserializable objects were in the Ruby options hash. Note that these errors may persist when using Sass with Sprockets until the Sprockets importer is made serializable.

3.3.2 (11 March 2014)

Fix a bug with loading the bundled version of Listen.

3.3.1 (10 March 2014)

This release includes a number of fixes for issues that popped up in the immediate aftermath of the 3.3.0 release.

Re-bundle listen

With 3.3.0, we un-bundled the listen library from Sass. We did so hoping that it would make it easier for users to keep up to date with the latest features and bug fixes, but unfortunately listen 2.0 and on have dropped support for Ruby 1.8.7, which Sass continues to support. Further complicating things, RubyGems lacks the ability to install only the version of listen supported by the current Ruby installation, so we were unable to use a standard Gem dependency on listen.

To work around this, we tried to piggyback on RubyGems' native extension support to install the correct version of listen when Sass was installed. This is what we released in 3.3.0. However, this caused numerous problems in practice, especially for users on Windows. It quickly became clear that this wasn't a viable long-term solution.

As such, we're going back to the bundling strategy. While not perfect, this worked well enough for the duration of the Sass 3.2 release, and we expect it to cause much less havoc than un-bundling. We'll bundle listen 1.3.1, the most recent version that retains Ruby 1.8.7 compatibility. If a user of Sass has a more recent version of listen installed, that will be preferred to the bundled version. Listen versions through 2.7.0 have been tested, and we expect the code to work without modification on versions up to 3.0.0, assuming no major API changes.

Smaller Changes

Fixed a small interface incompatibility with listen 2.7.0.
Fix some corner cases of path handling on Windows.
Avoid errors when trying to watch read-only directories using listen 1.x.

3.3.0 (7 March 2014)

SassScript Maps

SassScript has a new data type: maps. These are associations from SassScript values (often strings, but potentially any value) to other SassScript values. They look like this:

$map: (key1: value1, key2: value2, key3: value3);

Unlike lists, maps must always be surrounded by parentheses. () is now an empty map in addition to an empty list.

Maps will allow users to collect values into named groups and access those groups dynamically. For example, you could use them to manage themes for your stylesheet:

$themes: (
  mist: (
    header: #DCFAC0,
    text:   #00968B,
    border: #85C79C
  ),
  spring: (
    header: #F4FAC7,
    text:   #C2454E,
    border: #FFB158
  ),
  // ...
);

@mixin themed-header($theme-name) {
  h1 {
    color: map-get(map-get($themes, $theme-name), header);
  }
}

There are a variety of functions for working with maps:

The {Sass::Script::Functions#map_get map-get($map, $key) function} returns the value in the map associated with the given key. If no value is found, it returns null.
The {Sass::Script::Functions#map_merge map-merge($map1, $map2) function} merges two maps together into a new map. If there are any conflicts, the second map takes precedence, making this a good way to modify values in a map as well.
The {Sass::Script::Functions#map_remove map-remove($map, $key) function} returns a new map with a key removed.
The {Sass::Script::Functions#map_keys map-keys($map) function} returns all the keys in a map as a comma-separated list.
The {Sass::Script::Functions#map_values map-values($map) function} returns all the values in a map as a comma-separated list.
The {Sass::Script::Functions#map_has_key map-has-key($map, $key) function} returns whether or not a map contains a pair with the given key.

All the existing list functions also work on maps, treating them as lists of pairs. For example, nth((foo: 1, bar: 2), 1) returns foo 1. Maps can also be used with @each, using the new multiple assignment feature (see below):

@each $header, $size in (h1: 2em, h2: 1.5em, h3: 1.2em) {
  #{$header} {
    font-size: $size;
  }
}

Produces:

h1 {
  font-size: 2em;
}

h2 {
  font-size: 1.5em;
}

h3 {
  font-size: 1.2em;
}

Variable Keyword Arguments

Maps can be passed as variable arguments, just like lists. For example, if $map is (alpha: -10%, "blue": 30%), you can write scale-color($color, $map...) and it will do the same thing as scale-color($color, $alpha: -10%, $blue: 30%). To pass a variable argument list and map at the same time, just do the list first, then the map, as in fn($list..., $map...).

You can also access the keywords passed to a function that accepts a variable argument list using the new {Sass::Script::Functions#keywords keywords($args) function}. For example:

@function create-map($args...) {
  @return keywords($args);
}

create-map($foo: 10, $bar: 11); // returns (foo: 10, bar: 11)

Lists of Pairs as Maps

The new map functions work on lists of pairs as well, for the time being. This feature exists to help libraries that previously used lists of pairs to simulate maps. These libraries can now use map functions internally without introducing backwards-incompatibility. For example:

$themes: (
  mist (
    header #DCFAC0,
    text   #00968B,
    border #85C79C
  ),
  spring (
    header #F4FAC7,
    text   #C2454E,
    border #FFB158
  ),
  // ...
);

@mixin themed-header($theme-name) {
  h1 {
    color: map-get(map-get($themes, $theme-name), header);
  }
}

Since it's just a migration feature, using lists of pairs in place of maps is already deprecated. Library authors should encourage their users to use actual maps instead.

Source Maps

Sass now has the ability to generate standard JSON source maps of a format that will soon be supported in most major browsers. These source maps tell the browser how to find the Sass styles that caused each CSS style to be generated. They're much more fine-grained than the old Sass-specific debug info that was generated; rather than providing the source location of entire CSS rules at a time, source maps provide the source location of each individual selector and property.

Source maps can be generated by passing the --sourcemap flag to the sass executable, by passing the {file:SASS_REFERENCE.md#sourcemap-option :sourcemap option} to {Sass::Plugin}, or by using the {Sass::Engine#render_with_sourcemap} method. By default, Sass assumes that the source stylesheets will be made available on whatever server you're using, and that their relative location will be the same as it is on the local filesystem. If this isn't the case, you'll need to make a custom class that extends {Sass::Importers::Base} or {Sass::Importers::Filesystem} and overrides {Sass::Importers::Base#public_url #public_url}.

Thanks to Alexander Pavlov for implementing this.

`@at-root`

Sass 3.3 adds the @at-root directive, which is a way to tell Sass to put a collection of rules at the top-level root of the document. The easiest way to use it is with a selector:

.badge {
  @at-root .info { ... }
  @at-root .header { ... }
}

In addition to using @at-root on a single selector, you can also use it on a whole block of them. For example:

.badge {
  @at-root {
    .info { ... }
    .header { ... }
  }
}

Also produces:

.info { ... }
.header { ... }

`@at-root (without: ...)` and `@at-root (with: ...)`

By default, @at-root just excludes selectors. However, it's also possible to use @at-root to move outside of nested directives such as @media as well. For example:

@media print {
  .page {
    width: 8in;
    @at-root (without: media) {
      color: red;
    }
  }
}

produces:

@media print {
  .page {
    width: 8in;
  }
}
.page {
  color: red;
}

You can use @at-root (without: ...) to move outside of any directive. You can also do it with multiple directives separated by a space: @at-root (without: media supports) moves outside of both @media and @supports queries.

There are two special values you can pass to @at-root. "rule" refers to normal CSS rules; @at-root (without: rule) is the same as @at-root with no query. @at-root (without: all) means that the styles should be moved outside of all directives and CSS rules.

If you want to specify which directives or rules to include, rather than listing which ones should be excluded, you can use with instead of without. For example, @at-root (with: rule) will move outside of all directives, but will preserve any CSS rules.

Smaller Improvements

The parent selector, &, can be used with an identifier suffix. For example, &-suffix and &_suffix are now legal. The suffix will be added to the end of the parent selector, and will throw an error if this isn't possible. & must still appear at the beginning of a compound selector -- that is, .foo-& is still illegal.
listen is no longer bundled with Sass, nor is it a standard RubyGems dependency. Instead, it's automatically installed along with Sass in order to ensure that the user ends up with a version of Listen that works with their local Ruby version.
Sass now has numerous functions for working with strings: {Sass::Script::Functions#str_length str-length} will return the length of a string; {Sass::Script::Functions#str_insert str-insert} will insert one string into another; {Sass::Script::Functions#str_index str-index} will return the index of a substring within another string; {Sass::Script::Functions#str_slice str-slice} will slice a substring from a string; {Sass::Script::Functions#to_upper_case to-upper-case} will transform a string to upper case characters; and {Sass::Script::Functions#to_lower_case to-lower-case} will transform a string to lower case characters.
A {Sass::Script::Functions#list_separator list-separator} function has been added to determine what separator a list uses. Thanks to Sam Richard.
Custom Ruby functions can now access the global environment, which allows them the same power as Sass-based functions with respect to reading and setting variables defined elsewhere in the stylesheet.
The set-nth($list, $n, $value) function lets you construct a new list based on $list, with the nth element changed to the value specified.
In order to make it easier for mixins to process maps, they may now recursively call themselves and one another. It is no longer an error to have a mixin @include loop.
Add "grey" and "transparent" as recognized SassScript colors. Thanks to Rob Wierzbowski.
Add a function {Sass::Script::Functions#unique_id unique-id()} that will return a CSS identifier that is unique within the scope of a single CSS file.
Allow negative indices into lists when using nth().
You can now detect the presence of a Sass feature using the new function feature-exists($feature-name). There are no detectable features in this release, this is provided so that subsequent releases can begin to use it. Additionally, plugins can now expose their functionality through feature-exists by calling Sass.add_feature(feature_name). Features exposed by plugins must begin with a dash to distinguish them from official features.
It is now possible to determine the existence of different Sass constructs using these new functions:
- variable-exists($name) checks if a variable resolves in the current scope.
- global-variable-exists($name) checks if a global variable of the given name exists.
- function-exists($name) checks if a function exists.
- mixin-exists($name) checks if a mixin exists.
You can call a function by name by passing the function name to the call function. For example, call(nth, a b c, 2) returns b.
Comments following selectors in the indented syntax will be correctly converted using sass-convert.
@each now supports "multiple assignment", which makes it easier to iterate over lists of lists. If you write @each $var1, $var2, $var3 in a b c, d e f, g h i, the elements of the sub-lists will be assigned individually to the variables. $var1, $var2, and $var3 will be a, b and c; then d, e, and f; and then g, h, and i. For more information, see {file:SASS_REFERENCE.md#each-multi-assign the @each reference}.
@for loops can now go downward as well as upward. For example, @for $var from 5 through 1 will set $var to 5, 4, 3, 2, and 1. Thanks to Robin Roestenburg.
There is a new {Sass::Script::Value::Helpers convenience API} for creating Sass values from within ruby extensions.
The if() function now only evaluates the argument corresponding to the value of the first argument.
Comma-separated lists may now have trailing commas (e.g. 1, 2, 3,). This also allows you to use a trailing comma to distinguish a list with a single element from that element itself -- for example, (1,) is explicitly a list containing the value 1.
All directives that are nested in CSS rules or properties and that contain more CSS rules or properties are now bubbled up through their parent rules.
A new random() function returns a random number.
A new function inspect($value) is provided for debugging the current sass representation of a value.
The @debug directive now automatically inspects sass objects that are not strings.
Numbers will no longer be emitted in scientific notation.
sass-convert will now correctly handle silent (//-style) comments contained within loud (/* */-style) comments.
Allow modulo arithmetic for numbers with compatible units. Thanks to Isaac Devine.
Keyword arguments to mixins and functions that contain hyphens will have the hyphens preserved when using sass-convert.

Backwards Incompatibilities -- Must Read!

Sass will now throw an error when @extend is used to extend a selector outside the @media context of the extending selector. This means the following will be an error:
```
@media screen {
  .foo { @extend .bar; }
}
.bar { color: blue; }
```
Sass will now throw an error when an @extend that has no effect is used. The !optional flag may be used to avoid this behavior for a single @extend.
Sass will now throw an error when it encounters a single @import statement that tries to import more than one file. For example, if you have @import "screen" and both screen.scss and _screen.scss exist, a warning will be printed.
grey and transparent are no longer interpreted as strings; they're now interpreted as colors, as per the CSS spec.
The automatic placement of the current working directory onto the Sass load path is now deprecated as this causes unpredictable build processes. If you need the current working directory to be available, set SASS_PATH=. in your shell's environment.
Sass::Compiler.on_updating_stylesheet has been removed.
Sass::Plugin.options= has been removed.
Sass::Script::Number::PRECISION has been removed.
The methods in the Sass::Util module can no longer be used by including it. They must be invoked on the module itself for performance reasons.
Sass values have always been immutable. The ruby object that backs each sass value is now "frozen" to prevent accidental modification and for performance.
Many classes in the {Sass::Script} have been rearranged. All the value classes have been moved into {Sass::Script::Value} (e.g. {Sass::Script::Value::Color}, {Sass::Script::Value::String}, etc). Their base class is now {Sass::Script::Value::Base} instead of Sass::Script::Literal. All the parse tree classes have been moved into {Sass::Script::Tree} (e.g. {Sass::Script::Tree::Node}, {Sass::Script::Tree::Operation}, etc).

The old names will continue to work for the next couple releases, but they will be removed eventually. Any code using them should upgrade to the new names.
As part of a migration to cleaner variable semantics, assigning to global variables in a local context by default is deprecated. If there's a global variable named $color and you write $color: blue within a CSS rule, Sass will now print a warning; in the future, it will create a new local variable named $color. You may now explicitly assign to global variables using the !global flag; for example, $color: blue !global will always assign to the global $color variable.
Two numbers separated by a hyphen with no whitespace will now be parsed as a subtraction operation rather than two numbers in a list. That is, 2px-1px will parse the same as 2px - 1px rather than 2px -1px.
index()'s false return value when a value isn't found is deprecated. In future Sass releases it will be null instead, so it should be used in ways that are compatible with both false and null.
mix()'s arguments are now $color1 and $color2 rather than $color-1 and $color-2, in keeping with other functions.
comparable()'s arguments are now $number1 and $number2 rather than $number-1 and $number-2, in keeping with other functions.
percentage(), round(), ceil(), floor(), and abs() now take arguments named '$number' instead of '$value'.

3.2.16 (17 March 2014)

Handle a race condition in the filesystem cache store when a cache entry becomes invalidated.

3.2.15 (7 March 2014)

Support &.foo when the parent selector has a newline followed by a comma.

3.2.14 (24 January 2014)

Don't crash when parsing a directive with no name in the indented syntax.
Clean up file paths when importing to avoid errors for overlong path names.
Parse calls to functions named true, false, and null as function calls.
Don't move CSS @imports to the top of the file unless it's necessary.

3.2.13 (19 December 2013)

Numbers returned by user-defined functions now trigger division, just like numbers stored in variables.
Support importing files in paths with open brackets.
Fix sass-convert's handling of rules with empty bodies when converting from CSS.
Fix CSS imports using url() with a quoted string and media queries.

3.2.12 (4 October 2013)

Add a couple missing requires, fixing some load errors, especially when using the command-line interface.
Tune up some heuristics for eliminating redundant generated selectors. This will prevent some selector elimination in cases where multi-layered @extend is being used and where it seems intuitively like selectors shouldn't be eliminated.

3.2.11 (27 September 2013)

Fix @extend's semantics with respect to pseudo-elements. They are no longer treated identically to pseudo-classes.
A more understandable error is now provided when the -E option is passed to the Sass command line in ruby 1.8
Fixed a bug in the output of lists containing unary plus or minus operations during sass <=> scss conversion.
Avoid the IE7 content: counter bug with content: counters as well.
Fix some thread-safety issues.

3.2.10 (26 July 2013)

Use the Sass logger infrastructure for @debug directives.
When printing a Sass error into a CSS comment, escape */ so the comment doesn't end prematurely.
Preserve the ! in /*! ... */-style comments.
Fix a bug where selectors were being incorrectly trimmed when using @extend.
Fix a bug where sass --unix-newlines and sass-convert --in-place are not working on Windows (thanks SATO Kentaro).

3.2.9 (10 May 2013)

Fix a bug where @extends would occasionally cause a selector to be generated with the incorrect specificity.
Avoid loading listen v1.0, even if it's installed as a Gem (see issue 719).
Update the bundled version of listen to 0.7.3.
Automatically avoid the IE7 content: counter bug.

3.2.8 (22 April 2013)

Fix some edge cases where redundant selectors were emitted when using @extend.
Fix a bug where comma-separated lists with interpolation could lose elements.
Fix a bug in sass-convert where lists being passed as arguments to functions or mixins would lose their surrounding parentheses.
Fix a bug in sass-convert where null wasn't being converted correctly.
Fix a bug where multiple spaces in a string literal would sometimes be folded together.
sass and sass-convert won't create an empty file before writing to it. This fixes a flash of unstyled content when using LiveReload and similar tools.
Fix a case where a corrupted cache could produce fatal errors on some versions of Ruby.
Fix a case where a mixin loop error would be incorrectly reported when using @content.

3.2.7 (8 March 2013)

The {Sass::Script::Functions#index index} and {Sass::Script::Functions#zip zip} functions now work like all other list functions and treat individual values as single-element lists.
Avoid stack overflow errors caused by very long function or mixin argument lists.
Emit relative paths when using the --line-comments flag of the sass executable.
Fix a case where very long numbers would cause the SCSS parser to take exponential time.

3.2.6 (22 February 2013)

Support for Rubinius 2.0.0.rc1. All tests pass in 1.8 mode. 1.9 mode has some tests blocked on Rubinius issue 2139.
Support for JRuby 1.7.2.
Support for symlinked executables. Thanks to Yin-So Chen.
Support for bubbling @supports queries in the indented syntax.
Fix an incorrect warning when using @extend from within nested @media queries.
Update the bundled version of listen to 0.7.2.

3.2.5 (4 January 2013)

Fix a bug where bogus @extend warnings were being generated.
Fix an @import bug on Windows. Thanks to Darryl Miles.
Ruby 2.0.0-preview compatibility. Thanks to Eric Saxby.
Fix incorrect line numbering when using DOS line endings with the indented syntax.

3.2.4 (21 December 2012)

Fix imports from .jar files in JRuby. Thanks to Alex Hvostov.
Allow comments within @import statements in SCSS.
Fix a parsing performance bug where long decimals would occasionally take many minutes to parse.

3.2.3 (9 November 2012)

sass --watch no longer crashs when a file in a watched directory is deleted.
Allow @extend within bubbling nodes such as @media.
Fix various JRuby incompatibilities and test failures.
Work around a performance bug that arises from using @extend with deeply-nested selectors.

3.2.2 (2 November 2012)

Add a --poll option to force sass --watch to use the polling backend to Listen.
Fix some error reporting bugs related to @import.
Treat protocol-relative URLs in @imports as static URLs, just like http and https URLs.
Improve the error message for misplaced simple selectors.
Fix an option-handling bug that was causing errors with the Compass URL helpers.
Fix a performance issue with @import that only appears when ActiveSupport is loaded.
Fix flushing of actions to stdout. Thanks to Russell Davis.
Fix the documentation for the max() function.
Fix a @media parsing bug.

Deprecations -- Must Read!

Sass will now print a warning when it encounters a single @import statement that tries to import more than one file. For example, if you have @import "screen" and both screen.scss and _screen.scss exist, a warning will be printed. This will become an error in future versions of Sass.

3.2.1 (15 August 2012)

Fix a buggy interaction with Pow and Capybara that caused EOFErrors.

3.2.0 (10 August 2012)

`@content`

A mixin include can now accept a block of content ({file:SASS_REFERENCE.md#mixin-content Reference Documentation}). The style block will be passed to the mixin and can be placed at the point @content is used. E.g.:

@mixin iphone {
  @media only screen and (max-width: 480px) {
    @content;
  }
}

@include iphone {
  body { color: red }
}

Or in .sass syntax:

=iphone
  @media only screen and (max-width: 480px)
    @content

+iphone
  body
    color: red

Produces:

@media only screen and (max-width: 480px) {
  body { color: red }
}

Note that the contents passed to the mixin are evaluated in the scope they are used, not the scope of the mixin. {file:SASS_REFERENCE.md#variable_scope_and_content_blocks More on variable scoping.}

Placeholder Selectors: `%foo`

Sass supports a new, special type of selector called a "placeholder selector". These look like class and id selectors, except the # or . is replaced by %. They're meant to be used with the {file:SASS_REFERENCE.md#extend @extend directive}, when you want to write styles to be extended but you don't want the base styles to appear in the CSS.

On its own, a placeholder selector just causes a ruleset not to be rendered. For example:

// This ruleset won't be rendered on its own.
#context a%extreme {
  color: blue;
  font-weight: bold;
  font-size: 2em;
}

However, placeholder selectors can be extended, just like classes and ids. The extended selectors will be generated, but the base placeholder selector will not. For example:

.notice { @extend %extreme; }

Is compiled to:

#context a.notice {
  color: blue;
  font-weight: bold;
  font-size: 2em;
}

Variable Arguments

Mixins and functions now both support variable arguments. When defining a mixin or function, you can add ... after the final argument to have it accept an unbounded number of arguments and package them into a list. When calling a mixin or function, you can add ... to expand the final argument (if it's a list) so that each value is passed as a separate argument. For example:

@mixin box-shadow($shadows...) {
  // $shadows is a list of all arguments passed to box-shadow
  -moz-box-shadow: $shadows;
  -webkit-box-shadow: $shadows;
  box-shadow: $shadows;      
}

// This is the same as "@include spacing(1, 2, 3);"
$values: 1, 2, 3;
@include spacing($values...);

Finally, if a variable argument list is passed directly on to another mixin or function, it will also pass along any keyword arguments. This means that you can wrap a pre-existing mixin or function and add new functionality without changing the call signature.

Directive Interpolation

#{} interpolation is now allowed in all plain CSS directives (such as @font-face, @keyframes, and of course @media).

In addition, @media gets some special treatment. In addition to allowing #{} interpolation, expressions may be used directly in media feature queries. This means that you can write e.g.:

$media: screen;
$feature: -webkit-min-device-pixel-ratio;
$value: 1.5;

@media #{$media} and ($feature: $value) {
  ...
}

This is intended to allow authors to easily write mixins that make use of @media and other directives dynamically.

Smaller Improvements

Mixins and functions may now be defined in a nested context, for example within @media rules. This also allows files containing them to be imported in such contexts.
Previously, only the :-moz-any selector was supported; this has been expanded to support any vendor prefix, as well as the plain :any selector.
All proposed CSS4 selectors are now supported, including reference selectors (e.g. .foo /attr/ .bar) and subject selectors (e.g. .foo!).
Sass now supports a global list of load paths, accessible via {Sass.load_paths}. This allows plugins and libraries to easily register their Sass files such that they're accessible to all {Sass::Engine} instances.
Sass.load_paths is initialized to the value of the SASS_PATH environment variable. This variable should contain a colon-separated list of load paths (semicolon-separated on Windows).
In certain cases, redundant selectors used to be created as a result of a single rule having multiple @extends. That redundancy has been eliminated.
Redundant selectors were also sometimes created by nested selectors using @extend. That redundancy has been eliminated as well.
There is now much more comprehensive support for using @extend alongside CSS3 selector combinators (+, ~, and >). These combinators will now be merged as much as possible.
The full set of extended color keywords are now supported by Sass. They may be used to refer to color objects, and colors will render using those color names when appropriate.
Sass 3.2 adds the {Sass::Script::Functions#ie_hex_str ie-hex-str} function which returns a hex string for a color suitable for use with IE filters.
Sass 3.2 adds the {Sass::Script::Functions#min min} and {Sass::Script::Functions#max max} functions, which return the minimum and maximum of several values.
Sass functions are now more strict about how keyword arguments can be passed.
Decimal numbers now default to five digits of precision after the decimal point.
The {Sass::Script::Functions::EvaluationContext#options options hash} available to Sass functions now contains the filename of the file that the function was executed in, rather than the top-level file.

Backwards Incompatibilities -- Must Read!

`@extend` Warnings

Any @extend that doesn't match any selectors in the document will now print a warning. These warnings will become errors in future versions of Sass. This will help protect against typos and make it clearer why broken styles aren't working. For example:

h1.notice {color: red}
a.important {@extend .notice}

This will print a warning, since the only use of .notice can't be merged with a.

You can declare that you don't want warnings for a specific @extend by using the !optional flag. For example:

h1.notice {color: red}
a.important {@extend .notice !optional}

This will not print a warning.

Smaller Incompatibilities

Parent selectors followed immediately by identifiers (e.g. &foo) are fully disallowed. They were deprecated in 3.1.8.
#{} interpolation is now allowed in all comments.
The ! flag may not be used with // comments (e.g. //!).
#{} interpolation is now disallowed in all @import statements except for those using url().
sass-convert no longer supports converting files from LessCSS.

3.1.21 (10 August 2012)

Preserve single-line comments that are embedded within multi-line comments.
Preserve newlines in nested selectors when those selectors are used multiple times in the same document.
Allow tests to be run without the LANG environment variable set.
Update the bundled version of Listen to 0.4.7.
Sass will now convert px to other absolute units using the conversion ratio of 96px == 1in as dictated by the CSS Spec

3.1.20

Don't crash if a UTF encoding isn't found. Thanks to Andrew Garbutt.
Properly watch files recursively with sass --watch. Thanks to Sébastien Tisserant.
Fix the documentation for the {Sass::Script::Functions#append append()} function.
Support the saturate(), opacity(), and invert() functions when used as in the Filter Effects spec.
Support MacRuby. Thanks to Will Glynn.

3.1.19

Fix an uninitialized constant Sass::Exec::Sass::Util error when using the command-line tool.
Allow @extend within directives such as @media as long as it only extends selectors that are within the same directive.

3.1.18

Ruby 2.0 compatibility. Thanks to Jeremy Kemper.

Deprecations -- Must Read!

Deprecate the use of @extend within directives such as @media. This has never worked correctly, and now it's officially deprecated. It will be an error in 3.2.

3.1.17

Don't crash when calling #inspect on an internal Sass tree object in Ruby 1.9.
Fix some bugs in sass --watch introduced in 3.1.16. Thanks to Maher Sallam.
Support bare interpolation in the value portion of attribute selectors (e.g. [name=#{$value}]).
Support keyword arguments for the invert() function.
Handle backslash-separated paths better on Windows.
Fix rake install on Ruby 1.9.
Properly convert nested @if statements with sass-convert.

3.1.16

Fix some bugs in sass-convert selector parsing when converting from CSS.
Substantially improve compilation performance on Ruby 1.8.
Support the @-moz-document directive's non-standard url-prefix and domain function syntax.
Support the @supports directive.
Fix a performance issue when using /*! */ comments with the Rails asset pipeline.
Support -moz-element.
Properly handle empty lists in sass-convert.
Move from FSSM to Listen for file-system monitoring.

3.1.15

Support extending multiple comma-separated selectors (e.g. @extend .foo, .bar). This is just a terser way to write multiple @extends (e.g. @extend .foo; @extend .bar). This wasn't previously intended to work, but it did in the indented syntax only.
Avoid more stack overflows when there are import loops in files.
Update the bundled FSSM to version 0.2.8.1.
Make the grayscale function work with -webkit-filter.
Provide a better error message for selectors beginning with / in the indented syntax.
Flush standard output after printing notifications in sass --watch.
Fix variable definitions in the REPL.

3.1.14

Fix a typo that was causing crashes on Ruby 1.9.

3.1.13

Fix a smattering of subtle bugs that would crop up when using multibyte character sets.
Fix a bug when using @extend with selectors containing newlines.
Make boolean operators short-circuit.
Remove unnecessary whitespace in selectors in :compressed mode.
Don't output debug info within non-@media directives.
Make sure :after and :before selectors end up on the end of selectors resulting from @extend.
Fix a bug when using imports containing invalid path characters on Windows.
Bubble CSS @import statements to the top of stylesheets.

3.1.12

Compatibility with the mathn library (thanks to Thomas Walpole).
Fix some infinite loops with mixins that were previously uncaught.
Catch infinite @import loops.
Fix a deprecation warning in sass --update and --watch (thanks to Marcel Köppen).
Don't make $important a special pre-initialized variable.
Fix exponential parsing time of certain complex property values and selectors.
Properly merge @media directives with comma-separated queries. E.g. @media foo, bar { @media baz { ... } } now becomes @media foo and baz, bar and baz { ... }.

3.1.11

Allow control directives (such as @if) to be nested beneath properties.
Allow property names to begin with a hyphen followed by interpolation (e.g. -#{...}).
Fix a parsing error with interpolation in comma-separated lists.
Make --cache-store with with --update.
Properly report ArgumentErrors that occur within user-defined functions.
Don't crash on JRuby if the underlying Java doesn't support every Unicode encoding.
Add new updated_stylesheet callback, which is run after each stylesheet has been successfully compiled. Thanks to Christian Peters.
Allow absolute paths to be used in an importer with a different root.
Don't destructively modify the options when running Sass::Plugin.force_update.
Prevent Regexp buffer overflows when parsing long strings (thanks to Agworld.

Deprecations -- Must Read!

The updating_stylesheet is deprecated and will be removed in a future release. Use the new updated_stylesheet callback instead.

3.1.10

Fix another aspect of the 3.1.8 regression relating to +.

3.1.9

Fix a regression in 3.1.8 that broke the + combinator in selectors.
Deprecate the loud-comment flag when used with silent comments (e.g. //!). Using it with multi-line comments (e.g. /*!) still works.

3.1.8

Deprecate parent selectors followed immediately by identifiers (e.g. &foo). This should never have worked, since it violates the rule of & only being usable where an element selector would.
Add a --force option to the sass executable which makes --update always compile all stylesheets, even if the CSS is newer.
Disallow semicolons at the end of @import directives in the indented syntax.
Don't error out when being used as a library without requiring fileutil.
Don't crash when Compass-style sprite imports are used with StalenessChecker (thanks to Matthias Bauer).
The numeric precision of numbers in Sass can now be set using the --precision option to the command line. Additionally, the default number of digits of precision in Sass output can now be changed by setting Sass::Script::Number.precision to an integer (defaults to 3). Since this value can now be changed, the PRECISION constant in Sass::Script::Number has been deprecated. In the unlikely event that you were using it in your code, you should now use Sass::Script::Number.precision_factor instead.
Don't crash when running sass-convert with selectors with two commas in a row.
Explicitly require Ruby >= 1.8.7 (thanks Eric Mason).
Properly validate the nesting of elements in imported stylesheets.
Properly compile files in parent directories with --watch and --update.
Properly null out options in mixin definitions before caching them. This fixes a caching bug that has been plaguing some Rails 3.1 users.

3.1.7

Don't crash when doing certain operations with @functions.

3.1.6

The option :trace_selectors can now be used to emit a full trace before each selector. This can be helpful for in-browser debugging of stylesheet imports and mixin includes. This option supersedes the :line_comments option and is superseded by the :debug_info option.
Fix a bug where long @if/@else chains would cause exponential slowdown under some circumstances.

3.1.5

Updated the vendored FSSM version, which will avoid segfaults on OS X Lion when using --watch.

3.1.4

Sass no longer unnecessarily caches the sass options hash. This allows objects that cannot be marshaled to be placed into the options hash.

3.1.3

Sass now logs message thru a logger object which can be changed to provide integration with other frameworks' logging infrastructure.

3.1.2

Fix some issues that were breaking Sass when running within Rubinius.
Fix some issues that were affecting Rails 3.1 integration.
New function zip allows several lists to be combined into one list of lists. For example: zip(1px 1px 3px, solid dashed solid, red green blue) becomes 1px solid red, 1px dashed green, 3px solid blue
New function index returns the list index of a value within a list. For example: index(1px solid red, solid) returns 2. When the value is not found false is returned.

3.1.1

Make sure Sass::Plugin is loaded at the correct time in Rails 3.

3.1.0

Add an {Sass::Script::Functions#invert invert function} that takes the inverse of colors.
A new sass function called if can be used to emit one of two values based on the truth value of the first argument. For example, if(true, 1px, 2px) returns 1px and if(false, 1px, 2px) returns 2px.
Compass users can now use the --compass flag to make the Compass libraries available for import. This will also load the Compass project configuration if run from the project root.
Many performance optimizations have been made by thedarkone.
Allow selectors to contain extra commas to make them easier to modify. Extra commas will be removed when the selectors are converted to CSS.
@import may now be used within CSS or @media rules. The imported file will be treated as though it were nested within the rule. Files with mixins may not be imported in nested contexts.
If a comment starts with !, that comment will now be interpolated (#{...} will be replaced with the resulting value of the expression inside) and the comment will always be printed out in the generated CSS file -- even with compressed output. This is useful for adding copyright notices to your stylesheets.
A new executable named scss is now available. It is exactly like the sass executable except it defaults to assuming input is in the SCSS syntax. Both programs will use the source file's extension to determine the syntax where possible.

Sass-based Functions

While it has always been possible to add functions to Sass with Ruby, this release adds the ability to define new functions within Sass files directly. For example:

$grid-width: 40px;
$gutter-width: 10px;

@function grid-width($n) {
  @return $n * $grid-width + ($n - 1) * $gutter-width;
}

#sidebar { width: grid-width(5); }

Becomes:

#sidebar {
  width: 240px; }

Keyword Arguments

Both mixins and Sass functions now support the ability to pass in keyword arguments. For example, with mixins:

@mixin border-radius($value, $moz: true, $webkit: true, $css3: true) {
  @if $moz { -moz-border-radius: $value }
  @if $webkit { -webkit-border-radius: $value }
  @if $css3 { border-radius: $value }
}

@include border-radius(10px, $webkit: false);

And with functions:

p {
  color: hsl($hue: 180, $saturation: 78%, $lightness: 57%);
}

Keyword arguments are of the form $name: value and come after normal arguments. They can be used for either optional or required arguments. For mixins, the names are the same as the argument names for the mixins. For functions, the names are defined along with the functions. The argument names for the built-in functions are listed {Sass::Script::Functions in the function documentation}.

Sass functions defined in Ruby can use the {Sass::Script::Functions.declare} method to declare the names of the arguments they take.

New Keyword Functions

The new keyword argument functionality enables new Sass color functions that use keywords to encompass a large amount of functionality in one function.

The {Sass::Script::Functions#adjust_color adjust-color} function works like the old lighten, saturate, and adjust-hue methods. It increases and/or decreases the values of a color's properties by fixed amounts. For example, adjust-color($color, $lightness: 10%) is the same as lighten($color, 10%): it returns $color with its lightness increased by 10%.
The {Sass::Script::Functions#scale_color scale_color} function is similar to {Sass::Script::Functions#adjust_color adjust_color}, but instead of increasing and/or decreasing a color's properties by fixed amounts, it scales them fluidly by percentages. The closer the percentage is to 100% (or -100%), the closer the new property value will be to its maximum (or minimum). For example, scale-color(hsl(120, 70, 80), $lightness: 50%) will change the lightness from 80% to 90%, because 90% is halfway between 80% and 100%. Similarly, scale-color(hsl(120, 70, 50), $lightness: 50%) will change the lightness from 50% to 75%.
The {Sass::Script::Functions#change_color change-color} function simply changes a color's properties regardless of their old values. For example change-color($color, $lightness: 10%) returns $color with 10% lightness, and change-color($color, $alpha: 0.7) returns color with opacity 0.7.

Each keyword function accepts $hue, $saturation, $value, $red, $green, $blue, and $alpha keywords, with the exception of scale-color() which doesn't accept $hue. These keywords modify the respective properties of the given color.

Each keyword function can modify multiple properties at once. For example, adjust-color($color, $lightness: 15%, $saturation: -10%) both lightens and desaturates $color. HSL properties cannot be modified at the same time as RGB properties, though.

Lists

Lists are now a first-class data type in Sass, alongside strings, numbers, colors, and booleans. They can be assigned to variables, passed to mixins, and used in CSS declarations. Just like the other data types (except booleans), Sass lists look just like their CSS counterparts. They can be separated either by spaces (e.g. 1px 2px 0 10px) or by commas (e.g. Helvetica, Arial, sans-serif). In addition, individual values count as single-item lists.

Lists won't behave any differently in Sass 3.1 than they did in 3.0. However, you can now do more with them using the new list functions:

The {Sass::Script::Functions#nth nth($list, $n) function} returns the nth item in a list. For example, nth(1px 2px 10px, 2) returns the second item, 2px. Note that lists in Sass start at 1, not at 0 like they do in some other languages.
The {Sass::Script::Functions#join join($list1, $list2) function} joins together two lists into one. For example, join(1px 2px, 10px 5px) returns 1px 2px 10px 5px.
The {Sass::Script::Functions#append append($list, $val) function} appends values to the end of a list. For example, append(1px 2px, 10px) returns 1px 2px 10px.
The {Sass::Script::Functions#join length($list) function} returns the length of a list. For example, length(1px 2px 10px 5px) returns 4.

For more details about lists see {file:SASS_REFERENCE.md#lists the reference}.

`@each`

There's also a new directive that makes use of lists. The {file:SASS_REFERENCE.md#each-directive @each directive} assigns a variable to each item in a list in turn, like @for does for numbers. This is useful for writing a bunch of similar styles without having to go to the trouble of creating a mixin. For example:

@each $animal in puma, sea-slug, egret, salamander {
  .#{$animal}-icon {
    background-image: url('/images/#{$animal}.png');
  }
}

is compiled to:

.puma-icon {
  background-image: url('/images/puma.png'); }
.sea-slug-icon {
  background-image: url('/images/sea-slug.png'); }
.egret-icon {
  background-image: url('/images/egret.png'); }
.salamander-icon {
  background-image: url('/images/salamander.png'); }

`@media` Bubbling

Modern stylesheets often use @media rules to target styles at certain sorts of devices, screen resolutions, or even orientations. They're also useful for print and aural styling. Unfortunately, it's annoying and repetitive to break the flow of a stylesheet and add a @media rule containing selectors you've already written just to tweak the style a little.

Thus, Sass 3.1 now allows you to nest @media rules within selectors. It will automatically bubble them up to the top level, putting all the selectors on the way inside the rule. For example:

.sidebar {
  width: 300px;
  @media screen and (orientation: landscape) {
    width: 500px;
  }
}

is compiled to:

.sidebar {
  width: 300px;
}
@media screen and (orientation: landscape) {
  .sidebar {
    width: 500px;
  }
}

You can also nest @media directives within one another. The queries will then be combined using the and operator. For example:

@media screen {
  .sidebar {
    @media (orientation: landscape) {
      width: 500px;
    }
  }
}

is compiled to:

@media screen and (orientation: landscape) {
  .sidebar {
    width: 500px;
  }
}

Nested `@import`

The @import statement can now be nested within other structures such as CSS rules and @media rules. For example:

@media print {
  @import "print";
}

This imports print.scss and places all rules so imported within the @media print block. This makes it easier to create stylesheets for specific media or sections of the document and distributing those stylesheets across multiple files.

Backwards Incompatibilities -- Must Read!

When @import is given a path without .sass, .scss, or .css extension, and no file exists at that path, it will now throw an error. The old behavior of becoming a plain-CSS @import was deprecated and has now been removed.
Get rid of the --rails flag for the sass executable. This flag hasn't been necessary since Rails 2.0. Existing Rails 2.0 installations will continue to work.
Removed deprecated support for ! prefixed variables. Use $ to prefix variables now.
Removed the deprecated css2sass executable. Use sass-convert now.
Removed support for the equals operator in variable assignment. Use : now.
Removed the sass2 mode from sass-convert. Users who have to migrate from sass2 should install Sass 3.0 and quiet all deprecation warnings before installing Sass 3.1.

Sass Internals

It is now possible to define a custom importer that can be used to find imports using different import semantics than the default filesystem importer that Sass provides. For instance, you can use this to generate imports on the fly, look them up from a database, or implement different file naming conventions. See the {Sass::Importers::Base Importer Base class} for more information.
It is now possible to define a custom cache store to allow for efficient caching of Sass files using alternative cache stores like memcached in environments where a writable filesystem is not available or where the cache need to be shared across many servers for dynamically generated stylesheet environments. See the {Sass::CacheStores::Base CacheStore Base class} for more information.

3.0.26 (Unreleased)

Fix a performance bug in large SCSS stylesheets with many nested selectors. This should dramatically decrease compilation time of such stylesheets.
Upgrade the bundled FSSM to version 0.2.3. This means sass --watch will work out of the box with Rubinius.

125 KiB Raw Blame History

Sass Changelog

3.4.6 (Unreleased)

3.4.5 (19 September 2014)

3.4.4 (12 September 2014)

3.4.3 (4 September 2014)

3.4.2 (28 August 2014)

3.4.1 (22 August 2014)

3.4.0 (18 August 2014)

Using & in SassScript

Selector Functions

Smaller Improvements

Backwards Incompatibilities -- Must Read!

3.3.14 (1 August 2014)

3.3.13 (31 July 2014)

3.3.12 (29 July 2014)

3.3.11 (25 July 2014)

3.3.10 (11 July 2014)

3.3.9 (27 June 2014)

3.3.8 (20 May 2014)

3.3.7 (2 May 2014)

3.3.6 (25 April 2014)

3.3.5 (14 April 2014)

3.3.4 (21 March 2014)

3.3.3 (14 March 2014)

3.3.2 (11 March 2014)

3.3.1 (10 March 2014)

Re-bundle listen

Smaller Changes

3.3.0 (7 March 2014)

SassScript Maps

Variable Keyword Arguments

Lists of Pairs as Maps

Source Maps

@at-root

@at-root (without: ...) and @at-root (with: ...)

Smaller Improvements

Backwards Incompatibilities -- Must Read!

3.2.16 (17 March 2014)

3.2.15 (7 March 2014)

3.2.14 (24 January 2014)

3.2.13 (19 December 2013)

3.2.12 (4 October 2013)

3.2.11 (27 September 2013)

3.2.10 (26 July 2013)

3.2.9 (10 May 2013)

3.2.8 (22 April 2013)

3.2.7 (8 March 2013)

3.2.6 (22 February 2013)

3.2.5 (4 January 2013)

3.2.4 (21 December 2012)

3.2.3 (9 November 2012)

3.2.2 (2 November 2012)

Deprecations -- Must Read!

3.2.1 (15 August 2012)

3.2.0 (10 August 2012)

@content

Placeholder Selectors: %foo

Variable Arguments

Directive Interpolation

Smaller Improvements

Backwards Incompatibilities -- Must Read!

@extend Warnings

Smaller Incompatibilities

3.1.21 (10 August 2012)

3.1.20

3.1.19

3.1.18

Deprecations -- Must Read!

3.1.17

3.1.16

3.1.15

3.1.14

3.1.13

3.1.12

3.1.11

Deprecations -- Must Read!

3.1.10

3.1.9

3.1.8

125 KiB

Raw Blame History

Using `&` in SassScript

`@at-root`

`@at-root (without: ...)` and `@at-root (with: ...)`

`@content`

Placeholder Selectors: `%foo`

`@extend` Warnings

`@each`

`@media` Bubbling

Nested `@import`

`@charset` Change

CSS `@import` Directives

`-moz-calc` Support

`:-moz-any` Support

`--require` Flag

`#{}` Interpolation in Properties

`sass --no-cache`