oulu 0.9.11 → 0.10.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (59) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/_oulu-base.sass +9 -10
  3. data/app/assets/stylesheets/{options → modules}/amazlet/_amazlet.sass +0 -0
  4. data/app/assets/stylesheets/modules/buttons/_button-base.sass +67 -10
  5. data/app/assets/stylesheets/modules/buttons/_button-helper.sass +36 -12
  6. data/app/assets/stylesheets/modules/buttons/_buttons.sass +9 -7
  7. data/app/assets/stylesheets/modules/buttons/styles/_border.sass +29 -5
  8. data/app/assets/stylesheets/modules/buttons/styles/_flat-emboss.sass +36 -1
  9. data/app/assets/stylesheets/modules/buttons/styles/_flat-round.sass +31 -2
  10. data/app/assets/stylesheets/modules/buttons/styles/_material.sass +12 -6
  11. data/app/assets/stylesheets/modules/buttons/styles/_normal.sass +39 -7
  12. data/app/assets/stylesheets/modules/buttons/styles/_super-bold-border.sass +63 -0
  13. data/app/assets/stylesheets/{options → modules}/glitch/_glitch.sass +2 -2
  14. data/app/assets/stylesheets/modules/glitch/_glitch.sass~organize-modules +31 -0
  15. data/app/assets/stylesheets/modules/navs/_tabs-nav.sass +0 -8
  16. data/app/assets/stylesheets/modules/text-input/_text-inputs.sass +0 -0
  17. data/app/assets/stylesheets/{options → modules}/web-fonts/_cousine.sass +0 -0
  18. data/app/assets/stylesheets/{options → modules}/web-fonts/_droid-sans.sass +0 -0
  19. data/app/assets/stylesheets/{options → modules}/web-fonts/_font-awsome.sass +0 -0
  20. data/app/assets/stylesheets/{options → modules}/web-fonts/_icomoon.sass +0 -0
  21. data/app/assets/stylesheets/{options → modules}/web-fonts/_inconsolata.sass +0 -0
  22. data/app/assets/stylesheets/{options → modules}/web-fonts/_lato.sass +0 -0
  23. data/app/assets/stylesheets/{options → modules}/web-fonts/_merriweather-sans.sass +0 -0
  24. data/app/assets/stylesheets/{options → modules}/web-fonts/_montserrat.sass +0 -0
  25. data/app/assets/stylesheets/{options → modules}/web-fonts/_old-standard.sass +0 -0
  26. data/app/assets/stylesheets/{options → modules}/web-fonts/_open-sans.sass +0 -0
  27. data/app/assets/stylesheets/{options → modules}/web-fonts/_podkova.sass +0 -0
  28. data/app/assets/stylesheets/{options → modules}/web-fonts/_pt-sans.sass +0 -0
  29. data/app/assets/stylesheets/{options → modules}/web-fonts/_raleway.sass +0 -0
  30. data/app/assets/stylesheets/{options → modules}/web-fonts/_roboto-condensed.sass +0 -0
  31. data/app/assets/stylesheets/{options → modules}/web-fonts/_roboto-mono.sass +0 -0
  32. data/app/assets/stylesheets/{options → modules}/web-fonts/_roboto.sass +0 -0
  33. data/app/assets/stylesheets/{options → modules}/web-fonts/_satisfy.sass +0 -0
  34. data/app/assets/stylesheets/{options → modules}/web-fonts/_source-code-pro.sass +0 -0
  35. data/app/assets/stylesheets/{options → modules}/web-fonts/_source-sans-pro.sass +0 -0
  36. data/app/assets/stylesheets/{options → modules}/web-fonts/_special-elite.sass +0 -0
  37. data/app/assets/stylesheets/{options → modules}/web-fonts/_tauri.sass +0 -0
  38. data/app/assets/stylesheets/{options → modules}/web-fonts/_ubuntu-mono.sass +0 -0
  39. data/app/assets/stylesheets/{options → modules}/web-fonts/_ubuntu.sass +0 -0
  40. data/app/assets/stylesheets/{options → modules}/web-fonts/_varela-round.sass +0 -0
  41. data/app/assets/stylesheets/{options → modules}/web-fonts/_vt323.sass +0 -0
  42. data/app/assets/stylesheets/settings/functions/_animation.sass +4 -4
  43. data/app/assets/stylesheets/settings/functions/_background.sass +25 -18
  44. data/app/assets/stylesheets/settings/functions/_color.sass +12 -1
  45. data/app/assets/stylesheets/settings/functions/_timing.sass +28 -0
  46. data/app/assets/stylesheets/settings/initializers/_reboot.sass +8 -0
  47. data/app/assets/stylesheets/settings/initializers/_sanitize.sass +168 -106
  48. data/app/assets/stylesheets/settings/mixins/_animation.sass +32 -28
  49. data/app/assets/stylesheets/settings/mixins/_background.sass +34 -33
  50. data/app/assets/stylesheets/settings/mixins/_block.sass +17 -21
  51. data/app/assets/stylesheets/settings/mixins/_line.sass +7 -7
  52. data/app/assets/stylesheets/settings/mixins/_text.sass +9 -4
  53. data/app/assets/stylesheets/settings/variables/_default.sass +14 -44
  54. data/app/assets/stylesheets/settings/variables/_modules.sass +55 -0
  55. data/bower.json +1 -4
  56. data/lib/oulu/version.rb +1 -1
  57. data/oulu.gemspec +0 -2
  58. data/package.json +2 -5
  59. metadata +34 -57
