archetype 0.0.1.pre.7 → 0.0.1.pre.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (50) hide show
  1. checksums.yaml +4 -4
  2. data/lib/archetype/sass_extensions/functions/lists.rb +2 -2
  3. data/lib/archetype/version.rb +1 -1
  4. data/stylesheets/archetype/_base.scss +7 -2
  5. data/stylesheets/archetype/_config.scss +9 -1
  6. data/stylesheets/archetype/_hacks.scss +51 -17
  7. data/stylesheets/archetype/_ui.scss +16 -5
  8. data/stylesheets/archetype/base/_h5bp.scss +12 -12
  9. data/stylesheets/archetype/base/_normalize.scss +178 -139
  10. data/stylesheets/archetype/grid/_grid.scss +13 -13
  11. data/stylesheets/archetype/styleguide/components/_buttons.scss +1 -0
  12. data/stylesheets/archetype/util/_debug.scss +4 -4
  13. data/stylesheets/archetype/util/_lists.scss +1 -1
  14. data/stylesheets/archetype/util/_misc.scss +1 -1
  15. data/stylesheets/archetype/util/_rtl.scss +1 -1
  16. data/stylesheets/archetype/util/_spacing.scss +6 -6
  17. data/stylesheets/archetype/util/_styles.scss +44 -113
  18. data/stylesheets/archetype/util/_targeting.scss +4 -5
  19. data/test/fixtures/stylesheets/archetype/assets/images/vendor/archetype/animations/loaders-s7889ccc8c1.png +0 -0
  20. data/test/fixtures/stylesheets/archetype/{expected → saved}/b.css +0 -0
  21. data/test/fixtures/stylesheets/archetype/{expected → saved}/base.css +0 -0
  22. data/test/fixtures/stylesheets/archetype/saved/hacks/ie_pseudo.css +11 -0
  23. data/test/fixtures/stylesheets/archetype/{expected → saved}/hacks/transparent_focusable.css +0 -0
  24. data/test/fixtures/stylesheets/archetype/{expected → saved}/locale.css +0 -0
  25. data/test/fixtures/stylesheets/archetype/source/utilities/custom_output_styler.scss +3 -2
  26. metadata +21 -68
  27. data/test/fixtures/stylesheets/archetype/expected/hacks/ie_pseudo.css +0 -11
  28. data/test/fixtures/stylesheets/archetype/expected/styleguide/alerts.css +0 -675
  29. data/test/fixtures/stylesheets/archetype/expected/styleguide/buttons.css +0 -2119
  30. data/test/fixtures/stylesheets/archetype/expected/styleguide/drop.css +0 -63
  31. data/test/fixtures/stylesheets/archetype/expected/styleguide/extend.css +0 -7
  32. data/test/fixtures/stylesheets/archetype/expected/styleguide/fallback_styles.css +0 -9
  33. data/test/fixtures/stylesheets/archetype/expected/styleguide/invalid_structures.css +0 -21
  34. data/test/fixtures/stylesheets/archetype/expected/styleguide/multi_value.css +0 -13
  35. data/test/fixtures/stylesheets/archetype/expected/styleguide/nested_styleguides.css +0 -24
  36. data/test/fixtures/stylesheets/archetype/expected/styleguide/selective_state.css +0 -177
  37. data/test/fixtures/stylesheets/archetype/expected/ui/glyph_icon.css +0 -127
  38. data/test/fixtures/stylesheets/archetype/expected/ui/hide_element.css +0 -8
  39. data/test/fixtures/stylesheets/archetype/expected/ui/stroke.css +0 -17
  40. data/test/fixtures/stylesheets/archetype/expected/ui/triangle.css +0 -35
  41. data/test/fixtures/stylesheets/archetype/expected/utilities/associative.css +0 -9
  42. data/test/fixtures/stylesheets/archetype/expected/utilities/custom_output_styler.css +0 -8
  43. data/test/fixtures/stylesheets/archetype/expected/utilities/if-set.css +0 -9
  44. data/test/fixtures/stylesheets/archetype/expected/utilities/spacing/horizontal-spacing.css +0 -29
  45. data/test/fixtures/stylesheets/archetype/expected/utilities/spacing/vertical-spacing.css +0 -29
  46. data/test/fixtures/stylesheets/archetype/expected/utilities/styles/filter.css +0 -11
  47. data/test/fixtures/stylesheets/archetype/expected/utilities/styles/font-family.css +0 -16
  48. data/test/fixtures/stylesheets/archetype/expected/utilities/styles/z-index.css +0 -15
  49. data/test/fixtures/stylesheets/archetype/expected/utilities/targeting/target-browser.css +0 -105
  50. data/test/fixtures/stylesheets/archetype/expected/utilities/targeting/target-os.css +0 -55
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 6f08279f44e3154afac0274b6b5a94cbf2667aeb
4
- data.tar.gz: da151fc44aa547ae992e8ade40c1930f7bf77ad2
3
+ metadata.gz: 5ee8690f0ce6a0b20c38eb1e251bb706b42705d7
4
+ data.tar.gz: c43813c4246c382f670386497fa6b80242e8f5c3
5
5
  SHA512:
