archetype 0.0.1.pre.1 → 0.0.1.pre.3.00dfd9a

data/test/fixtures/stylesheets/archetype/expected/utilities/targeting/target-browser.css

@@ -0,0 +1,100 @@
+.target-ie-6 {
+  _vertical-align: -5px;
+  _background-position: 6px -2170px;
+  _overflow: hidden;
+}
+
+.target-ie-lte-7 {
+  *margin-top: 1px;
+  *padding: 0;
+  *width: 195px;
+  *font-size: 0.01em;
+  *height: 18px;
+}
+
+.ie.ie6 .target-ie-6-7, .ie.ie7 .target-ie-6-7 {
+  display: inline;
+}
+.ie.ie6 .target-ie-6-7, .ie.ie7 .target-ie-6-7 {
+  zoom: 1;
+}
+.ie.ie6 .target-ie-6-7, .ie.ie7 .target-ie-6-7 {
+  margin-left: 0;
+}
+
+.ie.ie7 .target-ie-7 {
+  vertical-align: -5px;
+}
+.ie.ie7 .target-ie-7 {
+  background-position: 6px -2170px;
+}
+.ie.ie7 .target-ie-7 {
+  overflow: hidden;
+}
+
+.ie.ie7 .target-ie-7-8, .ie.ie8 .target-ie-7-8 {
+  min-height: 250px !important;
+  height: auto !important;
+  height: 250px !important;
+}
+
+.ie.lte8 .target-ie-lte-8 {
+  filter: BasicImage(rotation=3);
+}
+.ie.lte8 .target-ie-lte-8 {
+  padding-bottom: 8px;
+}
+.ie.lte8 .target-ie-lte-8 {
+  line-height: 1.6;
+}
+
+.ie.ie8 .target-ie-8 {
+  margin-top: 2px;
+}
+.ie.ie8 .target-ie-8 {
+  min-height: 170px;
+  height: auto !important;
+  height: 170px;
+}
+
+.ie.lte9 .target-ie-lte-9 {
+  border-color: #111111;
+}
+.ie.lte9 .target-ie-lte-9 {
+  background: #2c2c2b;
+}
+
+.ie.ie7 .target-ie-7-8-9, .ie.ie8 .target-ie-7-8-9 {
+  width: 250px;
+}
+
+.ie .target-ie-9 {
+  right: -83px;
+}
+.ie .target-ie-9 {
+  top: 17px;
+}
+
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+  .target-webkit {
+    line-height: 16px;
+  }
+}
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+  .target-webkit {
+    padding-top: 10px;
+  }
+}
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+  .target-webkit {
+    width: 151px;
+  }
+}
+
+.target-firefox, .target-firefox x:-moz-any-link {
+  margin-top: 16px;
+}
+
+.target-opera, .target-opera x:-o-prefocus {
+  width: 82%;
+}

data/test/fixtures/stylesheets/archetype/expected/utilities/targeting/target-os.css

@@ -0,0 +1,55 @@
+.os-linux .target-linux {
+  top: -3px;
+}
+.os-linux .target-linux {
+  width: 300px;
+}
+
+.os-mac .target-apple {
+  top: -3px;
+}
+.os-mac .target-apple {
+  width: 300px;
+}
+
+.os-mac .target-mac {
+  top: -3px;
+}
+.os-mac .target-mac {
+  width: 300px;
+}
+
+.os-mac .target-osx {
+  top: -3px;
+}
+.os-mac .target-osx {
+  width: 300px;
+}
+
+.os-win .target-windows {
+  top: -3px;
+}
+.os-win .target-windows {
+  width: 300px;
+}
+
+.os-win .target-win {
+  top: -3px;
+}
+.os-win .target-win {
+  width: 300px;
+}
+
+.os-win .target-winxp {
+  top: -3px;
+}
+.os-win .target-winxp {
+  width: 300px;
+}
+
+.os-win .target-win7 {
+  top: -3px;
+}
+.os-win .target-win7 {
+  width: 300px;
+}

data/test/fixtures/stylesheets/archetype/source/b.scss

@@ -0,0 +1,9 @@
+@import "archetype";
+
+a {
+  @include styleguide(headline);
+}
+
+b {
+  @include styleguide(muted xxlarge headline in a punchcut);
+}

data/test/fixtures/stylesheets/archetype/source/base.scss