@@ -1,12 +1,12 @@
1
1
  @function time($value)
2
- @if unit_number($value) and unit($value) == 's'
2
+ @if unit_number($value) and unit($value) == s
3
3
  @return true
4
4
  @else
5
5
  @return null
6
6
 
7
7
  @function timing_function($value)
8
8
  @if string($value)
9
- @if $value == 'ease' or $value == 'linear' or $value == 'ease-in' or $value == 'ease-out' or $value == 'ease-in-out' or str-slice($value, 1, 12) == 'cubic-bezier'
9
+ @if $value == 'ease' or $value == 'linear' or $value == 'ease-in' or $value == 'ease-out' or $value == 'ease-in-out' or str-index($value, cubic-bezier)
10
10
  @return true
11
11
  @else
12
12
  @return null
@@ -14,8 +14,8 @@
14
14
  @return null
15
15
 
16
16
  @function delay($value)
17
- @if string($value) and str-slice($value, 1, 1) == '/' and str-slice($value, -1, -1) == 's'
18
- @return str-slice($value, 2)
17
+ @if list($value) and nth($value, 1) == delay
18
+ @return true
19
19
  @else
20
20
  @return null
21
21
 
@@ -5,33 +5,22 @@
5
5
  @return null
6
6
 
7
7
  @function background_position($value)
8
- @if list($value)
9
- @if str-slice(nth($value, 1), 1, 1) != '/'
10
- @if position(nth($value, 1)) or position(nth($value, 2))
11
- @return true
12
- @else if number(nth($value, 1)) or number(nth($value, 2))
13
- @return true
14
- @else
15
- @return null
16
- @else
17
- @return null
8
+ @if list($value) and nth($value, 1) != size
9
+ @return true
18
10
  @else
19
11
  @return null
20
12
 
21
13
  @function background_size($value)
22
14
  @if string($value)
23
15
  @if $value == 'auto' or $value == 'contain' or $value == 'cover'
24
- @return true
25
- @else if str-slice($value, 2) == 'auto' or $value == 'contain' or $value == 'cover'
26
- @return $value
16
+ @return unquote('/') $value
27
17
  @else
28
18
  @return null
29
19
  @else if list($value)
30
- @if str-slice(nth($value, 1), 1, 1) == '/'
31
- @if number(nth($value, 1)) or number(nth($value, 2))
32
- @return true
33
- @else
34
- @return null
20
+ @if nth($value, 1) == size
21
+ @return unquote('/') nth($value, 2) nth($value, 3)
22
+ @else
23
+ @return null
35
24
  @else
36
25
  @return null
37
26
 
@@ -52,3 +41,21 @@
52
41
  @return true
53
42
  @else
54
43
  @return null
