hanuman 0.3.0 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/LICENSE.txt +21 -21
- data/README.md +175 -173
- data/_data/authors.yml +16 -0
- data/_data/navigation.yml +4 -4
- data/_includes/analytics.html +15 -15
- data/_includes/footer.html +65 -65
- data/_includes/head.html +68 -68
- data/_includes/header.html +58 -58
- data/_includes/metadata.json +30 -30
- data/_includes/styles.scss +727 -727
- data/_layouts/default.html +13 -13
- data/_layouts/page.html +16 -16
- data/_layouts/post.html +157 -153
- data/_sass/_syntax-highlighting.scss +65 -65
- data/_sass/bourbon/_bourbon-deprecated-upcoming.scss +8 -8
- data/_sass/bourbon/_bourbon.scss +79 -79
- data/_sass/bourbon/addons/_button.scss +374 -374
- data/_sass/bourbon/addons/_clearfix.scss +23 -23
- data/_sass/bourbon/addons/_directional-values.scss +111 -111
- data/_sass/bourbon/addons/_ellipsis.scss +7 -7
- data/_sass/bourbon/addons/_font-family.scss +5 -5
- data/_sass/bourbon/addons/_hide-text.scss +10 -10
- data/_sass/bourbon/addons/_html5-input-types.scss +86 -86
- data/_sass/bourbon/addons/_position.scss +32 -32
- data/_sass/bourbon/addons/_prefixer.scss +45 -45
- data/_sass/bourbon/addons/_retina-image.scss +31 -31
- data/_sass/bourbon/addons/_size.scss +16 -16
- data/_sass/bourbon/addons/_timing-functions.scss +32 -32
- data/_sass/bourbon/addons/_triangle.scss +83 -83
- data/_sass/bourbon/addons/_word-wrap.scss +8 -8
- data/_sass/bourbon/css3/_animation.scss +52 -52
- data/_sass/bourbon/css3/_appearance.scss +3 -3
- data/_sass/bourbon/css3/_backface-visibility.scss +6 -6
- data/_sass/bourbon/css3/_background-image.scss +42 -42
- data/_sass/bourbon/css3/_background.scss +55 -55
- data/_sass/bourbon/css3/_border-image.scss +59 -59
- data/_sass/bourbon/css3/_border-radius.scss +22 -22
- data/_sass/bourbon/css3/_box-sizing.scss +4 -4
- data/_sass/bourbon/css3/_calc.scss +4 -4
- data/_sass/bourbon/css3/_columns.scss +47 -47
- data/_sass/bourbon/css3/_filter.scss +5 -5
- data/_sass/bourbon/css3/_flex-box.scss +321 -321
- data/_sass/bourbon/css3/_font-face.scss +23 -23
- data/_sass/bourbon/css3/_font-feature-settings.scss +9 -9
- data/_sass/bourbon/css3/_hidpi-media-query.scss +10 -10
- data/_sass/bourbon/css3/_hyphens.scss +3 -3
- data/_sass/bourbon/css3/_image-rendering.scss +14 -14
- data/_sass/bourbon/css3/_keyframes.scss +35 -35
- data/_sass/bourbon/css3/_linear-gradient.scss +38 -38
- data/_sass/bourbon/css3/_perspective.scss +8 -8
- data/_sass/bourbon/css3/_placeholder.scss +8 -8
- data/_sass/bourbon/css3/_radial-gradient.scss +39 -39
- data/_sass/bourbon/css3/_transform.scss +15 -15
- data/_sass/bourbon/css3/_transition.scss +77 -77
- data/_sass/bourbon/css3/_user-select.scss +3 -3
- data/_sass/bourbon/functions/_assign.scss +10 -10
- data/_sass/bourbon/functions/_color-lightness.scss +13 -13
- data/_sass/bourbon/functions/_flex-grid.scss +38 -38
- data/_sass/bourbon/functions/_golden-ratio.scss +3 -3
- data/_sass/bourbon/functions/_grid-width.scss +13 -13
- data/_sass/bourbon/functions/_modular-scale.scss +66 -66
- data/_sass/bourbon/functions/_px-to-em.scss +13 -13
- data/_sass/bourbon/functions/_px-to-rem.scss +15 -15
- data/_sass/bourbon/functions/_strip-units.scss +5 -5
- data/_sass/bourbon/functions/_tint-shade.scss +9 -9
- data/_sass/bourbon/functions/_transition-property-name.scss +21 -21
- data/_sass/bourbon/functions/_unpack.scss +17 -17
- data/_sass/bourbon/helpers/_convert-units.scss +15 -15
- data/_sass/bourbon/helpers/_gradient-positions-parser.scss +13 -13
- data/_sass/bourbon/helpers/_is-num.scss +8 -8
- data/_sass/bourbon/helpers/_linear-angle-parser.scss +25 -25
- data/_sass/bourbon/helpers/_linear-gradient-parser.scss +41 -41
- data/_sass/bourbon/helpers/_linear-positions-parser.scss +61 -61
- data/_sass/bourbon/helpers/_linear-side-corner-parser.scss +31 -31
- data/_sass/bourbon/helpers/_radial-arg-parser.scss +69 -69
- data/_sass/bourbon/helpers/_radial-gradient-parser.scss +50 -50
- data/_sass/bourbon/helpers/_radial-positions-parser.scss +18 -18
- data/_sass/bourbon/helpers/_render-gradients.scss +26 -26
- data/_sass/bourbon/helpers/_shape-size-stripper.scss +10 -10
- data/_sass/bourbon/helpers/_str-to-num.scss +50 -50
- data/_sass/bourbon/settings/_asset-pipeline.scss +1 -1
- data/_sass/bourbon/settings/_prefixer.scss +6 -6
- data/_sass/bourbon/settings/_px-to-em.scss +1 -1
- metadata +4 -4
- data/_data/author.yml +0 -8
@@ -1,23 +1,23 @@
|
|
1
|
-
// Modern micro clearfix provides an easy way to contain floats without adding additional markup.
|
2
|
-
//
|
3
|
-
// Example usage:
|
4
|
-
//
|
5
|
-
// // Contain all floats within .wrapper
|
6
|
-
// .wrapper {
|
7
|
-
// @include clearfix;
|
8
|
-
// .content,
|
9
|
-
// .sidebar {
|
10
|
-
// float : left;
|
11
|
-
// }
|
12
|
-
// }
|
13
|
-
|
14
|
-
@mixin clearfix {
|
15
|
-
&:after {
|
16
|
-
content:"";
|
17
|
-
display:table;
|
18
|
-
clear:both;
|
19
|
-
}
|
20
|
-
}
|
21
|
-
|
22
|
-
// Acknowledgements
|
23
|
-
// Beat *that* clearfix: [Thierry Koblentz](http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php)
|
1
|
+
// Modern micro clearfix provides an easy way to contain floats without adding additional markup.
|
2
|
+
//
|
3
|
+
// Example usage:
|
4
|
+
//
|
5
|
+
// // Contain all floats within .wrapper
|
6
|
+
// .wrapper {
|
7
|
+
// @include clearfix;
|
8
|
+
// .content,
|
9
|
+
// .sidebar {
|
10
|
+
// float : left;
|
11
|
+
// }
|
12
|
+
// }
|
13
|
+
|
14
|
+
@mixin clearfix {
|
15
|
+
&:after {
|
16
|
+
content:"";
|
17
|
+
display:table;
|
18
|
+
clear:both;
|
19
|
+
}
|
20
|
+
}
|
21
|
+
|
22
|
+
// Acknowledgements
|
23
|
+
// Beat *that* clearfix: [Thierry Koblentz](http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php)
|
@@ -1,111 +1,111 @@
|
|
1
|
-
// directional-property mixins are shorthands
|
2
|
-
// for writing properties like the following
|
3
|
-
//
|
4
|
-
// @include margin(null 0 10px);
|
5
|
-
// ------
|
6
|
-
// margin-right: 0;
|
7
|
-
// margin-bottom: 10px;
|
8
|
-
// margin-left: 0;
|
9
|
-
//
|
10
|
-
// - or -
|
11
|
-
//
|
12
|
-
// @include border-style(dotted null);
|
13
|
-
// ------
|
14
|
-
// border-top-style: dotted;
|
15
|
-
// border-bottom-style: dotted;
|
16
|
-
//
|
17
|
-
// ------
|
18
|
-
//
|
19
|
-
// Note: You can also use false instead of null
|
20
|
-
|
21
|
-
@function collapse-directionals($vals) {
|
22
|
-
$output: null;
|
23
|
-
|
24
|
-
$A: nth( $vals, 1 );
|
25
|
-
$B: if( length($vals) < 2, $A, nth($vals, 2));
|
26
|
-
$C: if( length($vals) < 3, $A, nth($vals, 3));
|
27
|
-
$D: if( length($vals) < 2, $A, nth($vals, if( length($vals) < 4, 2, 4) ));
|
28
|
-
|
29
|
-
@if $A == 0 { $A: 0 }
|
30
|
-
@if $B == 0 { $B: 0 }
|
31
|
-
@if $C == 0 { $C: 0 }
|
32
|
-
@if $D == 0 { $D: 0 }
|
33
|
-
|
34
|
-
@if $A == $B and $A == $C and $A == $D { $output: $A }
|
35
|
-
@else if $A == $C and $B == $D { $output: $A $B }
|
36
|
-
@else if $B == $D { $output: $A $B $C }
|
37
|
-
@else { $output: $A $B $C $D }
|
38
|
-
|
39
|
-
@return $output;
|
40
|
-
}
|
41
|
-
|
42
|
-
@function contains-falsy($list) {
|
43
|
-
@each $item in $list {
|
44
|
-
@if not $item {
|
45
|
-
@return true;
|
46
|
-
}
|
47
|
-
}
|
48
|
-
|
49
|
-
@return false;
|
50
|
-
}
|
51
|
-
|
52
|
-
@mixin directional-property($pre, $suf, $vals) {
|
53
|
-
// Property Names
|
54
|
-
$top: $pre + "-top" + if($suf, "-#{$suf}", "");
|
55
|
-
$bottom: $pre + "-bottom" + if($suf, "-#{$suf}", "");
|
56
|
-
$left: $pre + "-left" + if($suf, "-#{$suf}", "");
|
57
|
-
$right: $pre + "-right" + if($suf, "-#{$suf}", "");
|
58
|
-
$all: $pre + if($suf, "-#{$suf}", "");
|
59
|
-
|
60
|
-
$vals: collapse-directionals($vals);
|
61
|
-
|
62
|
-
@if contains-falsy($vals) {
|
63
|
-
@if nth($vals, 1) { #{$top}: nth($vals, 1); }
|
64
|
-
|
65
|
-
@if length($vals) == 1 {
|
66
|
-
@if nth($vals, 1) { #{$right}: nth($vals, 1); }
|
67
|
-
} @else {
|
68
|
-
@if nth($vals, 2) { #{$right}: nth($vals, 2); }
|
69
|
-
}
|
70
|
-
|
71
|
-
// prop: top/bottom right/left
|
72
|
-
@if length($vals) == 2 {
|
73
|
-
@if nth($vals, 1) { #{$bottom}: nth($vals, 1); }
|
74
|
-
@if nth($vals, 2) { #{$left}: nth($vals, 2); }
|
75
|
-
|
76
|
-
// prop: top right/left bottom
|
77
|
-
} @else if length($vals) == 3 {
|
78
|
-
@if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
|
79
|
-
@if nth($vals, 2) { #{$left}: nth($vals, 2); }
|
80
|
-
|
81
|
-
// prop: top right bottom left
|
82
|
-
} @else if length($vals) == 4 {
|
83
|
-
@if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
|
84
|
-
@if nth($vals, 4) { #{$left}: nth($vals, 4); }
|
85
|
-
}
|
86
|
-
|
87
|
-
// prop: top/right/bottom/left
|
88
|
-
} @else {
|
89
|
-
#{$all}: $vals;
|
90
|
-
}
|
91
|
-
}
|
92
|
-
|
93
|
-
@mixin margin($vals...) {
|
94
|
-
@include directional-property(margin, false, $vals...);
|
95
|
-
}
|
96
|
-
|
97
|
-
@mixin padding($vals...) {
|
98
|
-
@include directional-property(padding, false, $vals...);
|
99
|
-
}
|
100
|
-
|
101
|
-
@mixin border-style($vals...) {
|
102
|
-
@include directional-property(border, style, $vals...);
|
103
|
-
}
|
104
|
-
|
105
|
-
@mixin border-color($vals...) {
|
106
|
-
@include directional-property(border, color, $vals...);
|
107
|
-
}
|
108
|
-
|
109
|
-
@mixin border-width($vals...) {
|
110
|
-
@include directional-property(border, width, $vals...);
|
111
|
-
}
|
1
|
+
// directional-property mixins are shorthands
|
2
|
+
// for writing properties like the following
|
3
|
+
//
|
4
|
+
// @include margin(null 0 10px);
|
5
|
+
// ------
|
6
|
+
// margin-right: 0;
|
7
|
+
// margin-bottom: 10px;
|
8
|
+
// margin-left: 0;
|
9
|
+
//
|
10
|
+
// - or -
|
11
|
+
//
|
12
|
+
// @include border-style(dotted null);
|
13
|
+
// ------
|
14
|
+
// border-top-style: dotted;
|
15
|
+
// border-bottom-style: dotted;
|
16
|
+
//
|
17
|
+
// ------
|
18
|
+
//
|
19
|
+
// Note: You can also use false instead of null
|
20
|
+
|
21
|
+
@function collapse-directionals($vals) {
|
22
|
+
$output: null;
|
23
|
+
|
24
|
+
$A: nth( $vals, 1 );
|
25
|
+
$B: if( length($vals) < 2, $A, nth($vals, 2));
|
26
|
+
$C: if( length($vals) < 3, $A, nth($vals, 3));
|
27
|
+
$D: if( length($vals) < 2, $A, nth($vals, if( length($vals) < 4, 2, 4) ));
|
28
|
+
|
29
|
+
@if $A == 0 { $A: 0 }
|
30
|
+
@if $B == 0 { $B: 0 }
|
31
|
+
@if $C == 0 { $C: 0 }
|
32
|
+
@if $D == 0 { $D: 0 }
|
33
|
+
|
34
|
+
@if $A == $B and $A == $C and $A == $D { $output: $A }
|
35
|
+
@else if $A == $C and $B == $D { $output: $A $B }
|
36
|
+
@else if $B == $D { $output: $A $B $C }
|
37
|
+
@else { $output: $A $B $C $D }
|
38
|
+
|
39
|
+
@return $output;
|
40
|
+
}
|
41
|
+
|
42
|
+
@function contains-falsy($list) {
|
43
|
+
@each $item in $list {
|
44
|
+
@if not $item {
|
45
|
+
@return true;
|
46
|
+
}
|
47
|
+
}
|
48
|
+
|
49
|
+
@return false;
|
50
|
+
}
|
51
|
+
|
52
|
+
@mixin directional-property($pre, $suf, $vals) {
|
53
|
+
// Property Names
|
54
|
+
$top: $pre + "-top" + if($suf, "-#{$suf}", "");
|
55
|
+
$bottom: $pre + "-bottom" + if($suf, "-#{$suf}", "");
|
56
|
+
$left: $pre + "-left" + if($suf, "-#{$suf}", "");
|
57
|
+
$right: $pre + "-right" + if($suf, "-#{$suf}", "");
|
58
|
+
$all: $pre + if($suf, "-#{$suf}", "");
|
59
|
+
|
60
|
+
$vals: collapse-directionals($vals);
|
61
|
+
|
62
|
+
@if contains-falsy($vals) {
|
63
|
+
@if nth($vals, 1) { #{$top}: nth($vals, 1); }
|
64
|
+
|
65
|
+
@if length($vals) == 1 {
|
66
|
+
@if nth($vals, 1) { #{$right}: nth($vals, 1); }
|
67
|
+
} @else {
|
68
|
+
@if nth($vals, 2) { #{$right}: nth($vals, 2); }
|
69
|
+
}
|
70
|
+
|
71
|
+
// prop: top/bottom right/left
|
72
|
+
@if length($vals) == 2 {
|
73
|
+
@if nth($vals, 1) { #{$bottom}: nth($vals, 1); }
|
74
|
+
@if nth($vals, 2) { #{$left}: nth($vals, 2); }
|
75
|
+
|
76
|
+
// prop: top right/left bottom
|
77
|
+
} @else if length($vals) == 3 {
|
78
|
+
@if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
|
79
|
+
@if nth($vals, 2) { #{$left}: nth($vals, 2); }
|
80
|
+
|
81
|
+
// prop: top right bottom left
|
82
|
+
} @else if length($vals) == 4 {
|
83
|
+
@if nth($vals, 3) { #{$bottom}: nth($vals, 3); }
|
84
|
+
@if nth($vals, 4) { #{$left}: nth($vals, 4); }
|
85
|
+
}
|
86
|
+
|
87
|
+
// prop: top/right/bottom/left
|
88
|
+
} @else {
|
89
|
+
#{$all}: $vals;
|
90
|
+
}
|
91
|
+
}
|
92
|
+
|
93
|
+
@mixin margin($vals...) {
|
94
|
+
@include directional-property(margin, false, $vals...);
|
95
|
+
}
|
96
|
+
|
97
|
+
@mixin padding($vals...) {
|
98
|
+
@include directional-property(padding, false, $vals...);
|
99
|
+
}
|
100
|
+
|
101
|
+
@mixin border-style($vals...) {
|
102
|
+
@include directional-property(border, style, $vals...);
|
103
|
+
}
|
104
|
+
|
105
|
+
@mixin border-color($vals...) {
|
106
|
+
@include directional-property(border, color, $vals...);
|
107
|
+
}
|
108
|
+
|
109
|
+
@mixin border-width($vals...) {
|
110
|
+
@include directional-property(border, width, $vals...);
|
111
|
+
}
|
@@ -1,7 +1,7 @@
|
|
1
|
-
@mixin ellipsis($width: 100%) {
|
2
|
-
display: inline-block;
|
3
|
-
max-width: $width;
|
4
|
-
overflow: hidden;
|
5
|
-
text-overflow: ellipsis;
|
6
|
-
white-space: nowrap;
|
7
|
-
}
|
1
|
+
@mixin ellipsis($width: 100%) {
|
2
|
+
display: inline-block;
|
3
|
+
max-width: $width;
|
4
|
+
overflow: hidden;
|
5
|
+
text-overflow: ellipsis;
|
6
|
+
white-space: nowrap;
|
7
|
+
}
|
@@ -1,5 +1,5 @@
|
|
1
|
-
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
|
2
|
-
$helvetica: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
|
3
|
-
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
|
4
|
-
$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
|
5
|
-
$verdana: Verdana, Geneva, sans-serif;
|
1
|
+
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
|
2
|
+
$helvetica: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
|
3
|
+
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
|
4
|
+
$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
|
5
|
+
$verdana: Verdana, Geneva, sans-serif;
|
@@ -1,10 +1,10 @@
|
|
1
|
-
@mixin hide-text {
|
2
|
-
overflow: hidden;
|
3
|
-
|
4
|
-
&:before {
|
5
|
-
content: "";
|
6
|
-
display: block;
|
7
|
-
width: 0;
|
8
|
-
height: 100%;
|
9
|
-
}
|
10
|
-
}
|
1
|
+
@mixin hide-text {
|
2
|
+
overflow: hidden;
|
3
|
+
|
4
|
+
&:before {
|
5
|
+
content: "";
|
6
|
+
display: block;
|
7
|
+
width: 0;
|
8
|
+
height: 100%;
|
9
|
+
}
|
10
|
+
}
|
@@ -1,86 +1,86 @@
|
|
1
|
-
//************************************************************************//
|
2
|
-
// Generate a variable ($all-text-inputs) with a list of all html5
|
3
|
-
// input types that have a text-based input, excluding textarea.
|
4
|
-
// http://diveintohtml5.org/forms.html
|
5
|
-
//************************************************************************//
|
6
|
-
$inputs-list: 'input[type="email"]',
|
7
|
-
'input[type="number"]',
|
8
|
-
'input[type="password"]',
|
9
|
-
'input[type="search"]',
|
10
|
-
'input[type="tel"]',
|
11
|
-
'input[type="text"]',
|
12
|
-
'input[type="url"]',
|
13
|
-
|
14
|
-
// Webkit & Gecko may change the display of these in the future
|
15
|
-
'input[type="color"]',
|
16
|
-
'input[type="date"]',
|
17
|
-
'input[type="datetime"]',
|
18
|
-
'input[type="datetime-local"]',
|
19
|
-
'input[type="month"]',
|
20
|
-
'input[type="time"]',
|
21
|
-
'input[type="week"]';
|
22
|
-
|
23
|
-
// Bare inputs
|
24
|
-
//************************************************************************//
|
25
|
-
$all-text-inputs: assign-inputs($inputs-list);
|
26
|
-
|
27
|
-
// Hover Pseudo-class
|
28
|
-
//************************************************************************//
|
29
|
-
$all-text-inputs-hover: assign-inputs($inputs-list, hover);
|
30
|
-
|
31
|
-
// Focus Pseudo-class
|
32
|
-
//************************************************************************//
|
33
|
-
$all-text-inputs-focus: assign-inputs($inputs-list, focus);
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
// You must use interpolation on the variable:
|
38
|
-
// #{$all-text-inputs}
|
39
|
-
// #{$all-text-inputs-hover}
|
40
|
-
// #{$all-text-inputs-focus}
|
41
|
-
|
42
|
-
// Example
|
43
|
-
//************************************************************************//
|
44
|
-
// #{$all-text-inputs}, textarea {
|
45
|
-
// border: 1px solid red;
|
46
|
-
// }
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
//************************************************************************//
|
51
|
-
// Generate a variable ($all-button-inputs) with a list of all html5
|
52
|
-
// input types that have a button-based input, excluding button.
|
53
|
-
//************************************************************************//
|
54
|
-
$inputs-button-list: 'input[type="button"]',
|
55
|
-
'input[type="reset"]',
|
56
|
-
'input[type="submit"]';
|
57
|
-
|
58
|
-
// Bare inputs
|
59
|
-
//************************************************************************//
|
60
|
-
$all-button-inputs: assign-inputs($inputs-button-list);
|
61
|
-
|
62
|
-
// Hover Pseudo-class
|
63
|
-
//************************************************************************//
|
64
|
-
$all-button-inputs-hover: assign-inputs($inputs-button-list, hover);
|
65
|
-
|
66
|
-
// Focus Pseudo-class
|
67
|
-
//************************************************************************//
|
68
|
-
$all-button-inputs-focus: assign-inputs($inputs-button-list, focus);
|
69
|
-
|
70
|
-
// Active Pseudo-class
|
71
|
-
//************************************************************************//
|
72
|
-
$all-button-inputs-active: assign-inputs($inputs-button-list, active);
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
// You must use interpolation on the variable:
|
77
|
-
// #{$all-button-inputs}
|
78
|
-
// #{$all-button-inputs-hover}
|
79
|
-
// #{$all-button-inputs-focus}
|
80
|
-
// #{$all-button-inputs-active}
|
81
|
-
|
82
|
-
// Example
|
83
|
-
//************************************************************************//
|
84
|
-
// #{$all-button-inputs}, button {
|
85
|
-
// border: 1px solid red;
|
86
|
-
// }
|
1
|
+
//************************************************************************//
|
2
|
+
// Generate a variable ($all-text-inputs) with a list of all html5
|
3
|
+
// input types that have a text-based input, excluding textarea.
|
4
|
+
// http://diveintohtml5.org/forms.html
|
5
|
+
//************************************************************************//
|
6
|
+
$inputs-list: 'input[type="email"]',
|
7
|
+
'input[type="number"]',
|
8
|
+
'input[type="password"]',
|
9
|
+
'input[type="search"]',
|
10
|
+
'input[type="tel"]',
|
11
|
+
'input[type="text"]',
|
12
|
+
'input[type="url"]',
|
13
|
+
|
14
|
+
// Webkit & Gecko may change the display of these in the future
|
15
|
+
'input[type="color"]',
|
16
|
+
'input[type="date"]',
|
17
|
+
'input[type="datetime"]',
|
18
|
+
'input[type="datetime-local"]',
|
19
|
+
'input[type="month"]',
|
20
|
+
'input[type="time"]',
|
21
|
+
'input[type="week"]';
|
22
|
+
|
23
|
+
// Bare inputs
|
24
|
+
//************************************************************************//
|
25
|
+
$all-text-inputs: assign-inputs($inputs-list);
|
26
|
+
|
27
|
+
// Hover Pseudo-class
|
28
|
+
//************************************************************************//
|
29
|
+
$all-text-inputs-hover: assign-inputs($inputs-list, hover);
|
30
|
+
|
31
|
+
// Focus Pseudo-class
|
32
|
+
//************************************************************************//
|
33
|
+
$all-text-inputs-focus: assign-inputs($inputs-list, focus);
|
34
|
+
|
35
|
+
|
36
|
+
|
37
|
+
// You must use interpolation on the variable:
|
38
|
+
// #{$all-text-inputs}
|
39
|
+
// #{$all-text-inputs-hover}
|
40
|
+
// #{$all-text-inputs-focus}
|
41
|
+
|
42
|
+
// Example
|
43
|
+
//************************************************************************//
|
44
|
+
// #{$all-text-inputs}, textarea {
|
45
|
+
// border: 1px solid red;
|
46
|
+
// }
|
47
|
+
|
48
|
+
|
49
|
+
|
50
|
+
//************************************************************************//
|
51
|
+
// Generate a variable ($all-button-inputs) with a list of all html5
|
52
|
+
// input types that have a button-based input, excluding button.
|
53
|
+
//************************************************************************//
|
54
|
+
$inputs-button-list: 'input[type="button"]',
|
55
|
+
'input[type="reset"]',
|
56
|
+
'input[type="submit"]';
|
57
|
+
|
58
|
+
// Bare inputs
|
59
|
+
//************************************************************************//
|
60
|
+
$all-button-inputs: assign-inputs($inputs-button-list);
|
61
|
+
|
62
|
+
// Hover Pseudo-class
|
63
|
+
//************************************************************************//
|
64
|
+
$all-button-inputs-hover: assign-inputs($inputs-button-list, hover);
|
65
|
+
|
66
|
+
// Focus Pseudo-class
|
67
|
+
//************************************************************************//
|
68
|
+
$all-button-inputs-focus: assign-inputs($inputs-button-list, focus);
|
69
|
+
|
70
|
+
// Active Pseudo-class
|
71
|
+
//************************************************************************//
|
72
|
+
$all-button-inputs-active: assign-inputs($inputs-button-list, active);
|
73
|
+
|
74
|
+
|
75
|
+
|
76
|
+
// You must use interpolation on the variable:
|
77
|
+
// #{$all-button-inputs}
|
78
|
+
// #{$all-button-inputs-hover}
|
79
|
+
// #{$all-button-inputs-focus}
|
80
|
+
// #{$all-button-inputs-active}
|
81
|
+
|
82
|
+
// Example
|
83
|
+
//************************************************************************//
|
84
|
+
// #{$all-button-inputs}, button {
|
85
|
+
// border: 1px solid red;
|
86
|
+
// }
|