@@ -0,0 +1,3 @@
+@import "archetype";
+
+@include generate-loader-keyframes();

data/test/fixtures/stylesheets/archetype/source/hacks/ie_pseudo.scss

@@ -0,0 +1,13 @@
+@import "archetype";
+
+.before {
+  @include ie-pseudo-before('color: red; background: green;');
+}
+
+.after-content {
+  @include ie-pseudo-after($content: "\27BD");
+}
+
+.before-style-content {
+  @include ie-pseudo-before($styles: 'color: red; background: green;', $content: "testing \27BD if this works");
+}

data/test/fixtures/stylesheets/archetype/source/locale.scss

@@ -0,0 +1,43 @@
+@import "archetype";
+
+// test for a simple locale
+.en_US {
+  @if(locale(en_US)) {
+    content: "en_US";
+  }
+}
+
+// test for a wildcard territory
+.en_wild {
+  @if(locale(en_)) {
+    content: "en_*";
+  }
+}
+
+// test for a wildcard language
+.wild_US {
+  @if(locale(_US)) {
+    content: "*_US";
+  }
+}
+
+// multiple locales, one valid
+.one {
+  @if(locale(de_DE fr_FR pt_ en_US)) {
+    content: "one of de_DE fr_FR pt_ en_US";
+  }
+}
+
+// multiple locales, none valid
+.not {
+  @if(not locale(ja_JP pt_BR _GB de_)) {
+    content: "not one of ja_JP pt_BR _GB de_";
+  }
+}
+
+// test that the lang() alias works
+.lang {
+  @if(lang(en_US)) {
+    content: "en_US";
+  }
+}

data/test/fixtures/stylesheets/archetype/source/styleguide/buttons.scss

@@ -0,0 +1,18 @@
+@import "archetype"; 
+
+@each $context in container, bristol, punchcut {
+  .#{$context} {
+    @each $size in large, medium, small {
+      @each $type in primary, secondary, spotlight {
+        // normal buttons
+        .button.#{$size}.#{$type} {
+          @include styleguide($size $type button in a $context);
+        }
+      }
+    }
+  }
+}
+
+.test-exclude {
+  @include styleguide(small secondary button in a container, $exclude: width height border-radius padding font-size line-height cursor);
+}

data/test/fixtures/stylesheets/archetype/source/styleguide/fallback_styles.scss

@@ -0,0 +1,22 @@
+// this case verifies that you can define `fallback` css properties
+
+@import "archetype"; 
+
+@if not styleguide-component-exists(fallback-styleguide-test, $CONFIG_THEME) {
+$a-blackhole: styleguide-add-component(fallback-styleguide-test, (), (
+  (default, (
+    background      (transparent url(/some/img.png) repeat),
+    background      rbga(255, 0, 0, 0.9),
+    white-space     pre-wrap,
+    white-space     -moz-pre-wrap,
+    white-space     -pre-wrap,
+    white-space     -o-pre-wrap,
+    something       invalid,
+    something       valid
+  )),
+  nil
+), $CONFIG_THEME);
+}
+.fallback-styleguide-test {
+  @include styleguide(fallback-styleguide-test);
+}

data/test/fixtures/stylesheets/archetype/source/styleguide/nested_styleguides.scss

@@ -0,0 +1,40 @@
+// this case will test a couple of things, including
+// - nested `styleguide` calls
+// - nested selectors
+// - nested `styleguide` calls in nested selectors
+
+@import "archetype"; 
+
+@if not styleguide-component-exists(nested-styleguide-test, $CONFIG_THEME) {
+$a-blackhole: styleguide-add-component(nested-styleguide-test, (), (
+  (default, (
+    display         block,
+    color           red,
+    styleguide      (muted link without an underline),
+    background      green,
+    (states, (
+      (hover, (
+        styleguide  module,
+        nil
+      )),
+      nil
+    )),
+    (selectors, (
+      ('h3', (
+        styleguide  (large headline),
+        styleguide  (link without an underline),
+        nil
+      )),
+      ('&:after', (
+        color       red,
+        nil
+      ))
+    )),
+    nil
+  )),
+  nil
+), $CONFIG_THEME);
+}
+.nested-styleguide-test {
+  @include styleguide(nested-styleguide-test);
+}

