compass 0.12.4 → 1.0.0

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

@@ -0,0 +1,11 @@
+$flag_states-sprite-dimensions: true;
+$flag_states-class-separator: "_";
+
+@import "flag_states/*.png";
+
+@include all-flag_states-sprites;
+
+.sprite-file {
+  location: image-url(sprite_file($flag-states-sprites, foo));
+}
+

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

@@ -0,0 +1,174 @@
+@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 !global;
+  @content;
+  $supported-browsers: $old-browsers !global;
+}
+
+@mixin with-declared-minimums($supported-browsers) {
+    $old-mins: $browser-minimum-versions;
+    $browser-minimum-versions: $supported-browsers !global;
+    @content;
+    $browser-minimum-versions: $old-mins !global;
+}
+
+@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', $threshold: 0.00000001),
+                         "should be supported because of user support threshold.");
+    @include assert-false(support-legacy-browser('ie', '6', $threshold: 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', $threshold: 10.00),
+      "should be supported because of minimum version.");
+      @include assert-false(support-legacy-browser('ie', '6', $threshold: 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('prefix context tracking') {
+    $outer-prefix-invoked: false;
+    $inner-prefix-invoked: false;
+    $mismatched-prefix-invoked: false;
+    @include with-prefix(-webkit) {
+      $outer-prefix-invoked: true;
+      @include assert-equal(-webkit, $current-prefix, "should be equal.");
+      @include assert-equal(-webkit, $prefix-context, "should be equal.");
+      @include with-prefix(null) {
+        $inner-prefix-invoked: true;
+        @include assert-equal(null, $current-prefix, "should be equal.");
+        @include assert-equal(-webkit, $prefix-context, "should be equal.");
+      }
+      @include with-prefix(-ms) {
+        $mismatched-prefix-invoked: true;
+      }
+    }
+    @include assert-true($inner-prefix-invoked, "should have been invoked");
+    @include assert-true($outer-prefix-invoked, "should have been invoked");
+    @include assert-false($mismatched-prefix-invoked, "should not have been invoked");
+    @include assert-equal(null, $prefix-context, "should be null");
+    @include assert-equal(null, $current-prefix, "should be null");
+  }
+
+  @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-ranges((ie: '8' '8')) {
+      @include assert-false(not browser-out-of-scope('ie', '10'), "should not 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') {
+    $contexts: ();
+    $prefixes: ();
+    @include with-prefix(-webkit) {
+      $prefixes: append($prefixes, $current-prefix);
+      $contexts: append($contexts, $prefix-context);
+      @include with-each-prefix(css-regions, 0.0001) {
+        $prefixes: append($prefixes, $current-prefix);
+        $contexts: append($contexts, $prefix-context);
+      }
+    }
+    @include assert-true(index($prefixes, null), "Must have a null");
+    @include assert-equal((-webkit -webkit null), $prefixes, "Not equal");
+    @include assert-equal((-webkit -webkit -webkit), $contexts, "Not equal");
+  }
+
+  @include test('[fuction] has-browser-subset()') {
+    @include assert-true(has-browser-subset((firefox: "16" "25"), (firefox: "2" "25")), "Should detect version overlap");
+    @include assert-true(not has-browser-subset((firefox: "16" "25"), (firefox: "2" "15")), "Should not detect version overlap");
+    @include assert-true(not has-browser-subset((firefox: "2" "15"), (firefox: "16" "25")), "Should not detect version overlap");
+    @include assert-true(has-browser-subset((firefox: "16" "24"), (firefox: "2" "25")), "Should detect version overlap");
+    @include assert-true(has-browser-subset((firefox: "2" "25"), (firefox: "16" "24")), "Should detect version overlap");
+  }
+}
+
+@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/text_shadow.scss

@@ -1,11 +1,12 @@
+$default-text-shadow-color: #aaaaaa;
 @import "compass/css3/text-shadow";
 
 .default-single-text-shadow { @include single-text-shadow;}
 .none { @include single-text-shadow(none);}
-.color-only { @include single-text-shadow(#ccc);}
-.color-first-with-params { @include single-text-shadow(#ccc, 2px, 2px, 5px, 2px);}
-.color-last-with-params { @include single-text-shadow(2px, 2px, 5px, 2px, #ccc);}
+.color-only { @include single-text-shadow(#cccccc);}
+.color-first-with-params { @include single-text-shadow(#cccccc, 2px, 2px, 5px, 2px);}
+.color-last-with-params { @include single-text-shadow(2px, 2px, 5px, 2px, #cccccc);}
 .default-text-shadow { @include text-shadow;}
-.multiple-text-shadows-with-default { @include text-shadow(default, 2px 2px 5px #222);}
-.multiple-text-shadows { @include text-shadow(4px 4px 10px #444, 2px 2px 5px #222);}
-.multiple-text-shadows-with-spread { @include text-shadow(4px 4px 10px 1px #444, 2px 2px 5px 3px #222);}
+.multiple-text-shadows-with-default { @include text-shadow(default, 2px 2px 5px #222222);}
+.multiple-text-shadows { @include text-shadow(4px 4px 10px #444444, 2px 2px 5px #222222);}
+.multiple-text-shadows-with-spread { @include text-shadow(4px 4px 10px 1px #444444, 2px 2px 5px 3px #222222);}

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); }
@@ -12,13 +11,11 @@
 .transition-property { @include transition-property(transform); }
 .transition-properties { @include transition-property(transform, opacity, width, height, left, top); }
 .multiple-transition-properties { @include transition-property((opacity, transform, left)); }
+.default-transition { @include transition(); }
 .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/units.scss

@@ -0,0 +1,50 @@
+$base-font-size: 16px;
+
+@import "compass/typography/units";
+
+.foo {
+	width: 600px;
+	height: 200px;
+}
+
+.foo .test {
+	/* 16px for margins should be 1em */
+	margin-top: convert-length(16px, em);
+
+	/* 16px for margins should be 2.66667% (relative to parent's width) */
+	margin-right: convert-length(16px, '%', $to-context: 600px);
+
+	/* 1.35em for margins should be 3.6% (relative to parent's width,
+	 * even for top and bottom margins) */
+	margin-bottom: convert-length(1.35em, '%', $to-context: 600px);
+
+	/* 16px for margins should be 2ex */
+	margin-left: convert-length(16px, ex);
+}
+
+.bar {
+	font-size: 18px;
+	width: 360px;
+}
+
+.bar .test {
+	/* 150% for line-height should be 27px */
+	line-height: convert-length(150%, px, 18px);
+
+	/* 1px should always be .0625rem for this page */
+	border-top: convert-length(1px, rem);
+
+	/* 2em for this element should be 9.525mm (relative to own font-size, as inherited) */
+	margin-top: convert-length(2em, mm, 18px);
+
+	/* 2px for margins should be .55556% (relative to parent's width) */
+	margin-right: convert-length(2px, '%', $to-context: 360px);
+
+	/* 1rem should always be 16px for this page, even when own font-size is 18px */
+	margin-bottom: convert-length(1rem, px);
+}
+
+.rem {
+	$val: 25rem, 100% 32px;
+	@include rem(background-size, $val, true);
+}

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

@@ -2,4 +2,27 @@
 
 .user-select {
   @include user-select(none);
-}
+}
+
+* {
+  @include input-placeholder {
+    color: #bfbfbf;
+    font-style: italic;
+  }
+}
+
+#{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

@@ -1,3 +1,6 @@
+$contrasted-dark-default: black;
+$contrasted-light-default: white;
+
 @import "compass/utilities";
 
 .clearfix {
@@ -11,10 +14,20 @@
   @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);
+
+p.ellipsis {
+  @include ellipsis;
+}
+
+p.ellipsis.moz {
+  $legacy-support-for-mozilla: true !global;
+  $use-mozilla-ellipsis-binding: true !global;
+  @include ellipsis;
+}

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

@@ -1,16 +1,60 @@
-@import "compass/typography/vertical_rhythm";
+// Test all functions and mixins, at least indirectly.
+// functions:
+// * rhythm
+// * lines-for-font-size
+//
+// mixins:
+// * establish-baseline
+// * output-rhythm
+// * debug-vertical-alignment
+// * adjust-font-size-to
+// * adjust-leading-to
+// * leader
+// * margin-leader
+// * padding-leader
+// * trailer
+// * margin-trailer
+// * padding-trailer
+// * rhythm
+// * rhythm-margins
+// * rhythm-padding
+// * apply-side-rhythm-border
+// * leading-border
+// * trailing-border
+// * rhythm-borders
+// * horizontal-borders (h-borders)
+//
+// deprecated mixins:
+// * reset-baseline
 
 $base-font-size: 14px;
 $base-line-height: 16px;
+@import "compass/typography/vertical_rhythm";
 
 @include establish-baseline;
 
-.small { @include adjust-font-size-to(12px,1); }
+.small {
+	@include adjust-font-size-to(12px, 1);
+}
+
+.padded {
+	@include rhythm(1, 1, 1, 1);
+}
+
+.small-padded {
+	@include adjust-font-size-to(12px, 1);
+	@include rhythm(1, 1, 1, 1, 12px);
+}
 
-.padded { @include rhythm(1,1,1,1); }
-.small-padded { @include adjust-font-size-to(12px,1); @include rhythm(1,1,1,1,12px); }
+.borders {
+	@include h-borders(1px, 1);
+}
 
-.borders { @include h-borders(1px,1); }
-.large-borders { @include adjust-font-size-to(24px,3); @include h-borders(6px,1,24px); }
+.large-borders {
+	@include adjust-font-size-to(24px, 3);
+	@include h-borders(6px, 1, 24px);
+}
 
-.reset { @include reset-baseline; }
+.reset {
+	@include reset-baseline;
+}

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

@@ -0,0 +1,52 @@
+/* New test using em output */
+$base-font-size: 18px;
+$base-line-height: $base-font-size * 1.4;
+$rhythm-unit: em;
+$default-rhythm-border-style: solid #aaaaaa;
+
+@import "compass/typography/vertical_rhythm";
+
+@include establish-baseline;
+
+.container {
+	@include debug-vertical-alignment;
+}
+
+p {
+	@include margin-leader;
+	@include margin-trailer;
+}
+
+th,
+td {
+	@include rhythm-padding(.25);
+}
+
+// Incremental leading made easy!
+.caption {
+	@include adjust-font-size-to(13px, 4/5);
+}
+
+.spaced-out {
+	@include adjust-leading-to(1.5);
+}
+
+blockquote {
+	@include rhythm-margins;
+	padding: 0 rhythm();
+}
+
+.fig-quote {
+	> blockquote {
+		@include trailer(.5);
+	}
+	.source {
+		@include adjust-font-size-to(13px, auto);
+		@include trailer(.5, 13px);
+	}
+}
+
+.panel {
+	@include adjust-font-size-to(16px);
+	@include rhythm-borders($font-size: 16px);
+}