materialize-sass 0.95.3.3 → 0.95.3.4

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.
Files changed (51) hide show
  1. checksums.yaml +7 -0
  2. data/README.md +1 -1
  3. data/app/assets/fonts/roboto/Roboto-Bold.woff +0 -0
  4. data/app/assets/fonts/roboto/Roboto-Bold.woff2 +0 -0
  5. data/app/assets/fonts/roboto/Roboto-Light.woff +0 -0
  6. data/app/assets/fonts/roboto/Roboto-Light.woff2 +0 -0
  7. data/app/assets/fonts/roboto/Roboto-Medium.woff +0 -0
  8. data/app/assets/fonts/roboto/Roboto-Medium.woff2 +0 -0
  9. data/app/assets/fonts/roboto/Roboto-Regular.woff +0 -0
  10. data/app/assets/fonts/roboto/Roboto-Regular.woff2 +0 -0
  11. data/app/assets/fonts/roboto/Roboto-Thin.woff +0 -0
  12. data/app/assets/fonts/roboto/Roboto-Thin.woff2 +0 -0
  13. data/app/assets/javascripts/materialize-sprockets.js +2 -1
  14. data/app/assets/javascripts/materialize/buttons.js +4 -4
  15. data/app/assets/javascripts/materialize/collapsible.js +11 -14
  16. data/app/assets/javascripts/materialize/dropdown.js +5 -1
  17. data/app/assets/javascripts/materialize/forms.js +157 -151
  18. data/app/assets/javascripts/materialize/global.js +18 -0
  19. data/app/assets/javascripts/materialize/init.js +5 -1
  20. data/app/assets/javascripts/materialize/leanModal.js +0 -1
  21. data/app/assets/javascripts/materialize/pushpin.js +1 -14
  22. data/app/assets/javascripts/materialize/scrollFire.js +60 -21
  23. data/app/assets/javascripts/materialize/scrollspy.js +4 -7
  24. data/app/assets/javascripts/materialize/sideNav.js +58 -21
  25. data/app/assets/javascripts/materialize/slider.js +1 -1
  26. data/app/assets/javascripts/materialize/toasts.js +90 -73
  27. data/app/assets/javascripts/materialize/transitions.js +57 -61
  28. data/app/assets/javascripts/materialize/waves.js +6 -3
  29. data/app/assets/stylesheets/materialize/components/_buttons.scss +3 -3
  30. data/app/assets/stylesheets/materialize/components/_cards.scss +5 -7
  31. data/app/assets/stylesheets/materialize/components/_collapsible.scss +3 -11
  32. data/app/assets/stylesheets/materialize/components/_dropdown.scss +1 -1
  33. data/app/assets/stylesheets/materialize/components/_form.scss +178 -162
  34. data/app/assets/stylesheets/materialize/components/_global.scss +11 -10
  35. data/app/assets/stylesheets/materialize/components/_icons-material-design.scss +766 -2230
  36. data/app/assets/stylesheets/materialize/components/_materialbox.scss +2 -3
  37. data/app/assets/stylesheets/materialize/components/_modal.scss +3 -3
  38. data/app/assets/stylesheets/materialize/components/_navbar.scss +4 -7
  39. data/app/assets/stylesheets/materialize/components/_prefixer.scss +0 -40
  40. data/app/assets/stylesheets/materialize/components/_preloader.scss +2 -4
  41. data/app/assets/stylesheets/materialize/components/_sideNav.scss +9 -9
  42. data/app/assets/stylesheets/materialize/components/_slider.scss +6 -6
  43. data/app/assets/stylesheets/materialize/components/_table_of_contents.scss +1 -1
  44. data/app/assets/stylesheets/materialize/components/_tabs.scss +2 -2
  45. data/app/assets/stylesheets/materialize/components/_toast.scss +4 -5
  46. data/app/assets/stylesheets/materialize/components/_tooltip.scss +2 -2
  47. data/app/assets/stylesheets/materialize/components/date_picker/_default.date.scss +20 -47
  48. data/lib/materialize-sass.rb +75 -6
  49. data/lib/materialize-sass/engine.rb +13 -0
  50. data/lib/materialize-sass/version.rb +1 -1
  51. metadata +9 -15