data/test/fixtures/stylesheets/archetype/source/styleguide/selective_state.scss

@@ -0,0 +1,22 @@
+@import "archetype"; 
+
+.simple-button {
+  &.disabled {
+    @include styleguide(small primary button, $state: disabled);
+  }
+  &.my-custom-hover {
+    @include styleguide(small primary button, $state: hover);
+  }
+  &.normal {
+    @include styleguide(small primary button, $state: false);
+  }
+}
+
+.anchor {
+  &.missing {
+    @include styleguide(link, $state: missing);
+  }
+  &.my-custom-hover {
+    @include styleguide(link, $state: hover);
+  }
+}

data/test/fixtures/stylesheets/archetype/source/ui/glyph_icon.scss

@@ -0,0 +1,13 @@
+@import "archetype";
+
+.simple {
+  @include glyph-icon(caret-down);
+}
+
+.false {
+  @include glyph-icon(false, $placement: inline);
+}
+
+.size {
+  @include glyph-icon(caret-down, $size: 20px);
+}

data/test/fixtures/stylesheets/archetype/source/ui/hide_element.scss

@@ -0,0 +1,5 @@
+@import "archetype";
+
+.hide-element {
+  @include hide-element();
+}

data/test/fixtures/stylesheets/archetype/source/ui/stroke.scss

@@ -0,0 +1,13 @@
+@import "archetype";
+
+.stroke {
+  @include glyph-stroke();
+}
+
+.stroke-fat {
+  @include glyph-stroke(10px);
+}
+
+.stroke-colorful {
+  @include glyph-stroke(10px, red);
+}

data/test/fixtures/stylesheets/archetype/source/ui/triangle.scss

@@ -0,0 +1,13 @@
+@import "archetype";
+
+.a {
+  @include triangle();
+}
+
+.b {
+  @include triangle(top, 10px, 5px, black);
+}
+
+.c {
+  @include triangle(left top, 10px, 5px, black);
+}

data/test/fixtures/stylesheets/archetype/source/utilities/associative.scss

@@ -0,0 +1,24 @@
+@import "archetype";
+
+$test: (
+  (one, (
+    '1',
+    '2',
+    '3'
+  )),
+  (two, (
+    '4',
+    '5',
+    '6'
+  ))
+);
+
+.test {
+  a: nth(associative($test, one), 1);     // 1
+  b: nth(associative($test, one), 2);     // 2
+  c: nth(associative($test, two), 2);     // 5
+  d: nth(associative($test, two), 3);     // 6
+  e: nth(associative($test, 'two'), 2);   // 5
+  f: nth(associative($test, 'two'), 3);   // 6
+  g: nth(associative($test, three), 1);   // 1
+}

data/test/fixtures/stylesheets/archetype/source/utilities/if-set.scss

@@ -0,0 +1,16 @@
+@import "archetype";
+
+a {
+  @include if-set(margin, 5px);
+  @include if-set(border, 1px solid #ccc);
+}
+
+b {
+  @include if-set(margin, 5px, $ignore: (10px 20px));
+  @include if-set(border, 1px solid #ccc, $ignore: (1px solid #ddd, 1px solid #eee));
+}
+
+c {
+  @include if-set(margin, 5px, $ignore: (5px 10px 20px));
+  @include if-set(border, 1px solid #ccc, $ignore: (1px solid #ccc, 1px solid #ddd, 1px solid #eee));
+}

data/test/fixtures/stylesheets/archetype/source/utilities/spacing/horizontal-spacing.scss

@@ -0,0 +1,27 @@
+@import "archetype";
+
+a {
+  @include horizontal-spacing(4);
+  @include horizontal-spacing(4, $method: margin);
+}
+
+b {
+  @include horizontal-spacing(nil 4);
+  @include horizontal-spacing(nil 4, $method: margin);
+}
+
+c {
+  @include horizontal-spacing(4 nil);
+  @include horizontal-spacing(4 nil, $method: margin);
+}
+
+d {
+  @include horizontal-spacing(nil 2.6);
+  @include horizontal-spacing(nil 2.6, $abuse: true);
+  @include horizontal-spacing(nil 2.6, $abuse: true, $method: margin);
+}
+
+e {
+  @include horizontal-spacing($left: 0, $right: 0);
+  @include horizontal-spacing($left: 0, $right: 0, $method: margin);
+}