compass 0.12.7 → 0.13.alpha.4

data/frameworks/compass/stylesheets/compass/css3/_filter.scss

@@ -1,23 +1,43 @@
+// Filter
+
 @import "shared";
 
+// @private css3-feature-support variables must always include a list of five boolean values
+// representing in order: -moz, -webkit, -ms, -o, -khtml
+$filter-support: -moz, -webkit, not -ms, not -o, not -khtml;
+
+
 // Provides cross-browser support for the upcoming (?) css3 filter property.
 //
-// Each filter argument should adhere to the standard css3 syntax for the
-// filter property.
-@mixin filter (
-  $filter-1,
-  $filter-2 : false,
-  $filter-3 : false,
-  $filter-4 : false,
-  $filter-5 : false,
-  $filter-6 : false,
-  $filter-7 : false,
-  $filter-8 : false,
-  $filter-9 : false,
-  $filter-10: false
-) {
-  $filter : compact($filter-1, $filter-2, $filter-3, $filter-4, $filter-5, $filter-6, $filter-7, $filter-8, $filter-9, $filter-10);
-  @include experimental(filter, $filter,
-    -moz, -webkit, not -o, not -ms, not -khtml, official
-  );
+// The filter argument should adhere to the standard css3 syntax
+// for the filter property.
+@mixin filter($filters) {
+  @include experimental(filter, $filters, $filter-support...);
+}
+
+// @private Apply filter-margins
+@mixin apply-filter-margin($position, $width) {
+  @include experimental(filter-margin-#{$position}, $width, $filter-support...);
+}
+
+// filter-margin-top
+@mixin filter-margin-top($width) { @include apply-filter-margin(top, $width); }
+
+// filter-margin-right
+@mixin filter-margin-right($width) { @include apply-filter-margin(right, $width); }
+
+// filter-margin-bottom
+@mixin filter-margin-bottom($width) { @include apply-filter-margin(bottom, $width); }
+
+// filter-margin-left
+@mixin filter-margin-left($width) { @include apply-filter-margin(left, $width); }
+
+// filter-margin
+@mixin filter-margin($widths) {
+  @include experimental(filter-margin, $widths, $filter-support...);
 }
+
+// color-interpolation-filters (auto | sRGB | linearRGB )
+@mixin color-interpolation-filters($value) {
+  @include experimental(color-interpolation-filters, $value, $filter-support...);
+}

data/frameworks/compass/stylesheets/compass/css3/_flexbox.scss

@@ -0,0 +1,294 @@
+@import "shared";
+
+// NOTE:
+// All mixins for the @box spec have been written assuming they'll be fed property values that
+// correspond to the standard spec.  Some mixins can be fed values from the @box spec, but don't
+// rely on it.  The `legacy-order` mixin will increment the value fed to it because the @box
+// `box-ordinal-group` property begins indexing at 1, while the modern `order` property begins
+// indexing at 0.
+
+// ---------------------------------------------------------------------- | @flex
+
+// September 2012 Candidate Recommendation (http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/)
+// NOTE: FF did not support wrapping until version ??.  Because the `display: flex` property
+// is wrapped in a `@supports (flex-wrap: wrap)` block (when $flex-wrap-required or the $wrap
+// argument to the `display-flex` mixin is set to `true`), it will Just Work(TM) when support is
+// finally added
+// Chrome 21 (prefixed)
+// Opera 12.1 (unprefixed)
+// Firefox 20 (unprefixed)
+$flex-support: not -moz, -webkit, not -ms, not -o, not -khtml !default;
+
+// if `true`, `$flex-legacy-enabled` is treated as false and an `@supports` block is added to 
+// the display property to hide the standard value from versions of Firefox that support the
+// unprefixed properties, but do not support wrapping
+// (this includes suppressing the automatic emittion of @box properties)
+$flex-wrap-required : false !default;
+
+// ---------------------------------------------------------------------- | @flexbox
+
+// March 2012 Working Draft (http://www.w3.org/TR/2012/WD-css3-flexbox-20120322/)
+// Chrome 17 (prefixed)
+// Internet Explorer 10 (prefixed)
+$flexbox-support: not -moz, -webkit, -ms, not -o, not -khtml, not standard !default;
+
+// ---------------------------------------------------------------------- | @box
+
+// July 2009 Working Draft (http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/)
+// NOTE: no browser that implements this spec is known to support `box-lines: multiple`
+// Chrome 4? (prefixed)
+// Safari 3.1 (prefixed)
+// Firefox <20 (prefixed)
+$box-support: -moz, -webkit, not -ms, not -o, not -khtml, not standard !default;
+
+// If `true`, the @box properties will be emitted as part of the normal mixin call
+// (if this is false, you're still free to explicitly call the legacy mixins yourself)
+$flex-legacy-enabled: false !default;
+
+// ====================================================================================================
+//                                                                       | Common
+// ====================================================================================================
+
+// function for converting a value from the standard specification to one that is comparable from
+// an older specification
+@function flex-translate-value($value, $version: box) {
+	$value: unquote($value);
+
+	@if $value == flex {
+		@return if($version == box, box, flexbox);
+	} @else if $value == inline-flex {
+		@return if($version == box, inline-box, inline-flexbox);
+	} @else if $value == flex-start {
+		@return start;
+	} @else if $value == flex-end {
+		@return end;
+	} @else if $value == space-between {
+		@return justify;
+	} @else if $value == space-around { // @box doesn't have a value equivalent to `space-around`
+		@return if($version == box, justify, distribute);
+	}
+	@return $value;
+}
+
+@function flex-support-either() {
+	$common: ();
+	@for $i from 1 through length($flex-support) {
+		$common: append($common, nth($flex-support, $i) or nth($flexbox-support, $i), comma);
+	}
+	@return $common;
+}
+
+// ====================================================================================================
+//                                                                       | Display Property
+// ====================================================================================================
+
+// $type: flex | inline-flex
+@mixin display-flex($type: flex, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-display-flex($type);
+	}
+	
+	@include experimental-value(display, flex-translate-value($type, flexbox), $flexbox-support...);
+	
+	// if `$wrap` is true, then we need to suppress official support as generated by the `experimental()`
+	// mixin so that we can insert it inside an `@supports` block
+	$flex-support-standard: true;
+	$flex-support-list: $flex-support;
+	@if length($flex-support) > 5 {
+		$flex-support-standard: nth($flex-support, 6);
+		// a `slice()` function would really be handy here...
+		$flex-support-list: nth($flex-support, 1), nth($flex-support, 2), nth($flex-support, 3), nth($flex-support, 4), nth($flex-support, 5);
+	}
+	$flex-support-list: append($flex-support-list, if($wrap, false, $flex-support-standard));
+	@include experimental-value(display, $type, $flex-support-list...);
+	
+	@if $wrap and $flex-support-standard {
+		@supports (flex-wrap: wrap) {
+			display: $type;
+		}
+	}
+}
+
+@mixin legacy-display-flex($type: flex) {
+	@include experimental-value(display, flex-translate-value($type, box), $box-support...);
+}
+
+// ====================================================================================================
+//                                                                       | Flex Container Properties
+// ====================================================================================================
+
+// $value: <'flex-direction'> || <'flex-wrap'>
+@mixin flex-flow($value: row nowrap, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-flex-flow($value);
+	}
+	
+	@include experimental(flex-flow, $value, flex-support-either()...);
+}
+
+@mixin legacy-flex-flow($value: row nowrap) {
+	@if length($value) > 1 { // @box version doesn't have a shorthand
+		@include legacy-flex-direction(nth($value, 1));
+		@include legacy-flex-wrap(nth($value, 2));
+	} @else {
+		$value: unquote($value);
+		@if $value == row or $value == row-reverse or $value == column or $value == column-reverse {
+			@include legacy-flex-direction($value);
+		} @else {
+			@include legacy-flex-wrap($value);
+		}
+	}
+}
+
+// ----------------------------------------------------------------------
+
+// $value: row | row-reverse | column | column-reverse
+@mixin flex-direction($value: row, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-flex-direction($value);
+	}
+	
+	@include experimental(flex-direction, $value, flex-support-either()...);
+}
+
+@mixin legacy-flex-direction($value: row) {
+	$value: unquote($value);
+	@include experimental(box-orient, if($value == row or $value == row-reverse, horizontal, vertical), $box-support...);
+	@include experimental(box-direction, if($value == row-reverse or $value == column-reverse, reverse, normal), $box-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// $value: nowrap | wrap | wrap-reverse
+@mixin flex-wrap($value: nowrap, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-flex-wrap($value);
+	}
+	
+	@include experimental(flex-wrap, $value, flex-support-either()...);
+}
+
+@mixin legacy-flex-wrap($value: nowrap) {
+	// NOTE: @box has no equivalent of wrap-reverse
+	@include experimental(box-lines, if($value == nowrap, single, multiple), $box-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// Distributing extra space along the "main axis"
+// $value: flex-start | flex-end | center | space-between | space-around
+@mixin justify-content($value: flex-start, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-justify-content($value);
+	}
+	
+	@include experimental(flex-pack, flex-translate-value($value, flexbox), $flexbox-support...);
+	@include experimental(justify-content, $value, $flex-support...);
+}
+
+@mixin legacy-justify-content($value: flex-start) {
+	@include experimental(box-pack, flex-translate-value($value, box), $box-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// Distributing extra space along the "cross axis"
+// $value: flex-start | flex-end | center | space-between | space-around | stretch
+@mixin align-content($value: flex-start, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-align-content($value);
+	}
+	
+	@include experimental(flex-line-pack, flex-translate-value($value, flexbox), $flexbox-support...);
+	@include experimental(align-content, $value, $flex-support...);
+}
+
+@mixin legacy-align-content($value: flex-start) {
+	@include experimental(box-align, flex-translate-value($value, box), $box-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// Align items along the "cross axis"
+// $value: flex-start | flex-end | center | baseline | stretch
+@mixin align-items($value: stretch) { // the flex container
+	// There is no @box version of this property
+	@include experimental(flex-align, flex-translate-value($value, flexbox), $flexbox-support...);
+	@include experimental(align-items, $value, $flex-support...);
+}
+
+// ====================================================================================================
+//                                                                       | Flex Item Properties
+// ====================================================================================================
+
+// $value: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]
+@mixin flex($value: 0 1 auto, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	$value: unquote($value);
+	@if $legacy and unitless(nth($value, 1)) {
+		// @box version does not have a shorthand, see `legacy-flex-grow`
+		@include legacy-flex-grow(nth($value, 1));
+	}
+	
+	@include experimental(flex, $value, flex-support-either()...);
+}
+
+// ----------------------------------------------------------------------
+
+// $value: Integer
+@mixin flex-grow($value: 0, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-flex-grow($value);
+	}
+	
+	// There is no @flexbox version of this property
+	@include experimental(flex-grow, $value, $flex-support...);
+}
+
+@mixin legacy-flex-grow($value: 0) {
+	@include experimental(box-flex, $value, $box-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// $value: Integer
+@mixin flex-shrink($value: 1) {
+	// There is no @box version of this property
+	// There is no @flexbox version of this property
+	@include experimental(flex-shrink, $value, $flex-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// $value: united number (eg: 100px)
+@mixin flex-basis($value: auto) {
+	// There is no @box version of this property
+	// There is no @flexbox version of this property
+	@include experimental(flex-basis, $value, $flex-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// Align items along the "cross axis" -- overrides `align-items` value on individual items
+// $value: auto | flex-start | flex-end | center | baseline | stretch
+@mixin align-self($value: auto) { // children of flex containers
+	// There is no @box version of this property
+	@include experimental(flex-item-align, flex-translate-value($value, flexbox), $flexbox-support...);
+	@include experimental(align-self, $value, $flex-support...);
+}
+
+// ----------------------------------------------------------------------
+
+// $value: Integer
+@mixin order($value: 0, $wrap: $flex-wrap-required, $legacy: $flex-legacy-enabled) {
+	@if $legacy and not $wrap {
+		@include legacy-order($value);
+	}
+	
+	@include experimental(flex-order, $value, $flexbox-support...);
+	@include experimental(order, $value, $flex-support...);
+}
+
+@mixin legacy-order($value: 0) {
+	// the @box spec starts the ordering at 1 instead of 0 like the modern specs
+	@include experimental(box-ordinal-group, $value + 1, $box-support...);
+}

data/frameworks/compass/stylesheets/compass/css3/_font-face.scss

@@ -16,7 +16,7 @@
 // [font generator](http://www.fontsquirrel.com/fontface/generator)
 //
 
-// In order to refer to a specific style of the font in your stylesheets as
+// In order to refer to a specific style of the font in your stylesheets as 
 // e.g. "font-style: italic;",  you may add a couple of @font-face includes
 // containing the respective font files for each style and specying
 // respective the $style parameter.
@@ -24,8 +24,8 @@
 // Order of the includes matters, and it is: normal, bold, italic, bold+italic.
 
 @mixin font-face(
-  $name,
-  $font-files,
+  $name, 
+  $font-files, 
   $eot: false,
   $weight: false,
   $style: false
@@ -35,7 +35,7 @@
     font-family: quote($name);
     @if $eot {
       src: font-url($eot);
-      $font-files: font-url($iefont) unquote("format('embedded-opentype')"), $font-files;
+      $font-files: font-url($iefont) unquote("format('eot')"), $font-files; 
     }
     src: $font-files;
     @if $weight {

data/frameworks/compass/stylesheets/compass/css3/_hyphenation.scss

@@ -1,9 +1,13 @@
+// Mixins to support specific CSS Text Level 3 elements
+
 @import "shared";
 
-// Mixins to support specific CSS Text Level 3 elements
-//
-//
-//
+// @private css3-feature-support variables must always include a list of five boolean values
+// representing in order: -moz, -webkit, -ms, -o, -khtml
+//   - mozilla/webkit legacy support handled seperately below
+$hyphens-support: -moz, -webkit, -ms, -o, not -khtml;
+
+
 // Mixin for word-break properties
 // http://www.w3.org/css3-text/#word-break
 // * legal values for $type : normal, keep-all, break-all
@@ -18,21 +22,10 @@
 //      word-break: break-word;}
 //
 @mixin word-break($value: normal){
-  @if $value == break-all {
-    //Most browsers handle the break-all case the same...
-    @include experimental(word-break, $value,
-      not -moz, not -webkit, not -o, -ms, not -khtml, official
-    );
-    //Webkit handles break-all differently... as break-word
-    @include experimental(word-break, break-word,
-      not -moz, not -webkit, not -o, not -ms, not -khtml, official
-    );
-  }
-  @else {
-    @include experimental(word-break, $value,
-      not -moz, not -webkit, not -o, -ms, not -khtml, official
-    );
-  }
+  word-break: $value;
+
+  //Webkit handles break-all differently... as break-word
+  @if $value == break-all { word-break: break-word; }
 }
 
 // Mixin for the hyphens property
@@ -50,9 +43,7 @@
 //    hyphens: auto;}
 //
 @mixin hyphens($value: auto){
-  @include experimental(hyphens, $value,
-    -moz, -webkit, not -o, not -ms, not -khtml, official
-  );
+  @include experimental(hyphens, $value, $hyphens-support);
 }
 
 // Mixin for x-browser hyphenation based on @auchenberg's post:

data/frameworks/compass/stylesheets/compass/css3/_images.scss

@@ -1,25 +1,35 @@
 @import "shared";
 @import "compass/utilities/general/hacks";
 
+// Compass assumes you will use the official gradient syntax,
+// unless otherwise instructed.
+$use-legacy-gradient-syntax: false !default;
+
+// Create a linear gradient using standard official or legacy syntax.
+// This function must be included in one of the following
+// image module mixins to work properly.
+@function linear-gradient($angle, $details...) {
+  $legacy-syntax: $use-legacy-gradient-syntax;
+
+  @if type-of($angle) != 'number' {
+    $angle: compact($angle);
+    $legacy-syntax: if(index($angle, 'to'), false, true);
+  }
+
+  @if $legacy-syntax {
+    @return _linear-gradient_legacy($angle, $details...);
+  } @else {
+    @return _linear-gradient($angle, $details...);
+  }
+}
+
 // Background property support for vendor prefixing within values.
 @mixin background(
-  $background-1,
-  $background-2: false,
-  $background-3: false,
-  $background-4: false,
-  $background-5: false,
-  $background-6: false,
-  $background-7: false,
-  $background-8: false,
-  $background-9: false,
-  $background-10: false
+  $backgrounds...
 ) {
-  $backgrounds: compact($background-1, $background-2, $background-3, $background-4, $background-5,
-                        $background-6, $background-7, $background-8, $background-9, $background-10);
   $mult-bgs: -compass-list-size($backgrounds) > 1;
   $add-pie-bg: prefixed(-pie,   $backgrounds) or $mult-bgs;
   @if $experimental-support-for-svg          and prefixed(-svg,    $backgrounds) {      background:    -svg($backgrounds); }
-  @if $support-for-original-webkit-gradients and prefixed(-owg,    $backgrounds) {      background:    -owg($backgrounds); }
   @if $experimental-support-for-webkit       and prefixed(-webkit, $backgrounds) {      background: -webkit($backgrounds); }
   @if $experimental-support-for-mozilla      and prefixed(-moz,    $backgrounds) {      background:    -moz($backgrounds); }
   @if $experimental-support-for-opera        and prefixed(-o,      $backgrounds) {      background:      -o($backgrounds); }
@@ -27,46 +37,25 @@
                                                                                         background:         $backgrounds ;
 }
 
+// Set any number of background layers, along with a fallback.
+// The final argument will be output separately, first, as a css2 fallback.
 @mixin background-with-css2-fallback(
-  $background-1,
-  $background-2: false,
-  $background-3: false,
-  $background-4: false,
-  $background-5: false,
-  $background-6: false,
-  $background-7: false,
-  $background-8: false,
-  $background-9: false,
-  $background-10: false
+  $backgrounds...
 ) {
-  $backgrounds: compact($background-1, $background-2, $background-3, $background-4, $background-5,
-                        $background-6, $background-7, $background-8, $background-9, $background-10);
   $mult-bgs: -compass-list-size($backgrounds) > 1;
   $simple-background: if($mult-bgs or prefixed(-css2, $backgrounds), -css2(-compass-nth($backgrounds, last)), false);
   @if not blank($simple-background) { background: $simple-background; }
-  @include background($background-1, $background-2, $background-3, $background-4, $background-5,
-                      $background-6, $background-7, $background-8, $background-9, $background-10);
+  @include background($backgrounds);
 }
 
 
 // Background image property support for vendor prefixing within values.
 @mixin background-image(
-  $image-1,
-  $image-2: false,
-  $image-3: false,
-  $image-4: false,
-  $image-5: false,
-  $image-6: false,
-  $image-7: false,
-  $image-8: false,
-  $image-9: false,
-  $image-10: false
+  $images...
 ) {
-  $images: compact($image-1, $image-2, $image-3, $image-4, $image-5, $image-6, $image-7, $image-8, $image-9, $image-10);
   $add-pie-bg: prefixed(-pie,   $images) or -compass-list-size($images) > 1;
 
   @if $experimental-support-for-svg          and prefixed(-svg,    $images) { background-image:    -svg($images); background-size: 100%; }
-  @if $support-for-original-webkit-gradients and prefixed(-owg,    $images) { background-image:    -owg($images); }
   @if $experimental-support-for-webkit       and prefixed(-webkit, $images) { background-image: -webkit($images); }
   @if $experimental-support-for-mozilla      and prefixed(-moz,    $images) { background-image:    -moz($images); }
   @if $experimental-support-for-opera        and prefixed(-o,      $images) { background-image:      -o($images); }
@@ -80,7 +69,11 @@
 // any background-image properties that you have specified.
 //
 // For the `$orientation` parameter, you can pass `vertical` or `horizontal`.
-@mixin filter-gradient($start-color, $end-color, $orientation: vertical) {
+@mixin filter-gradient(
+  $start-color,
+  $end-color,
+  $orientation: vertical
+) {
   @include has-layout;
   $gradient-type: if($orientation == vertical, 0, 1);
   @if $legacy-support-for-ie6 or $legacy-support-for-ie7 or $legacy-support-for-ie8 {
@@ -90,9 +83,10 @@
 
 
 // Border image property support for vendor prefixing properties and values.
-@mixin border-image($value) {
+@mixin border-image(
+  $value
+) {
   @if $experimental-support-for-mozilla      {    -moz-border-image:    -moz(reject(-compass-list($value), fill)); }
-  @if $support-for-original-webkit-gradients { -webkit-border-image:    -owg(reject(-compass-list($value), fill)); }
   @if $experimental-support-for-webkit       { -webkit-border-image: -webkit(reject(-compass-list($value), fill)); }
   @if $experimental-support-for-opera        {      -o-border-image:      -o(reject(-compass-list($value), fill)); }
   @if $experimental-support-for-svg          {         border-image:    -svg(reject(-compass-list($value), fill)); }
@@ -100,9 +94,10 @@
 }
 
 // List style image property support for vendor prefixing within values.
-@mixin list-style-image($image) {
+@mixin list-style-image(
+  $image
+) {
   @if $experimental-support-for-mozilla      and prefixed(-moz,    $image) { list-style-image:    -moz($image); }
-  @if $support-for-original-webkit-gradients and prefixed(-owg,    $image) { list-style-image:    -owg($image); }
   @if $experimental-support-for-webkit       and prefixed(-webkit, $image) { list-style-image: -webkit($image); }
   @if $experimental-support-for-opera        and prefixed(-o,      $image) { list-style-image:      -o($image); }
   @if $experimental-support-for-svg          and prefixed(-svg,    $image) { list-style-image:    -svg($image); }
@@ -110,10 +105,11 @@
 }
 
 // List style property support for vendor prefixing within values.
-@mixin list-style($value) {
+@mixin list-style(
+  $value
+) {
   $value: -compass-list($value);
   @if $experimental-support-for-mozilla      and prefixed(-moz,    $value) { list-style-image:    -moz($value); }
-  @if $support-for-original-webkit-gradients and prefixed(-owg,    $value) { list-style-image:    -owg($value); }
   @if $experimental-support-for-webkit       and prefixed(-webkit, $value) { list-style-image: -webkit($value); }
   @if $experimental-support-for-opera        and prefixed(-o,      $value) { list-style-image:      -o($value); }
   @if $experimental-support-for-svg          and prefixed(-svg,    $value) { list-style-image:    -svg($value); }
@@ -121,10 +117,11 @@
 }
 
 // content property support for vendor prefixing within values.
-@mixin content($value) {
+@mixin content(
+  $value
+) {
   $value: -compass-list($value);
   @if $experimental-support-for-mozilla      and prefixed(-moz,    $value) { content:    -moz($value); }
-  @if $support-for-original-webkit-gradients and prefixed(-owg,    $value) { content:    -owg($value); }
   @if $experimental-support-for-webkit       and prefixed(-webkit, $value) { content: -webkit($value); }
   @if $experimental-support-for-opera        and prefixed(-o,      $value) { content:      -o($value); }
   @if $experimental-support-for-svg          and prefixed(-svg,    $value) { content:    -svg($value); }

data/frameworks/compass/stylesheets/compass/css3/_inline-block.scss

@@ -14,7 +14,7 @@ $inline-block-alignment: middle !default;
   @if $alignment and $alignment != none {
     vertical-align: $alignment;
   }
-  @if $legacy-support-for-ie {
+  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
     *vertical-align: auto;
     zoom: 1;
     *display: inline;

data/frameworks/compass/stylesheets/compass/css3/_regions.scss

@@ -1,22 +1,26 @@
+// Regions
+
 @import "shared";
 
+// @private css3-feature-support variables must always include a list of five boolean values
+// representing in order: -moz, -webkit, -ms, -o, -khtml.
+$regions-support: not -moz, -webkit, -ms, not -o, not -khtml;
+
 // Webkit, IE10 and future support for [CSS Regions](http://dev.w3.org/csswg/css3-regions/)
 //
-// $target is a value you use to link two regions of your css. Give the source of your content the flow-into property, and give your target container the flow-from property.
+// $target is a value you use to link two regions of your css.
+// Give the source of your content the flow-into property,
+// and give your target container the flow-from property.
 //
 // For a visual explanation, see the diagrams at Chris Coyier's
 // [CSS-Tricks](http://css-tricks.com/content-folding/)
 
 @mixin flow-into($target) {
   $target: unquote($target);
-  @include experimental(flow-into, $target,
-    not -moz, -webkit, not -o, -ms, not -khtml, not official
-  );
+  @include experimental(flow-into, $target, $regions-support...);
 }
 
 @mixin flow-from($target) {
   $target: unquote($target);
-  @include experimental(flow-from, $target,
-    not -moz, -webkit, not -o, -ms, not -khtml, not official
-  );
-}
+  @include experimental(flow-from, $target, $regions-support...);
+}