@@ -1,35 +1,64 @@
1
1
  (function ($) {
2
- $(document).ready(function() {
3
-
4
-
5
- // Horizontal staggered list
6
- showStaggeredList = function(selector) {
7
- var time = 0;
8
- $(selector).find('li').velocity(
9
- { translateX: "-100px"},
10
- { duration: 0 });
11
-
12
- $(selector).find('li').each(function() {
13
- $(this).velocity(
14
- { opacity: "1", translateX: "0"},
15
- { duration: 800, delay: time, easing: [60, 10] });
16
- time += 120;
2
+ // Image transition function
3
+ Materialize.fadeInImage = function(selector){
4
+ var element = $(selector);
5
+ element.css({opacity: 0});
6
+ $(element).velocity({opacity: 1}, {
7
+ duration: 650,
8
+ queue: false,
9
+ easing: 'easeOutSine'
17
10
  });
18
- }
19
-
20
- // Hardcoded .staggered-list scrollFire
21
- var staggeredListOptions = [];
22
- $('ul.staggered-list').each(function (i) {
23
-
24
- var label = 'scrollFire-' + i;
25
- $(this).addClass(label);
26
- staggeredListOptions.push(
27
- {selector: 'ul.staggered-list.' + label,
28
- offset: 200,
29
- callback: 'showStaggeredList("ul.staggered-list.' + label + '")'});
11
+ $(element).velocity({opacity: 1}, {
12
+ duration: 1300,
13
+ queue: false,
14
+ easing: 'swing',
15
+ step: function(now, fx) {
16
+ fx.start = 100;
17
+ var grayscale_setting = now/100;
18
+ var brightness_setting = 150 - (100 - now)/1.75;
19
+
20
+ if (brightness_setting < 100) {
21
+ brightness_setting = 100;
22
+ }
23
+ if (now >= 0) {
24
+ $(this).css({
25
+ "-webkit-filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)",
26
+ "filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)"
27
+ });
28
+ }
29
+ }
30
+ });
31
+ };
32
+
33
+ // Horizontal staggered list
34
+ Materialize.showStaggeredList = function(selector) {
35
+ var time = 0;
36
+ $(selector).find('li').velocity(
37
+ { translateX: "-100px"},
38
+ { duration: 0 });
39
+
40
+ $(selector).find('li').each(function() {
41
+ $(this).velocity(
42
+ { opacity: "1", translateX: "0"},
43
+ { duration: 800, delay: time, easing: [60, 10] });
44
+ time += 120;
30
45
  });
31
- scrollFire(staggeredListOptions);
46
+ };
47
+
32
48
 
49
+ $(document).ready(function() {
50
+ // Hardcoded .staggered-list scrollFire
51
+ // var staggeredListOptions = [];
52
+ // $('ul.staggered-list').each(function (i) {
53
+
54
+ // var label = 'scrollFire-' + i;
55
+ // $(this).addClass(label);
56
+ // staggeredListOptions.push(
57
+ // {selector: 'ul.staggered-list.' + label,
58
+ // offset: 200,
59
+ // callback: 'showStaggeredList("ul.staggered-list.' + label + '")'});
60
+ // });
61
+ // scrollFire(staggeredListOptions);
33
62
 
34
63
  // HammerJS, Swipe navigation
35
64
 
@@ -112,38 +141,5 @@
112
141
  // { opacity: "1", scaleX: 1, scaleY: 1, translateX: 0},
113
142
  // { duration: 800, easing: [60, 10] });
114
143
  // });
115
-
116
-
117
- // Image transition function
118
- fadeInImage = function(selector){
119
- var element = $(selector);
120
- element.css({opacity: 0});
121
- $(element).velocity({opacity: 1}, {
122
- duration: 650,
123
- queue: false,
124
- easing: 'easeOutSine'
125
- });
126
- $(element).animate({opacity: 1}, {
127
- duration: 1300,
128
- queue: false,
129
- easing: 'swing',
130
- step: function(now, fx) {
131
- fx.start = 100;
132
- var grayscale_setting = now/100;
133
- var brightness_setting = 150 - (100 - now)/1.75;
134
-
135
- if (brightness_setting < 100) {
136
- brightness_setting = 100;
137
- }
138
- if (now >= 0) {
139
- $(this).css({
140
- "-webkit-filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)",
141
- "filter": "grayscale("+grayscale_setting+")" + "brightness("+brightness_setting+"%)"
142
- });
143
- }
144
- }
145
- });
146
- };
147
-
148
144
  });
149
145
  }( jQuery ));
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Waves v0.6.0
2
+ * Waves v0.6.4
3
3
  * http://fian.my.id/Waves
4
4
  *
5
5
  * Copyright 2014 Alfiana E. Sibuea and other contributors
@@ -259,7 +259,10 @@
259
259
  var target = e.target || e.srcElement;
260
260
 
261
261
  while (target.parentElement !== null) {
262
- if (target.className.indexOf('waves-effect') !== -1) {
262
+ if (!(target instanceof SVGElement) && target.className.indexOf('waves-effect') !== -1) {
263
+ element = target;
264
+ break;
265
+ } else if (target.classList.contains('waves-effect')) {
263
266
  element = target;
264
267
  break;
265
268
  }
@@ -332,4 +335,4 @@
332
335
  Waves.displayEffect();
333
336
  }, false);
334
337
 
335
- })(window);
338
+ })(window);
@@ -4,7 +4,7 @@
4
4
  height: $button-height;
5
5
  margin-bottom: 15px;
6
6
  padding: 0 2rem;
7
- @include border-radius(2px);
7
+ border-radius: 2px;
8
8
  line-height: $button-line-height;
9
9
  text-transform: uppercase;
10
10
  border: none;
@@ -60,7 +60,7 @@
60
60
  line-height: $button-floating-size;
61
61
  padding: 0;
62
62
  background-color: $button-color;
63
- @include border-radius(50%);
63
+ border-radius: 50%;
64
64
  @extend .z-depth-1;
65
65
  @include transition(.3s);
66
66
  cursor: pointer;
@@ -112,7 +112,7 @@ button.btn-floating {
112
112
  }
113
113
 
114
114
  a.btn-floating {
115
- @include opacity(0);
115
+ opacity: 0;
116
116
  }
117
117
  }
118
118
  }