6
- metadata.gz: 31d1279dd369535f3030a9cfa7933adc6447f70a8a26e7c4b567c21feca8940394b642d0596ed3bd8a23d93bc568104780ed894d06eb53ace97c0915993c75fb
7
- data.tar.gz: 7145b040ab336bdf696b55fbbe1519730c93ce5c48828d35b5f5ccb03ee79a7f7bbdd67052ac0a8efa87b31591a190f7a07de2b9b464c87b9daf9b39994d48f9
6
+ metadata.gz: e9c4f11a69ce86beefb31c45edaba65fa73529c59bef306909c59316fea961b8535ee6a8612b6493f64b987f6c90b6ac02a78aa9555620ebe57077d6d8f16ff5
7
+ data.tar.gz: d083db3901d570e5687ac05f3bca2fa72bc70b3ee3ec174242d84691169263722e782699c7cee469220b601264619f56c8d058f6759eac7d0f64139adf184a8b
@@ -144,7 +144,7 @@ module Archetype::SassExtensions::Lists
144
144
  # - <tt>$haystack</tt> {List} input list
145
145
  # - <tt>$needle</tt> {List} the value(s) to search for
146
146
  # *Returns*:
147
- # - {Number|Bool} if an item is found, returns the index, otherwise returns false
147
+ # - {Number|Boolean} if an item is found, returns the index, otherwise returns false
148
148
  #
149
149
  def index2(haystack, needle)
150
150
  haystack = haystack.to_a
@@ -178,7 +178,7 @@ module Archetype::SassExtensions::Lists
178
178
  # *Parameters*:
179
179
  # - <tt>$list</tt> {List} the list to search in
180
180
  # - <tt>$key</tt> {String} the key identifier (name)
181
- # - <tt>$strict</tt> {Bool} if true, does a strict match against the key
181
+ # - <tt>$strict</tt> {Boolean} if true, does a strict match against the key
182
182
  # *Returns*:
183
183
  # - {*} the data associated with $key
184
184
  #
@@ -1,3 +1,3 @@
1
1
  module Archetype
2
- VERSION = '0.0.1.pre.7'
2
+ VERSION = '0.0.1.pre.8'
3
3
  end
@@ -2,6 +2,7 @@
2
2
  @import "base/normalize";
3
3
  @import "base/reset";
4
4
  @import "base/hybrid";
5
+ @import "base/h5bp";
5
6
 
6
7
  // protect against multiple resets
7
8
  $RESET_INIT: false !default;
@@ -11,8 +12,8 @@ $RESET_INIT: false !default;
11
12
  // sets the base styles for the page (e.g. reset or normalize)
12
13
  // @mixin base
13
14
  // @param $exclude {List} the list of styles to exclude @see _normalize.scss and _reset.scss