44
+
45
+ @function background_gradient($value)
46
+ @if string($value)
47
+ @if str-index($value, linear-gradient) or str-index($value, radial-gradient) or str-index($value, repeating-)
48
+ @return true
49
+ @else
50
+ @return null
51
+ @else
52
+ @return null
53
+
54
+ @function background_clip($value)
55
+ @if string($value)
56
+ @if $value == 'border' or $value == 'padding' or $value == 'content' or $value == 'text'
57
+ @return true
58
+ @else
59
+ @return null
60
+ @else
61
+ @return null
@@ -1,3 +1,5 @@
1
+ $luma-threshold: 13 !default
2
+
1
3
  @function color($value)
2
4
  @if type-of($value) == color
3
5
  @return true
@@ -22,6 +24,15 @@
22
24
  @else
23
25
  @return null
24
26
 
27
+ // tint & shade
28
+ // http://bourbon.io/docs/#tint-shade
29
+
30
+ @function tint($color, $percent)
31
+ @return mix(white, $color, $percent)
32
+
33
+ @function shade($color, $percent)
34
+ @return mix(black, $color, $percent)
35
+
25
36
  // Adapted from: https://gist.github.com/voxpelli/6304812
26
37
  @function luma($color)
27
38
  $rgba: red($color), green($color), blue($color)
@@ -64,7 +75,7 @@
64
75
  @return null
65
76
 
66
77
  @function luma_contrast_color($color)
67
- @if luma_which($color) == bright
78
+ @if luma_bright($color)
68
79
  @return $luma-contrast-bright-color
69
80
  @else
70
81
  @return $luma-contrast-dark-color
@@ -0,0 +1,28 @@
1
+ // http://bourbon.io/docs/#timing-functions
2
+
3
+ $ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530)
4
+ $ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190)
5
+ $ease-in-quart: cubic-bezier(0.895, 0.030, 0.685, 0.220)
6
+ $ease-in-quint: cubic-bezier(0.755, 0.050, 0.855, 0.060)
7
+ $ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715)
8
+ $ease-in-expo: cubic-bezier(0.950, 0.050, 0.795, 0.035)
9
+ $ease-in-circ: cubic-bezier(0.600, 0.040, 0.980, 0.335)
10
+ $ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045)
11
+
12
+ $ease-out-quad: cubic-bezier(0.250, 0.460, 0.450, 0.940)
13
+ $ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000)
14
+ $ease-out-quart: cubic-bezier(0.165, 0.840, 0.440, 1.000)
15
+ $ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000)
16
+ $ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000)
17
+ $ease-out-expo: cubic-bezier(0.190, 1.000, 0.220, 1.000)
18
+ $ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000)
19
+ $ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275)
20
+
21
+ $ease-in-out-quad: cubic-bezier(0.455, 0.030, 0.515, 0.955)
22
+ $ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000)
23
+ $ease-in-out-quart: cubic-bezier(0.770, 0.000, 0.175, 1.000)
24
+ $ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000)
25
+ $ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950)
26
+ $ease-in-out-expo: cubic-bezier(1.000, 0.000, 0.000, 1.000)
27
+ $ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.150, 0.860)
28
+ $ease-in-out-back: cubic-bezier(0.680, -0.550, 0.265, 1.550)
@@ -1,6 +1,10 @@
1
1
  html
2
2
  -webkit-tap-highlight-color: rgba(0,0,0,0)
3
3
 
4
+ input[type="text"],
5
+ input[type="password"],
6
+ textarea,
7
+ select,
4
8
  [tabindex="-1"]:focus
5
9
  outline: none !important
6
10
 
@@ -26,3 +30,7 @@ input[type="search"]
26
30
 
27
31
  [hidden]
28
32
  display: none !important
33
+
34
+ ul,
35
+ ol
36
+ list-style: none
@@ -1,114 +1,218 @@
1
+ /*! sanitize.css v3.3.0 | CC0 1.0 Public Domain | github.com/10up/sanitize.css */
2
+
3
+ // Latest tested: Android 6, Chrome 48, Edge 13, Firefox 44, Internet Explorer 11, iOS 9, Opera 35, Safari 9, Windows Phone 8.1
4
+
1
5
  /*
2
6
  * Normalization
7
+ */
8
+
9
+ abbr[title]
10
+ text-decoration: underline // Chrome 48+, Edge 12+, Internet Explorer 11-, Safari 9+
11
+ text-decoration: underline dotted // Firefox 40+
3
12
 
4
13
  audio:not([controls])
