compass 0.13.alpha.4 → 0.13.alpha.5

data/test/fixtures/stylesheets/compass/sass/filters.scss

@@ -1,3 +1,4 @@
+$debug-browser-support: true;
 @import "compass/css3/filter";
 
 .blur {

data/test/fixtures/stylesheets/compass/sass/flexbox.scss

@@ -1,44 +1,88 @@
 @import "compass/css3/flexbox";
 
+.display {
+  @include display-flex;
+}
+
+.flex-direction {
+  @include flex-direction(row-reverse);
+}
+
+.flex-wrap {
+  @include flex-wrap(wrap-reverse);
+}
+
+.flex-flow {
+  @include flex-flow(row-reverse wrap-reverse);
+}
+
+.order {
+  @include order(1);
+}
+
 .flex {
-	@include display-flex;
-	@include flex-flow(column nowrap);
-	@include justify-content(space-between);
-	@include align-content(center);
-	@include align-items(flex-end);
-}
-
-.flex-item {
-	@include flex(1 1 auto);
-	@include align-self(flex-start);
-	@include order(2);
-}
-
-$flex-legacy-enabled: true;
-.flex-legacy {
-	@include display-flex;
-	@include flex-flow(row nowrap);
-	@include justify-content(flex-end);
-	@include align-content(flex-start);
-	@include align-items(baseline);
-}
-
-.flex-item-legacy {
-	@include flex(2 1 20em);
-	@include align-self(stretch);
-	@include order(3);
-}
-$flex-wrap-required: true;
-.flex-legacy {
-	@include display-flex;
-	@include flex-flow(row wrap);
-	@include justify-content(space-around);
-	@include align-content(stretch);
-	@include align-items(flex-start);
-}
-
-.flex-item-legacy {
-	@include flex(1 2 50%);
-	@include align-self(flex-start);
-	@include order(1);
+  @include flex(1 0 auto);
+}
+
+.flex-grow {
+  @include flex-grow(1);
+}
+
+.flex-shrink {
+  @include flex-shrink(1);
+}
+
+.flex-basis {
+  @include flex-basis(auto);
+}
+
+.justify-content {
+  @include justify-content(flex-start);
+}
+
+.align-items {
+  @include align-items(flex-start);
+}
+
+.align-self {
+  @include align-self(flex-start);
+}
+
+.align-content {
+  @include align-content(flex-start);
+}
+
+.flexbox {
+  @include flexbox((
+    display: flex,
+    flex-direction: row-reverse,
+    flex-wrap: wrap-reverse,
+    flex-flow: row-reverse wrap-reverse,
+    order: 1,
+    flex: 1 0 auto,
+    flex-grow: 1,
+    flex-shrink: 0,
+    flex-basis: auto,
+    justify-content: flex-start,
+    align-items: flex-start,
+    align-self: flex-start,
+    align-content: flex-start
+  ));
+}
+
+.flexbox-2 {
+  @include flexbox((
+    display: flexbox,
+    flex-flow: row-reverse,
+    flex-order: 1,
+  ), $version: 2);
+}
+
+.flexbox-1 {
+  @include flexbox((
+    display: box,
+    box-orient: vertical,
+    box-ordinal-group: 1,
+    box-flex: 1,
+  ), $version: 1);
 }

data/test/fixtures/stylesheets/compass/sass/gradients.sass

@@ -1,6 +1,7 @@
 @import compass/css3/images
 
-$experimental-support-for-svg: true
+$svg-gradient-shim-threshold: 0
+
 .bg-shortcut-simple-image
   +background(#fff url('foo.png'))
 
@@ -77,7 +78,7 @@ $experimental-support-for-svg: true
 .content-with-gradient
   +content(radial-gradient(lime, red 10px))
 
-$experimental-support-for-svg: false
+$svg-gradient-shim-threshold: 10
 
 .bg-linear-gradient-no-position
   +background-image(linear-gradient(#ddd, #aaa))

data/test/fixtures/stylesheets/compass/sass/selection.scss

@@ -1,13 +1,38 @@
 @import "compass/css3/selection";
 
-@include selection {
-  background-color: #fe57a1;
-  color: #fff;
+* {
+  @include selection {
+    background-color: #fe57a1;
+    color: #fff;
+  }
 }
 
 .hot-pink {
-  @include selection("&") {
+  @include selection {
     background-color: #fe57a1;
     color: #fff;
   }
 }
+
+.hot-pink-with-arguments {
+  @include selection(#fe57a1, #fff);
+}
+
+.hot-pink-with-arguments-and-extra-stuff {
+  @include selection(#fe57a1, #fff) {
+    text-decoration: line-through;
+  }
+}
+
+.hot-pink-with-default-foreground {
+  @include selection(#fe57a1);
+}
+
+.browser-support-is-considered {
+  @include selection(#fe57a1) {
+    prefix: $current-prefix;
+    -moz-prefix: $current-prefix == -moz;
+    -ms-prefix: $current-prefix == -ms;
+    -webkit-prefix: $current-prefix == -webkit;
+  }
+}

data/test/fixtures/stylesheets/compass/sass/sprites_with_explicit_separator.scss

@@ -0,0 +1,7 @@
+$flag_states-sprite-dimensions: true;
+$flag_states-class-separator: "_";
+
+@import "flag_states/*.png";
+
+@include all-flag_states-sprites;
+

data/test/fixtures/stylesheets/compass/sass/support.scss

@@ -0,0 +1,137 @@
+@import "compass/css3/animation";
+@import "compass/css3/opacity";
+@import "true";
+
+$some-default-value: some default value;
+@function has-default-arglist($arglist...) {
+  @return set-arglist-default($arglist, $some-default-value);
+}
+
+@mixin with-declared-support($browsers) {
+  $old-browsers: $supported-browsers;
+  $supported-browsers: $browsers;
+  @content;
+  $supported-browsers: $old-browsers;
+}
+
+@mixin with-declared-minimums($supported-browsers) {
+    $old-mins: $browser-minimum-versions;
+    $browser-minimum-versions: $supported-browsers;
+    @content;
+    $browser-minimum-versions: $old-mins;
+}
+
+@include test-module('Compass Support') {
+  @include test('[function] set-arglist-default() with no arguments') {
+    @include assert-true(
+               has-default-arglist() == $some-default-value,
+               'No arguments should get a default value.');
+  }
+  @include test('[function] set-arglist-default() with a "default" argument') {
+    @include assert-true(
+               nth(has-default-arglist(default), 1) == $some-default-value,
+               'an argument of "default" should get a default value.');
+  }
+  @include test('[function] set-arglist-default() with a "default" argument and another argument') {
+    @include assert-true(
+               has-default-arglist(default, some other value) == ($some-default-value, some other value),
+               'an argument of "default" should get a default value.');
+  }
+  @include test('[function] set-arglist-default() with a "default" argument not first and another argument') {
+    @include assert-true(
+               has-default-arglist(some other value, default) == (some other value, $some-default-value),
+               'an argument of "default" should get a default value.');
+  }
+
+  @include test('[function] support-legacy-browser() from threshold') {
+    @include assert-true(support-legacy-browser('ie', '6', 0.00000001),
+                         "should be supported because of user support threshold.");
+    @include assert-false(support-legacy-browser('ie', '6', 10.000),
+                          "should not be supported because of support threshold.");
+  }
+
+  @include test('[function] support-legacy-browser() from minimums') {
+    @include with-declared-minimums(('ie': '7')) {
+      @include assert-true(support-legacy-browser('ie', '7', 10.00),
+      "should be supported because of minimum version.");
+      @include assert-false(support-legacy-browser('ie', '6', 10.000),
+      "should not be supported because of minimum version.");
+    }
+  }
+
+  @include test('[function] browser-out-of-scope() with no scope') {
+    @include assert-true(not browser-out-of-scope('ie'), "should be in scope.");
+    @include assert-true(not browser-out-of-scope('chrome'), "should be in scope.");
+  }
+
+  @include test('[function] browser-out-of-scope() with a scope') {
+    @include with-prefix(browser-prefix('chrome')) {
+      @include assert-true(not browser-out-of-scope('chrome'), "should be in scope.");
+      @include assert-false(not browser-out-of-scope('ie'), "should not be in scope.");
+    }
+  }
+
+  @include test('[function] browser-out-of-scope() with version') {
+    @include with-browser-minimums((ie: '8')) {
+      @include assert-true(not browser-out-of-scope('ie', '10'), "should be in scope.");
+      @include assert-true(not browser-out-of-scope('ie', '8'), "should be in scope.");
+      @include assert-false(not browser-out-of-scope('ie', '7'), "should not be in scope.");
+    }
+  }
+
+  @include test('[mixin] with-prefix()') {
+    @include assert-true($current-prefix == null, "should be null.");
+    @include with-prefix(-webkit) {
+      @include assert-true($current-prefix == -webkit, "should be set.");
+      $called: false;
+      @include with-prefix(-webkit) {
+        $called: true;
+      }
+      @include assert-true($called, "should be called.");
+      $called: false;
+      @include with-prefix(-ms) {
+        $called: true;
+      }
+      @include assert-false($called, "should not be called.");
+    }
+  }
+
+  @include test('[mixin] with-each-prefix()') {
+    $prefixes: ();
+    @include with-each-prefix(css-regions, 0.0001) {
+      $prefixes: append($prefixes, $current-prefix);
+    }
+    @include assert-equal((-ms -webkit null), $prefixes, "Not equal");
+  }
+
+  @include test('[mixin] with-each-prefix() respects $supported-browsers') {
+    @include with-declared-support("ie") {
+      $prefixes: ();
+      @include with-each-prefix(css-regions, 0.0001) {
+        $prefixes: append($prefixes, $current-prefix);
+      }
+      @include assert-equal((-ms null), $prefixes, "Not equal");
+    }
+  }
+
+  @include test('[mixin] with-each-prefix() respects $current-prefix') {
+    @include with-prefix(-webkit) {
+      $prefixes: ();
+      @include with-each-prefix(css-regions, 0.0001) {
+        $prefixes: append($prefixes, $current-prefix);
+      }
+      @include assert-equal(false, index($prefixes, null), "Not not have a null");
+      @include assert-equal("-webkit", #{$prefixes}, "Not equal");
+    }
+  }
+}
+
+@include with-browser-support-debugging {
+  @include keyframes(foo) {
+    0% { @include opacity(0); }
+    100% { @include opacity(1); }
+  }
+  .foo {
+    @include animation(foo 1s);
+  }
+}

data/test/fixtures/stylesheets/compass/sass/transition.scss

@@ -2,7 +2,6 @@
 
 .single-transition-without-delay  { @include single-transition(all, 0.6s, ease-out); }
 .single-transition-with-delay     { @include single-transition(all, 0.6s, ease-out, 0.2s); }
-.transition-duration-string { @include transition-duration("0.2s, 0.5s, 0.2s"); }
 .transition-duration-list { @include transition-duration((0.2s, 0.5s, 0.2s)); }
 .multiple-transition-durations { @include transition-duration(0.2s, 0.5s, 0.2s); }
 .single-transform-transition-without-delay  { @include single-transition(transform, 0.6s, ease-out); }
@@ -16,9 +15,7 @@
 .transition-timing { @include transition-timing-function(ease-in); }
 .transition-timings { @include transition-timing-function(ease-in, cubic-bezier(1,0,1,0)); }
 .transition-timings-list { @include transition-timing-function((ease-in, cubic-bezier(1,0,1,0))); }
-.transition-timings-string { @include transition-timing-function("ease-in, cubic-bezier(1,0,1,0)"); }
 .transition-delay { @include transition-delay(1s); }
 .transition-delays { @include transition-delay(1s, 2s, 3s); }
 .transition-delays-list { @include transition-delay((1s, 2s, 3s)); }
-.transition-delays-string { @include transition-delay("1s, 2s, 3s"); }
 .regression-912 { @include transition((background-color 0.5s ease-in 0s, width 0.5s ease-out 0s, height 0.5s ease-in 0s, top 0.5s ease-out 0s)); }

data/test/fixtures/stylesheets/compass/sass/typography/links/hover-link.scss

@@ -0,0 +1,3 @@
+@import "compass/typography/links/hover-link";
+
+a { @include hover-link; }

data/test/fixtures/stylesheets/compass/sass/user-interface.scss

@@ -4,14 +4,25 @@
   @include user-select(none);
 }
 
-@include input-placeholder {
-  color: #bfbfbf;
-  font-style: italic;
+* {
+  @include input-placeholder {
+    color: #bfbfbf;
+    font-style: italic;
+  }
 }
 
-.input-placeholder {
-  @include input-placeholder("&") {
+#{elements-of-type(text-input)} {
+  @include input-placeholder {
     color: #bfbfbf;
     font-style: italic;
   }
 }
+
+.sets-up-browser-support-for-content {
+  @include input-placeholder {
+    prefix: $current-prefix;
+    -moz-prefix: $current-prefix == -moz;
+    -ms-prefix: $current-prefix == -ms;
+    -webkit-prefix: $current-prefix == -webkit;
+  }
+}

data/test/fixtures/stylesheets/compass/sass/utilities.scss

@@ -11,10 +11,10 @@
   @include pie-clearfix;
 }
 
-p.light { @include contrasted(#B0201E); }
-p.dark  { @include contrasted(#5F1210); }
-p.light-with-args { @include contrasted(#B0201E, green, blue); }
-p.dark-with-args  { @include contrasted(#5F1210, green, blue); }
+p.light { @include contrasted(#f3aead); }
+p.dark  { @include contrasted(#a22321); }
+p.light-with-args { @include contrasted(#f3aead, blue, yellow); }
+p.dark-with-args  { @include contrasted(#a22321, blue, yellow); }
 
 
 @include alternating-rows-and-columns(red, white, blue);

data/test/fixtures/stylesheets/envtest/css/env.css

@@ -1,10 +1,10 @@
 .env {
   env: <%= options[:environment] %>; }
 .time {
-  time: "<%= Time.now.strftime("%F") %>"; }
+  time: <%= Time.now.strftime("%F") %>; }
 .date {
-  date: "<%= Time.now.strftime("%F") %>"; }
+  date: <%= Time.now.strftime("%F") %>; }
 .filename {
-  file: <%= filename.gsub(%r{/scss/}, '/sass/') %>; }
+  file: env.scss; }
 .output {
-  output: <%= output_file %>; }
+  output: env.css; }

data/test/fixtures/stylesheets/envtest/tmp/env.css

@@ -2,13 +2,13 @@
   env: production; }
 
 .time {
-  time: "2013-04-03"; }
+  time: 2013-10-12; }
 
 .date {
-  date: "2013-04-03"; }
+  date: 2013-10-12; }
 
 .filename {
-  file: /Volumes/SSD/Work/compass/test/fixtures/stylesheets/envtest/sass/env.scss; }
+  file: env.scss; }
 
 .output {
-  output: /Volumes/SSD/Work/compass/test/fixtures/stylesheets/envtest/tmp/env.css; }
+  output: env.css; }

data/test/integrations/sprites_test.rb

@@ -45,7 +45,6 @@ class SpritesTest < Test::Unit::TestCase
   end
 
   def render(scss)
-    scss = %Q(@import "compass"; #{scss})
     options = Compass.sass_engine_options
     options[:line_comments] = false
     options[:style] = :expanded
@@ -931,6 +930,7 @@ class SpritesTest < Test::Unit::TestCase
 
   it "should replace text with images and dimensions using sprites" do
      css = render <<-SCSS
+     @import "compass/utilities/sprites/sprite-img";
      @import "colors/*.png";
      .blue { 
        @include sprite-replace-text($colors-sprites, blue); 
@@ -1082,4 +1082,33 @@ class SpritesTest < Test::Unit::TestCase
     assert_correct clean(css), clean(other_css)
   end
 
+  it "should render correct sprite with focus selector" do
+    css = render <<-SCSS
+      @import "focus/*.png";
+      @include all-focus-sprites;
+    SCSS
+    assert_correct css, <<-CSS
+      .focus-sprite, .focus-ten-by-ten {
+        background-image: url('/focus-sb5d1467be1.png');
+        background-repeat: no-repeat;
+      }
+      
+      .focus-ten-by-ten {
+        background-position: 0 0;
+      }
+      .focus-ten-by-ten:hover, .focus-ten-by-ten.ten-by-ten-hover {
+        background-position: 0 -30px;
+      }
+      .focus-ten-by-ten:target, .focus-ten-by-ten.ten-by-ten-target {
+        background-position: 0 -40px;
+      }
+      .focus-ten-by-ten:active, .focus-ten-by-ten.ten-by-ten-active {
+        background-position: 0 -10px;
+      }
+      .focus-ten-by-ten:focus, .focus-ten-by-ten.ten-by-ten-focus {
+        background-position: 0 -20px;
+      }
+    CSS
+  end
+
 end