@@ -3,7 +3,7 @@
3
3
  .card-panel {
4
4
  padding: $card-padding;
5
5
  margin: $element-top-margin 0 $element-bottom-margin 0;
6
- @include border-radius(2px);
6
+ border-radius: 2px;
7
7
  @extend .z-depth-1;
8
8
  background-color: $card-bg-color;
9
9
  }
@@ -13,8 +13,7 @@
13
13
  overflow: hidden;
14
14
  margin: $element-top-margin 0 $element-bottom-margin 0;
15
15
  background-color: $card-bg-color;
16
- @include box-sizing(border-box);
17
- @include border-radius(2px);
16
+ border-radius: 2px;
18
17
  @extend .z-depth-1;
19
18
 
20
19
 
@@ -94,7 +93,7 @@
94
93
 
95
94
  // Image background for content
96
95
  img {
97
- @include border-radius(2px 2px 0 0);
96
+ border-radius: 2px 2px 0 0;
98
97
  position: relative;
99
98
  left: 0;
100
99
  right: 0;
@@ -114,8 +113,8 @@
114
113
 
115
114
  .card-content {
116
115
  padding: $card-padding;
117
- @include border-radius(0 0 2px 2px);
118
- @include box-sizing(border-box);
116
+ border-radius: 0 0 2px 2px;
117
+
119
118
 
120
119
  p {
121
120
  margin: 0;
@@ -147,6 +146,5 @@
147
146
  display: block;
148
147
  }
149
148
 
150
- @include box-sizing(border-box);
151
149
  }
152
150
  }
@@ -5,9 +5,6 @@
5
5
  margin: $element-top-margin 0 $element-bottom-margin 0;
6
6
  @extend .z-depth-1;
7
7
 
8
- li {
9
- @include transition(.3s);
10
- }
11
8
  }