5
- display: none // Chrome 44-, iOS 8+, Safari 9+
14
+ display: none // Chrome 44-, iOS 8+, Safari 9+
15
+
16
+ b,
17
+ strong
18
+ font-weight: bolder // Edge 12+, Safari 6.2+, and Chrome 18+
6
19
 
7
20
  button
8
- overflow: visible // Internet Explorer 11-
9
- -webkit-appearance: button // iOS 8+
21
+ -webkit-appearance: button // iOS 8+
22
+ overflow: visible // Internet Explorer 11-
23
+
24
+ button,
25
+ input
26
+ &::-moz-focus-inner
27
+ border: 0 // Firefox 4+
28
+ padding: 0 // Firefox 4+
29
+
30
+ &:-moz-focusring
31
+ outline: 1px dotted ButtonText // Firefox 4+
32
+
33
+ button,
34
+ select
35
+ text-transform: none // Firefox 40+, Internet Explorer 11-
10
36
 
11
37
  details
12
- display: block // Edge 12+, Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+
38
+ display: block // Edge 12+, Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+
39
+
40
+ hr
41
+ overflow: visible // Internet Explorer 11-, Edge 12+
13
42
 
14
43
  html
15
- -ms-overflow-style: -ms-autohiding-scrollbar // Edge 12+, Internet Explorer 11-
16
- overflow-y: scroll // All browsers without overlaying scrollbars
17
- -webkit-text-size-adjust: 100% // iOS 8+
44
+ -ms-overflow-style: -ms-autohiding-scrollbar // Edge 12+, Internet Explorer 11-
45
+ overflow-y: scroll // All browsers without overlaying scrollbars
46
+ -webkit-text-size-adjust: 100% // iOS 8+, Windows Phone 8.1+
18
47
 
19
48
  input
20
- -webkit-border-radius: 0 // iOS 8+
49
+ -webkit-border-radius: 0 // iOS 8+
21
50
 
22
- &[type="button"], &[type="reset"], &[type="submit"]
23
- -webkit-appearance: button // iOS 8+
51
+ &[type="button"],
52
+ &[type="reset"],
53
+ &[type="submit"]
54
+ -webkit-appearance: button // iOS 8+
24
55
 
25
- &[type="number"]
26
- width: auto // Firefox 36+
56
+ &[type="number"]
57
+ width: auto // Firefox 36+
27
58
 
28
- &[type="search"]
29
- -webkit-appearance: textfield // Chrome 45+, Safari 9+
59
+ &[type="search"]
60
+ -webkit-appearance: textfield // Chrome 45+, Safari 9+
30
61
 
31
- &::-webkit-search-cancel-button,
32
- &::-webkit-search-decoration
33
- -webkit-appearance: none // Chrome 45+, Safari 9+
62
+ &::-webkit-search-cancel-button,
63
+ &::-webkit-search-decoration
64
+ -webkit-appearance: none // Chrome 45+, Safari 9+
34
65
 
35
66
  main
36
- display: block // Android 4.3-, Internet Explorer 11-, Windows Phone 8.1+
67
+ display: block // Android 4.3-, Internet Explorer 11-, Windows Phone 8.1+
37
68
 
38
69
  pre
39
- overflow: auto // Internet Explorer 11-
70
+ overflow: auto // Internet Explorer 11-
40
71
 
41
72
  progress
42
- display: inline-block // Internet Explorer 11-, Windows Phone 8.1+
43
-
44
- small
45
- font-size: $small-font-size // All browsers
73
+ display: inline-block // Internet Explorer 11-, Windows Phone 8.1+
46
74
 
47
75
  summary
48
- display: block // Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+
76
+ display: block // Firefox 40+, Internet Explorer 11-, Windows Phone 8.1+
49
77
 
50
78
  svg:not(:root)
51
- overflow: hidden // Internet Explorer 11-
79
+ overflow: hidden // Internet Explorer 11-
52
80
 
53
81
  template
54
- display: none // Android 4.3-, Internet Explorer 11-, iOS 7-, Safari 7-, Windows Phone 8.1+
82
+ display: none // Android 4.3-, Internet Explorer 11-, iOS 7-, Safari 7-, Windows Phone 8.1+
55
83
 
56
84
  textarea
57
- overflow: auto // Edge 12+, Internet Explorer 11-
85
+ overflow: auto // Edge 12+, Internet Explorer 11-
58
86
 