14
- // @param $method {String} reset method [reset|normalize|hybrid]
15
- // @param $force {Bool} force reset to invoke; by default base() can only be invoked once, to re-invoke must pass in $force: true
15
+ // @param $method {String} reset method [reset|normalize|h5bp|hybrid]
16
+ // @param $force {Boolean} force reset to invoke; by default base() can only be invoked once, to re-invoke must pass in $force: true
16
17
  @mixin base($exclude: $CONFIG_RESET_EXCLUDES, $method: $CONFIG_RESET_METHOD, $force: false) {
17
18
  @if not $RESET_INIT or $force {
18
19
  $RESET_INIT: true;
@@ -20,6 +21,10 @@ $RESET_INIT: false !default;
20
21
  @if $method == normalize {
21
22
  @include base-normalize($exclude: $exclude);
22
23
  }
24
+ // html5 boiler plate
25
+ @else if $method == h5bp {
26
+ @include base-h5bp($exclude: $exclude);
27
+ }
23
28
  // hyrbid reset (reset + some normalize)
24
29
  @else if $method == hybrid {
25
30
  @include base-hybrid($exclude: $exclude);
@@ -40,6 +40,7 @@ $CONTENT_PLACEHOLDER: '\0020' !default;
40
40
  $CONFIG_DISABLED_CSS: () !default; // a list of CSS3 features to always disable when using output-style()
41
41
  $CONFIG_GENERATED_TAG_PREFIX: x-archetype !default; // the prefix for the tag name to create when using ie-pseudo method
42
42
  $CONFIG_GENERATED_TAG_CSS: false !default; // styles to apply to the generated tag when using ie-pseudo method (use this as a way to reset styles on these tags)
43
+ $CONFIG_GENERATED_TAG_INLINE: true !default; // if `true` insert the styles inline on the generated tag, otherwise insert the styles in a unique css rule
43
44
 
44
45
  // z-layers
45
46
  $CONFIG_Z_INDEX_BASE: 0 !default; // the default starting layer for z-index calculations
@@ -58,8 +59,9 @@ $CONFIG_KEYFRAME_LOADERS: archetype-loader !default;
58
59
 
59
60
  // glyphs
60
61
  $CONFIG_GLYPHS_NAME: FontAwesome !default; // name for the font-face
62
+ $CONFIG_GLYPHS_VERSION: '0.0.1' !default; // the glyph library version number
61
63
  $CONFIG_GLYPHS_SVG_ID: $CONFIG_GLYPHS_NAME !default;
62
- $CONFIG_GLYPHS_BASE_PATH: 'vendor/archetype/fontawesome-webfont' !default; // generic path to all glpyh fonts (sans extensions)
64
+ $CONFIG_GLYPHS_BASE_PATH: 'vendor/archetype/fontawesome-webfont' !default; // generic path to all glyph fonts (sans extensions)
63
65
  $CONFIG_GLYPHS_EOT: '#{$CONFIG_GLYPHS_BASE_PATH}.eot' !default;
64
66
  $CONFIG_GLYPHS_FILES: font-files('#{$CONFIG_GLYPHS_BASE_PATH}.woff', '#{$CONFIG_GLYPHS_BASE_PATH}.ttf', '#{$CONFIG_GLYPHS_BASE_PATH}.svg##{$CONFIG_GLYPHS_SVG_ID}') !default;
65
67
  $CONFIG_GLYPHS_WEIGHT: normal !default; // font-weight for glyphs
@@ -379,3 +381,9 @@ $CORE_SAFE_FONTS: (
379
381
  ); // note that this declaration isn't a `default`, but rather is enforced everytime. this can be modified (via extending $CONFIG_SAFE_FONTS)
380
382
  $CONFIG_SAFE_FONTS: () !default;
381
383
  $CONFIG_SAFE_FONTS: associative-merge($CORE_SAFE_FONTS, $CONFIG_SAFE_FONTS);
384
+
385
+ $archetype-glyph-selector: false !default;
386
+ $archetype-pseudo-selector: false !default;
387
+
388
+ $CORE_GLYPH_SELECTOR_VAR: '$archetype-glyph-selector';
389
+ $CORE_GLYPH_SELECTOR_VAR: '$archetype-pseudo-selector';
@@ -34,33 +34,44 @@
34
34
  }
35
35
 
36
36
  // proxy for ie-pseudo
37
- // @mixin ie-pseudo-before
38
- // @param $styles {String} the styles to apply to the pseudo-element
39
- // @param $content {String} the content to insert into the element (similar to css `content` attribute)
40
- // @param $name {String} the name of the element
37
+ // @mixin ie-pseudo-before
38
+ // @param $styles {String} the styles to apply to the pseudo-element
39
+ // @param $content {String} the content to insert into the element (similar to css `content` attribute)
40
+ // @param $name {String} the name of the element
41
+ // @content
41
42
  @mixin ie-pseudo-before($styles: false, $content: false, $name: '') {
42
- @include ie-pseudo($styles, $content, before, $name);
43
+ @include ie-pseudo($styles, $content, before, $name) {
44
+ @content;
45
+ }
43
46
  }
44
47
 
45
48
  // proxy for ie-pseudo
46
- // @mixin ie-pseudo-after
47
- // @param $styles {String} the styles to apply to the pseudo-element
48
- // @param $content {String} the content to insert into the element (similar to css `content` attribute)
49
- // @param $name {String} the name of the element
49
+ // @mixin ie-pseudo-after
50
+ // @param $styles {String} the styles to apply to the pseudo-element
51
+ // @param $content {String} the content to insert into the element (similar to css `content` attribute)
52
+ // @param $name {String} the name of the element
53
+ // @content
50
54
  @mixin ie-pseudo-after($styles: false, $content: false, $name: '') {
51
- @include ie-pseudo($styles, $content, after, $name);
55
+ @include ie-pseudo($styles, $content, after, $name) {
56
+ @content;
57
+ }
52
58
  }
53
59
 
54
60
  // this creates a one-type executing expression that inserts an element relative to `this` element.
55
61
  // this allows some level of support for :before/:after in IE6/7
56
62
  // inspired by http://nicolasgallagher.com/better-float-containment-in-ie/
57
- // @mixin ie-pseudo
58
- // @param $styles {String} the styles to apply to the pseudo-element
59
- // @param $content {String} the content to insert into the element (similar to css `content` attribute)
60
- // @param $placement {String} [before|after] simulate :before or :after behavior
61
- // @param $name {String} the name of the element
62
- @mixin ie-pseudo($styles: false, $content: false, $placement: before, $name: '') {
63
+ // @mixin ie-pseudo
64
+ // @param $styles {String} the styles to apply to the pseudo-element
65
+ // @param $content {String} the content to insert into the element (similar to css `content` attribute)
66
+ // @param $placement {String} [before|after] simulate :before or :after behavior
67
+ // @param $name {String} the name of the element
68
+ // @param $uid {String} a custom, unique identifier for the generate element
69
+ // @content
70
+ @mixin ie-pseudo($styles: false, $content: false, $placement: before, $name: '', $uid: false) {
71
+ $archetype-pseudo-selector: false;
63
72
  @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
73
+ $uid: if($uid, $uid, unique('ie-pseudo-'));
74
+ $archetype-pseudo-selector: '& ##{$uid}';
64
75
  $this: 't';
65
76
  $cmd: (unquote('#{$this}.el=document.createElement("#{prefixed-tag($name)}")'));
66
77
  $method: if($placement == before, insertBefore, appendChild);
@@ -70,7 +81,7 @@
70
81
  @if $CONFIG_GENERATED_TAG_CSS {
71
82
  $styles: if($styles and $styles != nil, #{$CONFIG_GENERATED_TAG_CSS}#{$styles}, $CONFIG_GENERATED_TAG_CSS);
72
83
  }
73
- @if $styles and $styles != nil {
84
+ @if $styles and $styles != nil and $styles != '' and $CONFIG_GENERATED_TAG_INLINE {
74
85
  // sets the icon styles on the node
75
86
  $cmd: append($cmd, unquote('#{$this}.el.style.cssText="#{$styles}"'), comma);
76
87
  }
@@ -83,5 +94,28 @@
83
94
  // this prevents an edge case in IE crashing with an `Operation Aborted` if the node hasn't finished rendering yet
84
95
  // http://www.nczonline.net/blog/2008/03/17/the-dreaded-operation-aborted-error/
85
96
  *zoom: expression(#{$runOnce},(function(#{$this}){setTimeout(function(){#{$cmd}})}(this)));
97
+
98
+ // if we're NOT using inline styles...
99
+ @if not $CONFIG_GENERATED_TAG_INLINE {
100
+ // output it on the generated selector
101
+ #{$archetype-pseudo-selector} {
102
+ @include to-styles(-style-string-to-list(unquote($styles)));
103
+ @if archetype-version('Sass >= 3.2') {
104
+ @content;
105
+ }
106
+ }
107
+ }
86
108
  }
87
109
  }
110
+
111
+ // a hack that allows elements with transparent backgrounds to be focusable in IE
112
+ // @mixin transparent-focusable
113
+ // @param $url {String} an optional URL to point to an image (not required)
114
+ // @param $data {String} an optional data URI for a transparent image (not required)
115
+ @mixin transparent-focusable($url: url(https://), $data: 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7') {
116
+ $bg: (transparent);
117
+ background: append($bg, $data);
118
+ @if $url {
119
+ @include target-browser(ie lte 7, background, append($bg, $url));
120
+ }
121
+ }
@@ -117,9 +117,9 @@
117
117
  clip: rect(1px, 1px, 1px, 1px);
118
118
  }
119
119
 
120
- // revert hide element with config
120
+ // reverse hide-element and make the element visible again
121
121
  // @mixin unhide-element
122
- // @link http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
122
+ // @see hide-element
123
123
  // @param $position {String} value for the position property
124
124
  // @param $height {String} value for the height property
125
125
  // @param $width {String} value for the width property
@@ -168,8 +168,11 @@
168
168
  // @param $size {Number} the size of the icon
169
169
  // @param $color {Color} the color of the font
170
170
  // @param $placement {String} where to place the icon [before|after|inline]
171
- // @param $ie-styles {String} styles to apply to IE6/7 (this is needed because the faux :before isn't extensible)
172
- @mixin glyph-icon($icon, $size: default, $color: inherit, $placement: before, $ie-styles: false) {
171
+ // @param $ie-styles {String} styles to apply to IE6/7 (this is needed because the faux :before isn't extendable)
172
+ // @param $ie-uid {String} a custom, unique identifier for the generate IE6/7 element
173
+ // @content
174
+ @mixin glyph-icon($icon, $size: default, $color: inherit, $placement: before, $ie-styles: false, $ie-uid: false) {
175
+ $archetype-glyph-selector: false;
173
176
  $char-mapping: nil;
174
177
  $char-code: nil;
175
178
  @if $icon {
@@ -204,6 +207,7 @@
204
207
  content: $char-code;
205
208
  }
206
209
  }
210
+ $archetype-glyph-selector: $selector;
207
211
  @if($selector != '&' and $ie-styles != nil) {
208
212
  // support for IE6/7
209
213
  $styles: "font-family:'#{$CONFIG_GLYPHS_NAME}-#{$CONFIG_GLYPHS_VERSION}', '#{$CONFIG_GLYPHS_NAME}';font-weight:#{$CONFIG_GLYPHS_WEIGHT};font-style:#{$CONFIG_GLYPHS_STYLE};text-decoration:inherit;";
@@ -216,7 +220,14 @@
216
220
  @if($ie-styles) {
217
221
  $styles: $styles + $ie-styles;
218
222
  }
219
- @include ie-pseudo($styles: $styles, $content: $char-code, $placement: $placement, $name: glyph);
223
+
224
+ @include ie-pseudo($styles: $styles, $content: $char-code, $placement: $placement, $name: glyph, $uid: $ie-uid);
225
+ @if $archetype-pseudo-selector {
226
+ $archetype-glyph-selector: '#{$selector}, #{$archetype-pseudo-selector}';
227
+ }
228
+ }
229
+ #{$archetype-glyph-selector} {
230
+ @content;
220
231
  }
221
232
  }
222
233
  }
@@ -6,7 +6,7 @@
6
6
  /* ==========================================================================
7
7
  Base styles: opinionated defaults
8
8
  ========================================================================== */
9
-
9
+
10
10
  html,
11
11
  button,
12
12
  input,
@@ -14,32 +14,32 @@
14
14
  textarea {
15
15
  color: #222;
16
16
  }
17
-
17
+
18
18
  body {
19
19
  font-size: 1em;
20
20
  line-height: 1.4;
21
21
  }
22
-
22
+
23
23
  /*
24
24
  * Remove text-shadow in selection highlight: h5bp.com/i
25
25
  * These selection declarations have to be separate.
26
26
  * Customize the background color to match your design.
27
27
  */
28
-
28
+
29
29
  ::-moz-selection {
30
30
  background: #b3d4fc;
31
31
  text-shadow: none;
32
32
  }
33
-
33
+
34
34
  ::selection {
35
35
  background: #b3d4fc;
36
36
  text-shadow: none;
37
37
  }
38
-
38
+
39
39
  /*
40
40
  * A better looking default horizontal rule
41
41
  */
42
-
42
+
43
43
  hr {
44
44
  display: block;
45
45
  height: 1px;
@@ -54,7 +54,7 @@
54
54
  /*
55
55
  * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
56
56
  */
57
-
57
+
58
58
  img {
59
59
  vertical-align: middle;
60
60
  }
@@ -77,7 +77,7 @@
77
77
  /*
78
78
  * Allow only vertical resizing of textareas.
79
79
  */
80
-
80
+
81
81
  textarea {
82
82
  resize: vertical;
83
83
  }
@@ -87,7 +87,7 @@
87
87
  /* ==========================================================================
88
88
  Chrome Frame prompt
89
89
  ========================================================================== */
90
-
90
+
91
91
  .chromeframe {
92
92
  margin: 0.2em 0;
93
93
  background: #ccc;
@@ -117,7 +117,7 @@
117
117
  content: "";
118
118
  display: block;
119
119
  width: 0;
120
- height: 100%;
120
+ height: 150%;
121
121
  }
122
122
 
123
123
  /*
@@ -277,7 +277,7 @@
277
277
  // @param $exclude {List} the list of features to exclude from the reset
278
278
  // @link https://github.com/h5bp/html5-boilerplate/
279
279
  @mixin base-h5bp($exclude: ()) {
280
- /*! HTML5 Boilerplate | MIT License | @b378ce239d */
280
+ /*! HTML5 Boilerplate | MIT License | @9ec546569b */
281
281
  /*
282
282
  * HTML5 Boilerplate
283
283
  *
@@ -1,4 +1,4 @@
1
- // normalize.css v2.0.1 | MIT License | git.io/normalize
1
+ // normalize.css v2.1.2 | MIT License | git.io/normalize
2
2
 
3
3
  // @category base
4
4
  @mixin base-normalize-html5() {
@@ -6,9 +6,9 @@
6
6
  HTML5 display definitions
7
7
  ========================================================================== */
8
8
 
9
- /*
10
- * Corrects `block` display not defined in IE 8/9.
11
- */
9
+ /**
10
+ * Corrects `block` display not defined in IE 8/9.
11
+ */
12
12
 
13
13
  article,
14
14
  aside,
@@ -18,15 +18,16 @@
18
18
  footer,
19
19
  header,
20
20
  hgroup,
21
+ main,
21
22
  nav,
22
23
  section,
23
24
  summary {
24
25
  display: block;
25
26
  }
26
27
 
27
- /*
28
- * Corrects `inline-block` display not defined in IE 8/9.
29
- */
28
+ /**
29
+ * Corrects `inline-block` display not defined in IE 8/9.
30
+ */
30
31
 
31
32
  audio,
32
33
  canvas,
@@ -34,41 +35,43 @@
34
35
  @include inline-block();
35
36
  }
36
37
 
37
- /*
38
- * Prevents modern browsers from displaying `audio` without controls.
39
- * Remove excess height in iOS 5 devices.
40
- */
38
+ /**
39
+ * Prevents modern browsers from displaying `audio` without controls.
40
+ * Remove excess height in iOS 5 devices.
41
+ */
41
42
 
42
43
  audio:not([controls]) {
43
44
  display: none;
44
45
  height: 0;
45
46
  }
46
47
 
47
- /*
48
- * Addresses styling for `hidden` attribute not present in IE 8/9.
49
- */
48
+ /**
49
+ * Addresses styling for `hidden` attribute not present in IE 8/9.
50
+ * Hide the `template` element in IE, Safari, and Firefox < 22.
51
+ */
50
52
 
51
- [hidden] {
53
+ [hidden],
54
+ template {
52
55
  display: none;
53
56
  }
54
57
  }
55
58
 
56
59
  @mixin base-normalize-text-adjust() {
57
- /*
58
- * 0. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
59
- * http://clagnut.com/blog/348/#c790
60
- * 1. Sets default font family to sans-serif.
61
- * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
62
- * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
63
- */
60
+ /**
61
+ * 0. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
62
+ * http://clagnut.com/blog/348/#c790
63
+ * 1. Sets default font family to sans-serif.
64
+ * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
65
+ * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
66
+ */
64
67
  html {
65
68
  // legacy
66
69
  @if $legacy-support-for-ie7 or $legacy-support-for-ie6 {
67
70
  font-size: 100%; /* 0 */
68
71
  }
69
72
  font-family: sans-serif; /* 1 */
70
- -webkit-text-size-adjust: 100%; /* 2 */
71
73
  -ms-text-size-adjust: 100%; /* 2 */
74
+ -webkit-text-size-adjust: 100%; /* 2 */
72
75
  }
73
76
 
74
77
  }
@@ -78,9 +81,9 @@
78
81
  Base
79
82
  ========================================================================== */
80
83
 
81
- /*
82
- * Removes default margin.
83
- */
84
+ /**
85
+ * Removes default margin.
86
+ */
84
87
 
85
88
  body {
86
89
  margin: 0;
@@ -92,17 +95,29 @@
92
95
  Links
93
96
  ========================================================================== */
94
97
 
95
- /*
96
- * Addresses `outline` inconsistency between Chrome and other browsers.
97
- */
98
+ // TODO: need to evaluate this change given the issue known issue with
99
+ // transparent background elements not gaining :focus state
100
+ // so disabling this change for now :(
101
+ // @see transparent-focusable
102
+ ///**
103
+ // * Remove the gray background color from active links in IE 10.
104
+ // */
105
+ //
106
+ //a {
107
+ // background: transparent;
108
+ //}
109
+
110
+ /**
111
+ * Addresses `outline` inconsistency between Chrome and other browsers.
112
+ */
98
113
 
99
114
  a:focus {
100
115
  outline: thin dotted;
101
116
  }
102
117
 
103
- /*
104
- * Improves readability when focused and also mouse hovered in all browsers.
105
- */
118
+ /**
119
+ * Improves readability when focused and also mouse hovered in all browsers.
120
+ */
106
121
 
107
122
  a:active,
108
123
  a:hover {
@@ -111,9 +126,9 @@
111
126
  }
112
127
 
113
128
  @mixin base-normalize-typogrpahy-core() {
114
- /*
115
- * Corrects font family set oddly in Safari 5 and Chrome.
116
- */
129
+ /**
130
+ * Corrects font family set oddly in Safari 5 and Chrome.
131
+ */
117
132
 
118
133
  code,
119
134
  kbd,
@@ -123,9 +138,9 @@
123
138
  font-size: 1em;
124
139
  }
125
140
 
126
- /*
127
- * Improves readability of pre-formatted text in all browsers.
128
- */
141
+ /**
142
+ * Improves readability of pre-formatted text in all browsers.
143
+ */
129
144
 
130
145
  pre {
131
146
  white-space: pre;
@@ -134,17 +149,17 @@
134
149
  }
135
150
 
136
151
 
137
- /*
138
- * Addresses inconsistent and variable font size in all browsers.
139
- */
152
+ /**
153
+ * Addresses inconsistent and variable font size in all browsers.
154
+ */
140
155
 
141
156
  small {
142
157
  font-size: 80%;
143
158
  }
144
159
 
145
- /*
146
- * Prevents `sub` and `sup` affecting `line-height` in all browsers.
147
- */
160
+ /**
161
+ * Prevents `sub` and `sup` affecting `line-height` in all browsers.
162
+ */
148
163
 
149
164
  sub,
150
165
  sup {
@@ -168,10 +183,10 @@
168
183
  Typography
169
184
  ========================================================================== */
170
185
 
171
- /*
172
- * Addresses font sizes and margins set differently in IE6/7
173
- * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
174
- */
186
+ /**
187
+ * Addresses font sizes and margins set differently in IE6/7
188
+ * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
189
+ */
175
190
 
176
191
  h1 {
177
192
  font-size: 2em;
@@ -203,33 +218,45 @@
203
218
  margin: 2.33em 0;
204
219
  }
205
220
 
206
- /*
207
- * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
208
- */
221
+ /**
222
+ * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
223
+ */
209
224
 
210
225
  abbr[title] {
211
226
  border-bottom: 1px dotted;
212
227
  }
213
228
 
214
- /*
215
- * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
216
- */
229
+ /**
230
+ * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
231
+ */
217
232
 
218
233
  b,
219
234
  strong {
220
235
  font-weight: bold;
221
236
  }
222
- /*
223
- * Addresses styling not present in Safari 5 and Chrome.
224
- */
237
+
238
+ /**
239
+ * Addresses styling not present in Safari 5 and Chrome.
240
+ */
225
241
 
226
242
  dfn {
227
243
  font-style: italic;
228
244
  }
229
245
 
230
- /*
231
- * Addresses styling not present in IE 8/9.
232
- */
246
+ /**
247
+ * Address differences between Firefox and other browsers.
248
+ */
249
+
250
+ hr {
251
+ -moz-box-sizing: content-box;
252
+ box-sizing: content-box;
253
+ height: 0;
254
+ }
255
+
256
+
257
+ /**
258
+ * Addresses styling not present in IE 8/9.
259
+ */
233
260
 
234
261
  mark {
235
262
  background: #ff0;
@@ -240,9 +267,9 @@
240
267
  margin: 1em 40px;
241
268
  }
242
269
 
243
- /*
244
- * Addresses margins set differently in IE6/7
245
- */
270
+ /**
271
+ * Addresses margins set differently in IE6/7
272
+ */
246
273
 
247
274
  p,
248
275
  pre {
@@ -251,9 +278,9 @@
251
278
  }
252
279
 
253
280
  @mixin base-normalize-quotes() {
254
- /*
255
- * Sets consistent quote types.
256
- */
281
+ /**
282
+ * Sets consistent quote types.
283
+ */
257
284
  q {
258
285
  quotes: "\201C" "\201D" "\2018" "\2019";
259
286
  }
@@ -266,7 +293,7 @@
266
293
  Lists
267
294
  ========================================================================== */
268
295
 
269
- /*
296
+ /**
270
297
  * Addresses margins set differently in IE6/7
271
298
  */
272
299
 
@@ -281,7 +308,7 @@
281
308
  margin: 0 0 0 40px;
282
309
  }
283
310
 
284
- /*
311
+ /**
285
312
  * Addresses paddings set differently in IE6/7
286
313
  */
287
314
 
@@ -291,7 +318,7 @@
291
318
  padding: 0 0 0 40px;
292
319
  }
293
320
 
294
- /*
321
+ /**
295
322
  * Corrects list images handled incorrectly in IE7
296
323
  */
297
324
 
@@ -304,11 +331,11 @@
304
331
  }
305
332
 
306
333
  @mixin base-normalize-image() {
307
- /*
308
- * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3
309
- * 2. Improves image quality when scaled in IE7
310
- * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
311
- */
334
+ /**
335
+ * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3
336
+ * 2. Improves image quality when scaled in IE7
337
+ * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
338
+ */
312
339
 
313
340
  img {
314
341
  border: 0; /* 1 */
@@ -324,10 +351,10 @@
324
351
  Embedded content
325
352
  ========================================================================== */
326
353
  @include base-normalize-image();
327
-
328
- /*
329
- * Corrects overflow displayed oddly in IE9
330
- */
354
+
355
+ /**
356
+ * Corrects overflow displayed oddly in IE9
357
+ */
331
358
 
332
359
  svg:not(:root) {
333
360
  overflow: hidden;
@@ -339,9 +366,9 @@
339
366
  Figures
340
367
  ========================================================================== */
341
368
 
342
- /*
343
- * Addresses margin not present in IE6/7/8/9, S5, O11
344
- */
369
+ /**
370
+ * Addresses margin not present in IE6/7/8/9, S5, O11
371
+ */
345
372
 
346
373
  figure {
347
374
  margin: 0;
@@ -349,9 +376,9 @@
349
376
  }
350
377
 
351
378
  @mixin base-normalize-fieldset() {
352
- /*
353
- * Define consistent border, margin, and padding.
354
- */
379
+ /**
380
+ * Define consistent border, margin, and padding.
381
+ */
355
382
 
356
383
  fieldset {
357
384
  border: 1px solid #c0c0c0;
@@ -365,19 +392,19 @@
365
392
  Forms
366
393
  ========================================================================== */
367
394
 
368
- /*
369
- * Corrects margin displayed oddly in IE6/7
370
- */
395
+ /**
396
+ * Corrects margin displayed oddly in IE6/7
397
+ */
371
398
 
372
399
  form {
373
400
  margin: 0;
374
401
  }
375
402
 
376
- /*
377
- * 1. Corrects color not being inherited in IE6/7/8/9
378
- * 2. Corrects text not wrapping in FF3
379
- * 3. Corrects alignment displayed oddly in IE6/7
380
- */
403
+ /**
404
+ * 1. Corrects color not being inherited in IE6/7/8/9
405
+ * 2. Corrects text not wrapping in FF3
406
+ * 3. Corrects alignment displayed oddly in IE6/7
407
+ */
381
408
 
382
409
  legend {
383
410
  border: 0; /* 1 */
@@ -389,12 +416,12 @@
389
416
  }
390
417
  }
391
418
 
392
- /*
393
- * 1. Corrects font family not being inherited in all browsers.
394
- * 2. Corrects font size not being inherited in all browsers.
395
- * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
396
- * 4. Improves appearance and consistency in all browsers
397
- */
419
+ /**
420
+ * 1. Corrects font family not being inherited in all browsers.
421
+ * 2. Corrects font size not being inherited in all browsers.
422
+ * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
423
+ * 4. Improves appearance and consistency in all browsers
424
+ */
398
425
 
399
426
  button,
400
427
  input,
@@ -410,23 +437,35 @@
410
437
  }
411
438
  }
412
439
 
413
- /*
414
- * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
415
- */
440
+ /**
441
+ * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
442
+ */
416
443
 
417
444
  button,
418
445
  input {
419
446
  line-height: normal; /* 1 */
420
447
  }
421
448
 
422
- /*
423
- * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
424
- * and `video` controls.
425
- * 2. Corrects inability to style clickable `input` types in iOS.
426
- * 3. Improves usability and consistency of cursor style between image-type
427
- * `input` and others.
428
- * 4. Removes inner spacing in IE7 without affecting normal text inputs
429
- */
449
+ /**
450
+ * Address inconsistent `text-transform` inheritance for `button` and `select`.
451
+ * All other form control elements do not inherit `text-transform` values.
452
+ * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
453
+ * Correct `select` style inheritance in Firefox 4+ and Opera.
454
+ */
455
+
456
+ button,
457
+ select {
458
+ text-transform: none;
459
+ }
460
+
461
+ /**
462
+ * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
463
+ * and `video` controls.
464
+ * 2. Correct inability to style clickable `input` types in iOS.
465
+ * 3. Improve usability and consistency of cursor style between image-type
466
+ * `input` and others.
467
+ * 4. Removes inner spacing in IE7 without affecting normal text inputs
468
+ */
430
469
 
431
470
  button,
432
471
  html input[type="button"], /* 1 */
@@ -440,21 +479,21 @@
440
479
  }
441
480
  }
442
481
 
443
- /*
444
- * Re-set default cursor for disabled elements.
445
- */
482
+ /**
483
+ * Re-set default cursor for disabled elements.
484
+ */
446
485
 
447
486
  button[disabled],
448
- input[disabled] {
487
+ html input[disabled] {
449
488
  cursor: default;
450
489
  }
451
490
 
452
- /*
453
- * 1. Addresses box sizing set to `content-box` in IE 8/9.
454
- * 2. Removes excess padding in IE 8/9.
455
- * 3. Removes excess padding in IE7
491
+ /**
492
+ * 1. Addresses box sizing set to `content-box` in IE 8/9.
493
+ * 2. Removes excess padding in IE 8/9.
494
+ * 3. Removes excess padding in IE7
456
495
  Known issue: excess padding remains in IE6
457
- */
496
+ */
458
497
 
459
498
  input[type="checkbox"],
460
499
  input[type="radio"] {
@@ -467,11 +506,11 @@
467
506
  }
468
507
  }
469
508
 
470
- /*
471
- * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
472
- * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
473
- * (include `-moz` to future-proof).
474
- */
509
+ /**
510
+ * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
511
+ * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
512
+ * (include `-moz` to future-proof).
513
+ */
475
514
 
476
515
  input[type="search"] {
477
516
  -webkit-appearance: textfield; /* 1 */
@@ -481,10 +520,10 @@
481
520
  }
482
521
 
483
522
 
484
- /*
485
- * Removes inner padding and search cancel button in Safari 5 and Chrome
486
- * on OS X.
487
- */
523
+ /**
524
+ * Removes inner padding and search cancel button in Safari 5 and Chrome
525
+ * on OS X.
526
+ */
488
527
 
489
528
  input[type="search"]::-webkit-search-cancel-button,
490
529
  input[type="search"]::-webkit-search-decoration {
@@ -492,9 +531,9 @@
492
531
  }
493
532
 
494
533
 
495
- /*
496
- * Removes inner padding and border in Firefox 4+.
497
- */
534
+ /**
535
+ * Removes inner padding and border in Firefox 4+.
536
+ */
498
537
 
499
538
  button::-moz-focus-inner,
500
539
  input::-moz-focus-inner {
@@ -502,16 +541,16 @@
502
541
  padding: 0;
503
542
  }
504
543
 
505
- /*
506
- * 1. Removes default vertical scrollbar in IE6/7/8/9
507
- * 2. Improves readability and alignment in all browsers
508
- */
544
+ /**
545
+ * 1. Removes default vertical scrollbar in IE6/7/8/9
546
+ * 2. Improves readability and alignment in all browsers
547
+ */
509
548
 
510
549
  textarea {
511
550
  overflow: auto; /* 1 */
512
551
  vertical-align: top; /* 2 */
513
552
  }
514
-
553
+
515
554
  }
516
555
 
517
556
  @mixin base-normalize-ime() {
@@ -529,9 +568,9 @@
529
568
  Tables
530
569
  ========================================================================== */
531
570
 
532
- /*
533
- * Remove most spacing between table cells.
534
- */
571
+ /**
572
+ * Remove most spacing between table cells.
573
+ */
535
574
 
536
575
  table {
537
576
  border-collapse: collapse;
@@ -545,7 +584,7 @@
545
584
  // @param $exclude {List} the list of features to exclude from the reset
546
585
  // @link http://github.com/necolas/normalize.css
547
586
  @mixin base-normalize($exclude: ()) {
548
- /*! normalize.css v2.0.1 | MIT License | git.io/normalize */
587
+ /*! normalize.css v2.1.2 | MIT License | git.io/normalize */
549
588
  $exclude: -compass-list($exclude);
550
589
  @if(not index($exclude, normalize-html5)) {
551
590
  @include base-normalize-html5();