12
9
 
13
10
  .collapsible-header {
@@ -42,16 +39,12 @@
42
39
  }
43
40
  }
44
41
 
45
- li.active .collapsible-body {
46
-
47
- }
48
-
49
42
  // sideNav collapsible styling
50
- ul.side-nav {
43
+ .side-nav {
51
44
 
52
- ul.collapsible {
45
+ .collapsible {
53
46
  border: none;
54
- @include box-shadow(none);
47
+ box-shadow: none;
55
48
 
56
49
  li { padding: 0; }
57
50
  }
@@ -75,4 +68,3 @@ ul.side-nav {
75
68
 
76
69
  }
77
70
 
78
- li.no-padding { padding: 0 !important; }
@@ -3,7 +3,7 @@
3
3
  @extend .z-depth-1;
4
4
  position: absolute;
5
5
  background-color: #FFFFFF;
6
- margin: 0px;
6
+ margin: 0;
7
7
  min-width: 100px;
8
8
  z-index: 1000;
9
9
  max-height: 70%;
@@ -1,6 +1,6 @@
1
1
  /* Remove Focus Boxes */
2
2
  select:focus {
3
- outline: 1px solid color("materialize-red", "lighten-4");
3
+ outline: 1px solid lighten($secondary-color, 47%);
4
4
  }
5
5
  button:focus {
6
6
  outline: none;
@@ -16,6 +16,83 @@ label {
16
16
  Text Inputs + Textarea
17
17
  ****************************/
18
18
 
19
+ // Style Placeholders
20
+ ::-webkit-input-placeholder {
21
+ color: lighten($input-border-color, 20%);
22
+ }
23
+
24
+ :-moz-placeholder { /* Firefox 18- */
25
+ color: lighten($input-border-color, 20%);
26
+ }
27
+
28
+ ::-moz-placeholder { /* Firefox 19+ */
29
+ color: lighten($input-border-color, 20%);
30
+ }
31
+
32
+ :-ms-input-placeholder {
33
+ color: lighten($input-border-color, 20%);
34
+ }
35
+
36
+ // Text inputs
37
+ input[type=text],
38
+ input[type=password],
39
+ input[type=email],
40
+ input[type=url],
41
+ input[type=time],
42
+ input[type=date],
43
+ input[type=datetime-local],
44
+ input[type=tel],
45
+ input[type=number],
46
+ input[type=search],
47
+ textarea.materialize-textarea {
48
+
49
+ // General Styles
50
+ background-color: transparent;
51
+ border: none;
52
+ border-bottom: 1px solid $input-border-color;
53
+ outline: none;
54
+ height: 3rem;
55
+ width: 100%;
56
+
57
+ font-size: 1rem;
58
+ margin: 0 0 15px 0;
59
+ padding: 0;
60
+ box-shadow: none;
61
+ @include box-sizing(content-box);
62
+ transition: all .3s;
63
+
64
+
65
+ // Disabled input style
66
+ &:disabled, &[readonly="readonly"] {
67
+ color: $input-disabled-color;
68
+ border-bottom: 1px dotted $input-disabled-color;
69
+ }
70
+ // Disabled label style
71
+ &:disabled+label, &[readonly="readonly"]+label {
72
+ color: $input-disabled-color;
73
+ }
74
+ // Focused input style
75
+ &:focus:not([readonly]) {
76
+ border-bottom: 1px solid $input-focus-color;
77
+ box-shadow: 0 1px 0 0 $input-focus-color;
78
+ }
79
+ // Focused label style
80
+ &:focus:not([readonly])+label {
81
+ color: $input-focus-color;
82
+ }
83
+ // Valid Input Style
84
+ &.valid {
85
+ border-bottom: 1px solid $input-success-color;
86
+ box-shadow: 0 1px 0 0 $input-success-color;
87
+ }
88
+ // Invalid Input Style
89
+ &.invalid {
90
+ border-bottom: 1px solid $input-error-color;
91
+ box-shadow: 0 1px 0 0 $input-error-color;
92
+ }
93
+ }
94
+
95
+ // Styling for input field wrapper
19
96
  .input-field {
20
97
  position: relative;
21
98
  margin-top: 1rem;
@@ -34,43 +111,6 @@ label {
34
111
  @include transform(translateY(-140%));
35
112
  }
36
113
 
37
- input[type=text]:focus + label,
38
- input[type=password]:focus + label,
39
- input[type=email]:focus + label,
40
- input[type=url]:focus + label,
41
- input[type=date]:focus + label,
42
- input[type=tel]:focus + label,
43
- input[type=number]:focus + label,
44
- input[type=search]:focus + label,
45
- textarea:focus.materialize-textarea + label {
46
- color: $input-focus-color;
47
- }
48
-
49
- input[type=text].valid,
50
- input[type=password].valid,
51
- input[type=email].valid,
52
- input[type=url].valid,
53
- input[type=date].valid,
54
- input[type=tel].valid,
55
- input[type=number].valid,
56
- input[type=search].valid,
57
- textarea.materialize-textarea.valid {
58
- border-bottom: 1px solid $input-success-color;
59
- @include box-shadow(0 1px 0 0 $input-success-color);
60
- }
61
-
62
- input[type=text].invalid,
63
- input[type=password].invalid,
64
- input[type=email].invalid,
65
- input[type=url].invalid,
66
- input[type=date].invalid,
67
- input[type=tel].invalid,
68
- input[type=number].invalid,
69
- input[type=search].invalid,
70
- textarea.materialize-textarea.invalid {
71
- border-bottom: 1px solid $input-error-color;
72
- @include box-shadow(0 1px 0 0 $input-error-color);
73
- }
74
114
 
75
115
  // Prefix Icons
76
116
  .prefix {
@@ -110,51 +150,15 @@ textarea {
110
150
  width: 100%;
111
151
  height: 3rem;
112
152
  background-color: transparent;
113
- }
114
-
115
- input[type=text],
116
- input[type=password],
117
- input[type=email],
118
- input[type=url],
119
- input[type=date],
120
- input[type=tel],
121
- input[type=number],
122
- input[type=search],
123
- textarea.materialize-textarea {
124
- background-color: transparent;
125
- border: none;
126
- border-bottom: 1px solid $input-border-color;
127
- outline: none;
128
- height: 3rem;
129
- width: 100%;
130
153
 
131
- font-size: 1rem;
132
- margin: 0 0 15px 0;
133
- padding: 0;
134
- @include box-shadow(none);
135
- @include box-sizing(content-box);
136
- @include transition(.3s);
154
+ &.materialize-textarea {
155
+ overflow-y: hidden; /* prevents scroll bar flash */
156
+ padding: 1.6rem 0; /* prevents text jump on Enter keypress */
157
+ resize: none;
158
+ min-height: 3rem;
159
+ }
137
160
  }
138
161
 
139
- input[type=text]:focus,
140
- input[type=password]:focus,
141
- input[type=email]:focus,
142
- input[type=url]:focus,
143
- input[type=date]:focus,
144
- input[type=tel]:focus,
145
- input[type=number]:focus,
146
- input[type=search]:focus,
147
- textarea:focus.materialize-textarea {
148
- border-bottom: 1px solid $input-focus-color;
149
- @include box-shadow(0 1px 0 0 $input-focus-color);
150
- }
151
-
152
- textarea.materialize-textarea {
153
- overflow-y: hidden; /* prevents scroll bar flash */
154
- padding: 1.6rem 0; /* prevents text jump on Enter keypress */
155
- resize: none;
156
- min-height: 3rem;
157
- }
158
162
 
159
163
  // For textarea autoresize
160
164
  .hiddendiv {
@@ -198,8 +202,8 @@ textarea.materialize-textarea {
198
202
  [type="radio"] + label:after {
199
203
  content: '';
200
204
  position: absolute;
201
- left: 0px;
202
- top: 0px;
205
+ left: 0;
206
+ top: 0;
203
207
  margin: 4px;
204
208
  width: 16px;
205
209
  height: 16px;
@@ -270,9 +274,9 @@ form p {
270
274
  margin-bottom: 10px;
271
275
  text-align: left;
272
276
  }
273
- form p:last-child {
274
- margin-bottom: 0px;
275
- }
277
+ form p:last-child {
278
+ margin-bottom: 0;
279
+ }
276
280
 
277
281
  /* Remove default checkbox */
278
282
  [type="checkbox"]:not(:checked),
@@ -280,85 +284,92 @@ form p {
280
284
  position: absolute;
281
285
  left: -9999px;
282
286
  }
283
- [type="checkbox"]:not(:checked) + label,
284
- [type="checkbox"]:checked + label {
285
- position: relative;
286
- padding-left: 35px;
287
- cursor: pointer;
288
- display: inline-block;
289
- height: 25px;
290
- line-height: 25px;
291
- font-size: 1rem;
292
287
 
293
- -webkit-user-select: none; /* webkit (safari, chrome) browsers */
294
- -moz-user-select: none; /* mozilla browsers */
295
- -khtml-user-select: none; /* webkit (konqueror) browsers */
296
- -ms-user-select: none; /* IE10+ */
297
- }
298
288
 
299
- /* checkbox aspect */
300
- [type="checkbox"] + label:before {
301
- content: '';
302
- position: absolute;
303
- margin-top: 2px;
304
- left: 0;
305
- z-index: 0;
306
- @include border-radius(1px);
307
- @include transition(.2s);
308
- }
309
- /* Unchecked styles */
310
- [type="checkbox"]:not(:checked) + label:before {
311
- top: 0px;
312
- width: 18px; height: 18px;
313
- border: 2px solid $radio-empty-color;
314
- }
289
+ // Checkbox Styles
290
+ [type="checkbox"] {
291
+
292
+ // Text Label Style
293
+ + label {
294
+ position: relative;
295
+ padding-left: 35px;
296
+ cursor: pointer;
297
+ display: inline-block;
298
+ height: 25px;
299
+ line-height: 25px;
300
+ font-size: 1rem;
301
+
302
+ -webkit-user-select: none; /* webkit (safari, chrome) browsers */
303
+ -moz-user-select: none; /* mozilla browsers */
304
+ -khtml-user-select: none; /* webkit (konqueror) browsers */
305
+ -ms-user-select: none; /* IE10+ */
306
+
307
+ }
308
+
309
+ /* checkbox aspect */
310
+ + label:before {
311
+ content: '';
312
+ position: absolute;
313
+ top: 0;
314
+ left: 0;
315
+ width: 18px;
316
+ height: 18px;
317
+ z-index: 0;
318
+ border: 2px solid $radio-empty-color;
319
+ border-radius: 1px;
320
+ margin-top: 2px;
321
+ @include transition(.2s);
322
+ }
323
+
324
+ &:not(:checked):disabled + label:before {
325
+ border: none;
326
+ background-color: $input-disabled-color;
327
+ }
315
328
 
316
- /* Checked styles */
317
- [type="checkbox"]:checked + label:before {
318
- left: -3px;
319
- top: -4px;
320
- width: 12px; height: 22px;
321
- border-top: 2px solid transparent;
322
- border-left: 2px solid transparent;
323
- border-right: 2px solid $radio-fill-color;
324
- border-bottom: 2px solid $radio-fill-color;
325
- @include transform(rotate(40deg));
326
- -webkit-backface-visibility: hidden;
327
-
328
- @include transform-origin(100% 100%);
329
- }
330
-
331
- /* disabled checkbox */
332
- [type="checkbox"]:disabled:not(:checked) + label:before {
333
- top: 0;
334
- left: 0;
335
- box-shadow: none;
336
- background-color: $input-disabled-color;
337
- width: 18px; height: 18px;
338
- border: 2px solid $input-disabled-color;
339
- @include transform(rotate(0deg));
340
- }
341
-
342
- [type="checkbox"]:disabled:checked + label:before {
343
- left: -3px;
344
- top: -4px;
345
- width: 12px; height: 22px;
346
- border-top: 2px solid transparent;
347
- border-left: 2px solid transparent;
348
- border-right: 2px solid $input-disabled-color;
349
- border-bottom: 2px solid $input-disabled-color;
350
- @include transform(rotate(40deg));
351
- -webkit-backface-visibility: hidden;
352
-
353
- @include transform-origin(100% 100%);
354
- }
355
- [type="checkbox"]:disabled:checked + label {
356
- color: $input-disabled-color;
357
329
  }
358
- [type="checkbox"]:disabled:not(:checked) + label:hover:before {
359
- border-color: $input-disabled-color;
330
+
331
+ [type="checkbox"]:checked {
332
+ + label:before {
333
+ top: -4px;
334
+ left: -3px;
335
+ width: 12px; height: 22px;
336
+ border-top: 2px solid transparent;
337
+ border-left: 2px solid transparent;
338
+ border-right: 2px solid $radio-fill-color;
339
+ border-bottom: 2px solid $radio-fill-color;
340
+ @include transform(rotate(40deg));
341
+ -webkit-backface-visibility: hidden;
342
+ @include transform-origin(100% 100%);
343
+ }
344
+
345
+ &:disabled + label:before {
346
+ border-right: 2px solid $input-disabled-color;
347
+ border-bottom: 2px solid $input-disabled-color;
348
+ }
349
+
360
350
  }
361
351
 
352
+ /* Indeterminate checkbox */
353
+ [type="checkbox"]:indeterminate {
354
+ +label:before {
355
+ left: -10px;
356
+ top: -11px;
357
+ width: 10px; height: 22px;
358
+ border-top: none;
359
+ border-left: none;
360
+ border-right: 2px solid $radio-fill-color;
361
+ border-bottom: none;
362
+ @include transform(rotate(90deg));
363
+ -webkit-backface-visibility: hidden;
364
+ @include transform-origin(100% 100%);
365
+ }
366
+
367
+ // Disabled indeterminate
368
+ &:disabled + label:before {
369
+ border-right: 2px solid $input-disabled-color;
370
+ background-color: transparent;
371
+ }
372
+ }
362
373
 
363
374
  /***************
364
375
  Switch
@@ -367,6 +378,7 @@ form p {
367
378
  .switch * {
368
379
  -webkit-user-select: none;
369
380
  -moz-user-select: none;
381
+ -khtml-user-select: none;
370
382
  -ms-user-select: none;
371
383
  }
372
384
  .switch label {
@@ -394,7 +406,7 @@ form p {
394
406
  margin-right: 10px;
395
407
  transition: background 0.3s ease;
396
408
  vertical-align: middle;
397
- margin: 0px 16px;
409
+ margin: 0 16px;
398
410
  }
399
411
  .switch label .lever:after {
400
412
  content: "";
@@ -448,7 +460,7 @@ input[type=checkbox]:not(:disabled) ~ .lever:active:after {
448
460
  input.select-dropdown {
449
461
  position: relative;
450
462
  cursor: pointer;
451
- color: #444;
463
+ // color: #444;
452
464
  background-color: transparent;
453
465
  border: none;
454
466
  border-bottom: 1px solid $input-border-color;
@@ -462,10 +474,14 @@ input[type=checkbox]:not(:disabled) ~ .lever:active:after {
462
474
  display: block;
463
475
  }
464
476
  .mdi-navigation-arrow-drop-down {
477
+ color: initial;
465
478
  position: absolute;
466
479
  right: 0;
467
480
  top: 0;
468
481
  font-size: 23px;
482
+ &.disabled {
483
+ color: $input-disabled-color;
484
+ }
469
485
  }
470
486
  }
471
487
 
@@ -571,7 +587,7 @@ input[type=range] + .thumb {
571
587
  width: 30px;
572
588
  text-align: center;
573
589
  color: $radio-fill-color;
574
- font-size: 0px;
590
+ font-size: 0;
575
591
  @include transform(rotate(45deg));
576
592
  }
577
593
 
@@ -693,7 +709,7 @@ input[type=range]:focus::-ms-fill-upper {
693
709
  ****************************/
694
710
 
695
711
  select {
696
- background-color: #fffafa;
712
+ background-color: rgba(255, 255, 255, 0.90);
697
713
  width: 100%;
698
714
  padding: 5px;
699
715
  border: 1px solid #f2f2f2;