59
87
  [hidden]
60
- display: none // Internet Explorer 10-
88
+ display: none // Internet Explorer 10-
61
89
 
62
90
  /*
63
91
  * Universal inheritance
92
+ */
64
93
 
65
94
  *,
66
95
  ::before,
67
96
  ::after
68
- box-sizing: inherit
97
+ box-sizing: inherit
69
98
 
70
99
  *
71
- font-size: inherit
72
- line-height: inherit
100
+ font-size: inherit
101
+ line-height: inherit
73
102
 
74
103
  ::before,
75
104
  ::after
76
- text-decoration: inherit
77
- vertical-align: inherit
105
+ text-decoration: inherit
106
+ vertical-align: inherit
107
+
108
+ button,
109
+ input,
110
+ select,
111
+ textarea
112
+ font-family: inherit
113
+ font-style: inherit
114
+ font-weight: inherit
115
+
116
+
78
117
 
79
118
  /*
80
119
  * Opinionated defaults
120
+ */
121
+
122
+ // specify the margin and padding of all elements
123
+
124
+ *
125
+ margin: 0
126
+ padding: 0
81
127
 
82
128
  // specify the border style and width of all elements
83
129
 
84
130
  *,
85
131
  ::before,
86
132
  ::after
87
- border-style: solid
88
- border-width: 0
133
+ border-style: solid
134
+ border-width: 0
135
+
136
+ // remove the tapping delay from clickable elements
137
+
138
+ a,
139
+ area,
140
+ button,
141
+ input,
142
+ label,
143
+ select,
144
+ textarea,
145
+ [tabindex]
146
+ touch-action: manipulation
147
+
148
+ // specify the standard appearance of selects
149
+
150
+ select
151
+ -moz-appearance: none // Firefox 40+
152
+ -webkit-appearance: none // Chrome 45+
153
+
154
+ &::-ms-expand
155
+ display: none // Edge 12+, Internet Explorer 11-
156
+
157
+ &::-ms-value
158
+ color: currentColor // Edge 12+, Internet Explorer 11-
159
+
160
+ // use current current as the default fill of svg elements
161
+
162
+ svg
163
+ fill: currentColor
164
+
165
+ // specify the progress cursor of updating elements
166
+
167
+ [aria-busy="true"]
168
+ cursor: progress
169
+
170
+ // specify the pointer cursor of trigger elements
171
+
172
+ [aria-controls]
173
+ cursor: pointer
174
+
175
+ // specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements
176
+
177
+ [aria-disabled]
178
+ cursor: default
179
+
180
+ // specify the style of visually hidden yet accessible elements
181
+
182
+ [hidden][aria-hidden="false"]
183
+ clip: rect(0 0 0 0)
184
+ display: inherit
185
+ position: absolute
186
+
187
+ &:focus
188
+ clip: auto
189
+
190
+
191
+
192
+ /*
193
+ * Configurable defaults
194
+ */
89
195
 
90
196
  // specify the core styles of all elements
91
197
 
92
198
  *
93
- background-repeat: $background-repeat
94
- margin: 0
95
- padding: 0
199
+ background-repeat: if(variable-exists(background-repeat), $background-repeat, no-repeat)
96
200
 
97
201
  // specify the root styles of the document
98
202
 
99
203
  $colon: '\:'
204
+ $slash: '/'
100
205
  #{$colon}root
101
- background-color: $root-background-color
102
- box-sizing: $root-box-sizing
103
- color: $root-color
104
- cursor: $root-cursor
105
- font: #{$root-font-size}/#{$root-line-height} $root-font-family
106
- text-rendering: $root-text-rendering
206
+ background-color: if(variable-exists(root-background-color), $root-background-color, #ffffff)
207
+ box-sizing: if(variable-exists(root-box-sizing), $root-box-sizing, border-box)
208
+ color: if(variable-exists(root-color), $root-color, #000000)
209
+ cursor: if(variable-exists(root-cursor), $root-cursor, default)
210
+ font: if(variable-exists(root-font-size), $root-font-size, 100%)#{$slash}#{if(variable-exists(root-line-height), $root-line-height, 1.5)} if(variable-exists(root-font-family), $root-font-family, sans-serif)
107
211
 
108
212
  // specify the text decoration of anchors
109
213
 
110
214
  a
111
- text-decoration: $anchor-text-decoration
215
+ text-decoration: if(variable-exists(anchor-text-decoration), $anchor-text-decoration, none)
112
216
 
113
217
  // specify the alignment of media elements
114
218
 
@@ -118,7 +222,7 @@ iframe,
118
222
  img,
119
223
  svg,
120
224
  video
121
- vertical-align: $media-element-vertical-align
225
+ vertical-align: if(variable-exists(media-element-vertical-align), $media-element-vertical-align, middle)
122
226
 
123
227
  // specify the background color of form elements
124
228
 
@@ -126,18 +230,8 @@ button,
126
230
  input,
127
231
  select,
128
232
  textarea
129
- background-color: $form-element-background-color
130
-
131
- // specify the inherited color and font of form elements
132
-
133
- button,
134
- input,
135
- select,
136
- textarea
137
- color: inherit
138
- font-family: inherit
139
- font-style: inherit
140
- font-weight: inherit
233
+ background-color: if(variable-exists(form-element-background-color), $form-element-background-color, transparent)
234
+ color: if(variable-exists(form-element-color), $form-element-color, inherit)
141
235
 
142
236
  // specify the minimum height of form elements
143
237
 
@@ -160,7 +254,7 @@ button,
160
254
  [type="week"],
161
255
  select,
162
256
  textarea
163
- min-height: $form-element-min-height
257
+ min-height: if(variable-exists(form-element-min-height), $form-element-min-height, 1.5em)
164
258
 
165
259
  // specify the font family of code elements
166
260
 
@@ -168,70 +262,38 @@ code,
168
262
  kbd,
169
263
  pre,
170
264
  samp
171
- font-family: $monospace-font-family, monospace
265
+ font-family: if(variable-exists(monospace-font-family), $monospace-font-family, monospace), monospace
172
266
 
173
267
  // specify the list style of nav lists
174
268
 
175
269
  nav ol,
176
270
  nav ul
177
- list-style: $nav-list-style
271
+ list-style: if(variable-exists(nav-list-style), $nav-list-style, none)
178
272
 
179
- // specify the standard appearance of selects
273
+ // specify the font size of small elements
180
274
 
181
- select
182
- -moz-appearance: none // Firefox 40+
183
- -webkit-appearance: none // Chrome 45+
184
-
185
- &::-ms-expand
186
- display: none // Edge 12+, Internet Explorer 11-
187
-
188
- &::-ms-value
189
- color: currentColor // Edge 12+, Internet Explorer 11-
275
+ small
276
+ font-size: if(variable-exists(small-font-size), $small-font-size, 75%)
190
277
 
191
278
  // specify the border styling of tables
192
279
 
193
280
  table
194
- border-collapse: $table-border-collapse
195
- border-spacing: $table-border-spacing
281
+ border-collapse: if(variable-exists(table-border-collapse), $table-border-collapse, collapse)
282
+ border-spacing: if(variable-exists(table-border-spacing), $table-border-spacing, 0)
196
283
 
197
284
  // specify the resizability of textareas
198
285
 
199
286
  textarea
200
- resize: $textarea-resize
287
+ resize: if(variable-exists(textarea-resize), $textarea-resize, vertical)
201
288
 
202
- // specify the background color, font color and drop shadow of text selections
289
+ // specify the background color, font color, and drop shadow of text selections
203
290
 
204
291
  ::-moz-selection
205
- background-color: $selection-background-color // required when declaring ::selection
206
- color: $selection-color
207
- text-shadow: $selection-text-shadow
292
+ background-color: if(variable-exists(selection-background-color), $selection-background-color, #b3d4fc) // required when declaring ::selection
293
+ color: if(variable-exists(selection-color), $selection-color, #ffffff)
294
+ text-shadow: if(variable-exists(selection-text-shadow), $selection-text-shadow, none)
208
295
 
209
296
  ::selection
210
- background-color: $selection-background-color // required when declaring ::selection
211
- color: $selection-color
212
- text-shadow: $selection-text-shadow
213
-
214
- // specify the progress cursor of updating elements
215
-
216
- [aria-busy="true"]
217
- cursor: progress
218
-
219
- // specify the pointer cursor of trigger elements
220
-
221
- [aria-controls]
222
- cursor: pointer
223
-
224
- // specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements
225
-
226
- [aria-disabled]
227
- cursor: default
228
-
229
- // specify the style of visually hidden yet accessible elements
230
-
231
- [hidden][aria-hidden="false"]
232
- clip: rect(0 0 0 0)
233
- display: inherit
234
- position: absolute
235
-
236
- &:focus
237
- clip: auto
297
+ background-color: if(variable-exists(selection-background-color), $selection-background-color, #b3d4fc) // required when declaring ::selection
298
+ color: if(variable-exists(selection-color), $selection-color, #ffffff)
299
+ text-shadow: if(variable-exists(selection-text-shadow), $selection-text-shadow, none)
@@ -1,28 +1,32 @@
1
- =animations($value1: null, $value2: null, $value3: null, $value4: null, $value5: null, $value6: null, $value7: null, $value8: null, $value9: null, $value10: null)
2
- $list: $value1 $value2 $value3 $value4 $value5 $value6 $value7 $value8 $value9 $value10
3
- $animation-names: ()
4
- $animation-durations: ()
5
- $animation-timing-functions: ()
6
- $animation-delays: ()
7
- $animation-iteration-counts: ()
8
- $animation-directions: ()
9
- $animation-fill-modes: ()
10
- $animation-play-states: ()
11
- @each $value in $list
12
- @for $i from 1 through length($value)
13
- $animation-names: append($animation-names, if(animation_name(nth($value, $i)), nth($value, $i), null), comma)
14
- $animation-durations: append($animation-durations, if(animation_duration(nth($value, $i)), nth($value, $i), null), comma)
15
- $animation-timing-functions: append($animation-timing-functions, if(animation_timing_function(nth($value, $i)), nth($value, $i), null), comma)
16
- $animation-delays: append($animation-delays, if(animation_delay(nth($value, $i)), animation_delay(nth($value, $i)), null), comma)
17
- $animation-iteration-counts: append($animation-iteration-counts, if(animation_iteration_count(nth($value, $i)), nth($value, $i), null), comma)
18
- $animation-directions: append($animation-directions, if(animation_direction(nth($value, $i)), nth($value, $i), null), comma)
19
- $animation-fill-modes: append($animation-fill-modes, if(animation_fill_mode(nth($value, $i)), nth($value, $i), null), comma)
20
- $animation-play-states: append($animation-play-states, if(animation_play_state(nth($value, $i)), nth($value, $i), null), comma)
21
- +animation-name($animation-names)
22
- +animation_duration($animation-durations)
23
- +animation_timing_function($animation-timing-functions)
24
- +animation-delay($animation-delays)
25
- +animation-iteration-count($animation-iteration-counts)
26
- +animation-direction($animation-directions)
27
- +animation-fill-mode($animation-fill-modes)
28
- +animation-play-state($animation-play-states)
1
+ =animation($values...)
2
+ $animation-values: ()
3
+ @each $value in $values
4
+ $animation-value: ()
5
+ $animation-name: ()
6
+ $animation-duration: ()
7
+ $animation-timing-function: ()
8
+ $animation-delay: ()
9
+ $animation-iteration-count: ()
10
+ $animation-direction: ()
11
+ $animation-fill-mode: ()
12
+ $animation-play-state: ()
13
+ @each $property in $value
14
+ @if animation_name($property)
15
+ $animation-name: $property
16
+ @else if animation_duration($property)
17
+ $animation-duration: $property
18
+ @else if animation_timing_function($property)
19
+ $animation-timing-function: $property
20
+ @else if animation_delay($property)
21
+ $animation-delay: nth($property, 2)
22
+ @else if animation_iteration_count($property)
23
+ $animation-iteration-count: $property
24
+ @else if animation_direction($property)
25
+ $animation-direction: $property
26
+ @else if animation_fill_mode($property)
27
+ $animation-fill-mode: $property
28
+ @else if animation_play_state($property)
29
+ $animation-play-state: $property
30
+ $animation-value: $animation-name $animation-duration $animation-delay $animation-iteration-count $animation-timing-function $animation-direction $animation-fill-mode $animation-play-state
31
+ $animation-values: append($animation-values, $animation-value, comma)
32
+ animation: $animation-values