materialize-sass 0.97.5 → 0.97.6

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 (52) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/materialize.js +230 -141
  3. data/app/assets/javascripts/materialize.min.js +6 -6
  4. data/app/assets/javascripts/materialize/character_counter.js +20 -7
  5. data/app/assets/javascripts/materialize/collapsible.js +1 -1
  6. data/app/assets/javascripts/materialize/date_picker/picker.js +5 -5
  7. data/app/assets/javascripts/materialize/dropdown.js +12 -3
  8. data/app/assets/javascripts/materialize/extras/nouislider.js +1 -1
  9. data/app/assets/javascripts/materialize/extras/nouislider.min.js +0 -5
  10. data/app/assets/javascripts/materialize/forms.js +6 -5
  11. data/app/assets/javascripts/materialize/init.js +26 -9
  12. data/app/assets/javascripts/materialize/initial.js +2 -2
  13. data/app/assets/javascripts/materialize/leanModal.js +19 -6
  14. data/app/assets/javascripts/materialize/materialbox.js +9 -9
  15. data/app/assets/javascripts/materialize/pushpin.js +48 -53
  16. data/app/assets/javascripts/materialize/scrollFire.js +7 -3
  17. data/app/assets/javascripts/materialize/scrollspy.js +6 -6
  18. data/app/assets/javascripts/materialize/sideNav.js +66 -37
  19. data/app/assets/javascripts/materialize/slider.js +2 -2
  20. data/app/assets/javascripts/materialize/tabs.js +12 -6
  21. data/app/assets/stylesheets/materialize.scss +1 -1
  22. data/app/assets/stylesheets/materialize/components/_buttons.scss +49 -33
  23. data/app/assets/stylesheets/materialize/components/_cards.scss +9 -5
  24. data/app/assets/stylesheets/materialize/components/_color.scss +21 -21
  25. data/app/assets/stylesheets/materialize/components/_global.scss +27 -11
  26. data/app/assets/stylesheets/materialize/components/_icons-material-design.scss +0 -3258
  27. data/app/assets/stylesheets/materialize/components/_materialbox.scss +1 -1
  28. data/app/assets/stylesheets/materialize/components/_navbar.scss +1 -1
  29. data/app/assets/stylesheets/materialize/components/_normalize.scss +9 -12
  30. data/app/assets/stylesheets/materialize/components/_sideNav.scss +16 -11
  31. data/app/assets/stylesheets/materialize/components/_tooltip.scss +1 -0
  32. data/app/assets/stylesheets/materialize/components/_variables.scss +181 -34
  33. data/app/assets/stylesheets/materialize/components/date_picker/_default.date.scss +1 -1
  34. data/app/assets/stylesheets/materialize/components/date_picker/_default.scss +2 -2
  35. data/app/assets/stylesheets/materialize/components/forms/_checkboxes.scss +220 -0
  36. data/app/assets/stylesheets/materialize/components/forms/_file-input.scss +38 -0
  37. data/app/assets/stylesheets/materialize/components/forms/_forms.scss +22 -0
  38. data/app/assets/stylesheets/materialize/components/forms/_input-fields.scss +254 -0
  39. data/app/assets/stylesheets/materialize/components/forms/_radio-buttons.scss +119 -0
  40. data/app/assets/stylesheets/materialize/components/forms/_range.scss +159 -0
  41. data/app/assets/stylesheets/materialize/components/forms/_select.scss +116 -0
  42. data/app/assets/stylesheets/materialize/components/forms/_switches.scss +78 -0
  43. data/app/assets/stylesheets/materialize/extras/nouislider.css +2 -1
  44. data/lib/materialize-sass/version.rb +1 -1
  45. metadata +10 -9
  46. data/app/assets/fonts/material-design-icons/LICENSE.txt +0 -428
  47. data/app/assets/fonts/material-design-icons/Material-Design-Icons.eot +0 -0
  48. data/app/assets/fonts/material-design-icons/Material-Design-Icons.svg +0 -769
  49. data/app/assets/fonts/material-design-icons/Material-Design-Icons.ttf +0 -0
  50. data/app/assets/fonts/material-design-icons/Material-Design-Icons.woff +0 -0
  51. data/app/assets/fonts/material-design-icons/Material-Design-Icons.woff2 +0 -0
  52. data/app/assets/stylesheets/materialize/components/_form.scss +0 -954
@@ -23,7 +23,7 @@
23
23
  right: 0;
24
24
  bottom: 0;
25
25
  background-color: #292929;
26
- z-index: 999;
26
+ z-index: 1000;
27
27
 
28
28
  will-change: opacity;
29
29
  }
@@ -96,7 +96,7 @@ nav {
96
96
  transition: background-color .3s;
97
97
  font-size: 1rem;
98
98
  color: $navbar-font-color;
99
- display: block;
99
+ display: inline-block;
100
100
  padding: 0 15px;
101
101
  cursor: pointer;
102
102
 
@@ -1,9 +1,9 @@
1
- /*! normalize.css v3.0.2 | MIT License | git.io/normalize */
1
+ /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
2
2
 
3
3
  /**
4
4
  * 1. Set default font family to sans-serif.
5
- * 2. Prevent iOS text size adjust after orientation change, without disabling
6
- * user zoom.
5
+ * 2. Prevent iOS and IE text size adjust after device orientation change,
6
+ * without disabling user zoom.
7
7
  */
8
8
 
9
9
  html {
@@ -71,7 +71,7 @@ audio:not([controls]) {
71
71
 
72
72
  /**
73
73
  * Address `[hidden]` styling not present in IE 8/9/10.
74
- * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
74
+ * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
75
75
  */
76
76
 
77
77
  [hidden],
@@ -91,7 +91,8 @@ a {
91
91
  }
92
92
 
93
93
  /**
94
- * Improve readability when focused and also mouse hovered in all browsers.
94
+ * Improve readability of focused elements when they are also in an
95
+ * active/hover state.
95
96
  */
96
97
 
97
98
  a:active,
@@ -209,7 +210,6 @@ figure {
209
210
  */
210
211
 
211
212
  hr {
212
- -moz-box-sizing: content-box;
213
213
  box-sizing: content-box;
214
214
  height: 0;
215
215
  }
@@ -287,8 +287,8 @@ select {
287
287
  * `input` and others.
288
288
  */
289
289
 
290
- /* 1 */ html input[type="button"],
291
290
  button,
291
+ html input[type="button"], /* 1 */
292
292
  input[type="reset"],
293
293
  input[type="submit"] {
294
294
  -webkit-appearance: button; /* 2 */
@@ -350,15 +350,12 @@ input[type="number"]::-webkit-outer-spin-button {
350
350
 
351
351
  /**
352
352
  * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
353
- * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
354
- * (include `-moz` to future-proof).
353
+ * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
355
354
  */
356
355
 
357
356
  input[type="search"] {
358
357
  -webkit-appearance: textfield; /* 1 */
359
- -moz-box-sizing: content-box;
360
- -webkit-box-sizing: content-box; /* 2 */
361
- box-sizing: content-box;
358
+ box-sizing: content-box; /* 2 */
362
359
  }
363
360
 
364
361
  /**
@@ -1,25 +1,30 @@
1
1
  .side-nav {
2
2
  position: fixed;
3
3
  width: 240px;
4
- left: -105%;
4
+ left: 0;
5
5
  top: 0;
6
6
  margin: 0;
7
+ transform: translateX(-100%);
7
8
  height: 100%;
8
9
  height: calc(100% + 60px);
9
10
  height: -moz-calc(100%); //Temporary Firefox Fix
10
11
  padding-bottom: 60px;
11
12
  background-color: $sidenav-bg-color;
12
13
  z-index: 999;
14
+ backface-visibility: hidden;
13
15
  overflow-y: auto;
16
+ will-change: transform;
17
+ backface-visibility: hidden;
18
+ transform: translateX(-105%);
14
19
 
15
20
  @extend .z-depth-1;
16
- will-change: left;
17
21
 
18
22
  // Right Align
19
23
  &.right-aligned {
20
- will-change: right;
21
- right: -105%;
24
+ right: 0;
25
+ transform: translateX(105%);
22
26
  left: auto;
27
+ transform: translateX(100%);
23
28
  }
24
29
 
25
30
  .collapsible {
@@ -50,12 +55,12 @@
50
55
 
51
56
  &.btn,
52
57
  &.btn-large,
53
- &.btn-floating { color: $button-color-raised; }
54
- &.btn-flat { color: $button-color-flat; }
58
+ &.btn-floating { color: $button-raised-color; }
59
+ &.btn-flat { color: $button-flat-color; }
55
60
 
56
61
  &.btn:hover,
57
- &.btn-large:hover { background-color: lighten($button-color, 5%); }
58
- &.btn-floating:hover { background-color: $button-color; }
62
+ &.btn-large:hover { background-color: lighten($button-raised-background, 5%); }
63
+ &.btn-floating:hover { background-color: $button-raised-background; }
59
64
  }
60
65
  }
61
66
 
@@ -83,6 +88,7 @@
83
88
  // Fixed side-nav shown
84
89
  .side-nav.fixed {
85
90
  left: 0;
91
+ transform: translateX(0);
86
92
  position: fixed;
87
93
 
88
94
  // Right Align
@@ -95,11 +101,10 @@
95
101
  // Fixed sideNav hide on smaller
96
102
  @media #{$medium-and-down} {
97
103
  .side-nav.fixed {
98
- left: -105%;
104
+ transform: translateX(-105%);
99
105
 
100
106
  &.right-aligned {
101
- right: -105%;
102
- left: auto;
107
+ transform: translateX(105%);
103
108
  }
104
109
  }
105
110
  }
@@ -15,6 +15,7 @@
15
15
  overflow: hidden;
16
16
  left:0;
17
17
  top:0;
18
+ pointer-events: none;
18
19
  will-change: top, left;
19
20
  }
20
21
 
@@ -1,4 +1,38 @@
1
- /*** Colors ***/
1
+ /* ==========================================================================
2
+ Materialize variables
3
+ ========================================================================== */
4
+ /**
5
+ * Table of Contents:
6
+ *
7
+ * 1. Colors
8
+ * 2. Badges
9
+ * 3. Buttons
10
+ * 4. Cards
11
+ * 5. Collapsible
12
+ * 6. Chips
13
+ * 7. Date Picker
14
+ * 8. Dropdown
15
+ * 10. Forms
16
+ * 11. Global
17
+ * 12. Grid
18
+ * 13. Navigation Bar
19
+ * 14. Side Navigation
20
+ * 15. Photo Slider
21
+ * 16. Spinners | Loaders
22
+ * 17. Tabs
23
+ * 18. Tables
24
+ * 19. Toasts
25
+ * 20. Typography
26
+ * 21. Footer
27
+ * 22. Flow Text
28
+ * 23. Collections
29
+ * 24. Progress Bar
30
+ */
31
+
32
+
33
+ /* 1. Colors
34
+ ========================================================================== */
35
+
2
36
  $primary-color: color("materialize-red", "lighten-2") !default;
3
37
  $primary-color-light: lighten($primary-color, 15%) !default;
4
38
  $primary-color-dark: darken($primary-color, 15%) !default;
@@ -8,36 +42,76 @@ $success-color: color("green", "base") !default;
8
42
  $error-color: color("red", "base") !default;
9
43
  $link-color: color("light-blue", "darken-1") !default;
10
44
 
11
- /*** Badges ***/
45
+
46
+ /* 2. Badges
47
+ ========================================================================== */
48
+
12
49
  $badge-bg-color: $secondary-color !default;
13
50
 
14
- /*** Buttons ***/
15
- $button-bg-color-disabled: #DFDFDF !default;
16
- $button-color: $secondary-color !default;
17
- $button-color-disabled: #9F9F9F !default;
18
- $button-color-flat: #343434 !default;
19
- $button-color-raised: #fff !default;
20
- $button-floating-size: 37px !default;
51
+
52
+ /* 3. Buttons
53
+ ========================================================================== */
54
+
55
+ // Shared styles
56
+ $button-border: none !default;
57
+ $button-background-focus: lighten($secondary-color, 4%) !default;
58
+ $button-font-size: 1.3rem !default;
21
59
  $button-height: 36px !default;
22
- $button-font-size-shared: 1.3rem !default;
60
+ $button-padding: 0 2rem !default;
61
+ $button-radius: 2px !default;
62
+
63
+ // Disabled styles
64
+ $button-disabled-background: #DFDFDF !default;
65
+ $button-disabled-color: #9F9F9F !default;
66
+
67
+ // Raised buttons
68
+ $button-raised-background: $secondary-color !default;
69
+ $button-raised-background-hover: lighten($button-raised-background, 5%) !default;
70
+ $button-raised-color: #fff !default;
71
+
72
+ // Large buttons
23
73
  $button-large-icon-font-size: 1.6rem !default;
24
- $button-line-height: 36px !default;
74
+ $button-large-height: $button-height * 1.5 !default;
75
+
76
+ // Flat buttons
77
+ $button-flat-color: #343434 !default;
78
+ $button-flat-disabled-color: lighten(#999, 10%) !default;
79
+
80
+ // Floating buttons
81
+ $button-floating-background: $secondary-color !default;
82
+ $button-floating-background-hover: $button-floating-background !default;
83
+ $button-floating-color: #fff !default;
84
+ $button-floating-size: 37px !default;
85
+ $button-floating-large-size: $button-floating-size * 1.5 !default;
86
+ $button-floating-radius: 50% !default;
87
+
88
+
89
+ /* 4. Cards
90
+ ========================================================================== */
25
91
 
26
- /*** Cards ***/
27
92
  $card-padding: 20px !default;
28
93
  $card-bg-color: #fff !default;
29
94
  $card-link-color: color("orange", "accent-2") !default;
30
95
  $card-link-color-light: lighten($card-link-color, 20%) !default;
31
96
 
32
- /*** Collapsible ***/
97
+
98
+ /* 5. Collapsible
99
+ ========================================================================== */
100
+
33
101
  $collapsible-height: 3rem !default;
34
102
  $collapsible-header-color: #fff !default;
35
103
  $collapsible-border-color: #ddd !default;
36
104
 
37
- /*** Chips ***/
105
+
106
+ /* 6. Chips
107
+ ========================================================================== */
108
+
38
109
  $chip-bg-color: #e4e4e4 !default;
39
110
 
40
- /*** Date Picker ***/
111
+
112
+ /* 7. Date Picker
113
+ ========================================================================== */
114
+
41
115
  $datepicker-weekday-bg: darken($secondary_color, 7%) !default;
42
116
  $datepicker-date-bg: $secondary_color !default;
43
117
  $datepicker-year: rgba(255, 255, 255, .4) !default;
@@ -45,39 +119,73 @@ $datepicker-focus: rgba(0,0,0, .05) !default;
45
119
  $datepicker-selected: $secondary-color !default;
46
120
  $datepicker-selected-outfocus: desaturate(lighten($secondary-color, 35%), 15%) !default;
47
121
 
48
- /*** Dropdown ***/
122
+
123
+ /* 8. Dropdown
124
+ ========================================================================== */
125
+
49
126
  $dropdown-bg-color: #fff !default;
50
127
  $dropdown-hover-bg-color: #eee !default;
51
128
  $dropdown-color: $secondary-color !default;
52
129
  $dropdown-item-height: 50px !default;
53
130
 
54
- /*** Fonts ***/
131
+
132
+ /* 9. Fonts
133
+ ========================================================================== */
134
+
55
135
  $roboto-font-path: "roboto/" !default;
56
- $icons-font-path: "material-design-icons/" !default;
57
136
 
58
- /*** Forms ***/
137
+
138
+ /* 10. Forms
139
+ ========================================================================== */
140
+
59
141
  // Text Inputs + Textarea
142
+ $input-height: 3rem !default;
60
143
  $input-border-color: color("grey", "base") !default;
61
- $input-bg-color: #fff !default;
144
+ $input-border: 1px solid $input-border-color !default;
145
+ $input-background: #fff !default;
62
146
  $input-error-color: $error-color !default;
63
147
  $input-success-color: $success-color !default;
64
148
  $input-focus-color: $secondary-color !default;
149
+ $input-font-size: 1rem !default;
150
+ $input-margin: 0 0 15px 0 !default;
151
+ $input-padding: 0 !default;
152
+ $input-transition: all .3s !default;
65
153
  $label-font-size: .8rem !default;
66
154
  $input-disabled-color: rgba(0,0,0, .26) !default;
67
155
  $input-disabled-solid-color: #BDBDBD !default;
156
+ $input-disabled-border: 1px dotted $input-disabled-color !default;
157
+ $input-invalid-border: 1px solid $input-error-color !default;
158
+ $placeholder-text-color: lighten($input-border-color, 20%) !default;
68
159
 
69
160
  // Radio Buttons
70
161
  $radio-fill-color: $secondary-color !default;
71
162
  $radio-empty-color: #5a5a5a !default;
163
+ $radio-border: 2px solid $radio-fill-color !default;
164
+
165
+ // Range
166
+ $range-height: 14px !default;
167
+ $range-width: 14px !default;
168
+ $track-height: 3px !default;
169
+
170
+ // Select
171
+ $select-border: 1px solid #f2f2f2 !default;
172
+ $select-background: rgba(255, 255, 255, 0.90) !default;
173
+ $select-focus: 1px solid lighten($secondary-color, 47%) !default;
174
+ $select-padding: 5px !default;
175
+ $select-radius: 2px !default;
176
+ $select-disabled-color: rgba(0,0,0,.3) !default;
72
177
 
73
178
  // Switches
74
179
  $switch-bg-color: $secondary-color !default;
75
180
  $switch-checked-lever-bg: desaturate(lighten($secondary-color, 25%), 25%) !default;
76
181
  $switch-unchecked-bg: #F1F1F1 !default;
77
182
  $switch-unchecked-lever-bg: #818181 !default;
183
+ $switch-radius: 15px !default;
184
+
78
185
 
186
+ /* 11. Global
187
+ ========================================================================== */
79
188
 
80
- /*** Global ***/
81
189
  // Media Query Ranges
82
190
  $small-screen-up: 601px !default;
83
191
  $medium-screen-up: 993px !default;
@@ -92,47 +200,74 @@ $small-and-down: "only screen and (max-width : #{$small-screen})" !default;
92
200
  $medium-and-down: "only screen and (max-width : #{$medium-screen})" !default;
93
201
  $medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;
94
202
 
95
- // Grid Variables
203
+
204
+ /* 12. Grid
205
+ ========================================================================== */
206
+
96
207
  $num-cols: 12 !default;
97
208
  $gutter-width: 1.5rem !default;
98
209
  $element-top-margin: $gutter-width/3 !default;
99
210
  $element-bottom-margin: ($gutter-width*2)/3 !default;
100
211
 
101
- /*** Navbar ***/
212
+
213
+ /* 13. Navigation Bar
214
+ ========================================================================== */
215
+
102
216
  $navbar-height: 64px !default;
103
217
  $navbar-height-mobile: 56px !default;
104
218
  $navbar-font-color: #fff !default;
105
219
  $navbar-brand-font-size: 2.1rem !default;
106
220
 
107
- /*** SideNav ***/
221
+
222
+ /* 14. Side Navigation
223
+ ========================================================================== */
224
+
108
225
  $sidenav-font-color: #444 !default;
109
226
  $sidenav-bg-color: #fff !default;
110
227
  $sidenav-padding-right: 30px !default;
111
228
  $sidenav-item-height: 64px !default;
112
229
 
113
- /*** Photo Slider ***/
230
+
231
+ /* 15. Photo Slider
232
+ ========================================================================== */
233
+
114
234
  $slider-bg-color: color('grey', 'base') !default;
115
235
  $slider-bg-color-light: color('grey', 'lighten-2') !default;
116
236
  $slider-indicator-color: color('green', 'base') !default;
117
237
 
118
- /*** Spinners | Loaders ***/
238
+
239
+ /* 16. Spinners | Loaders
240
+ ========================================================================== */
241
+
119
242
  $spinner-default-color: $secondary-color !default;
120
243
 
121
- /*** Tabs ***/
244
+
245
+ /* 17. Tabs
246
+ ========================================================================== */
247
+
122
248
  $tabs-underline-color: $primary-color-light !default;
123
249
  $tabs-text-color: $primary-color !default;
124
250
  $tabs-bg-color: #fff !default;
125
251
 
126
- /*** Tables ***/
252
+
253
+ /* 18. Tables
254
+ ========================================================================== */
255
+
127
256
  $table-border-color: #d0d0d0 !default;
128
257
  $table-striped-color: #f2f2f2 !default;
129
258
 
130
- /*** Toasts ***/
259
+
260
+ /* 19. Toasts
261
+ ========================================================================== */
262
+
131
263
  $toast-height: 48px !default;
132
264
  $toast-color: #323232 !default;
133
265
  $toast-text-color: #fff !default;
134
266
 
135
- /*** Typography ***/
267
+
268
+ /* 20. Typography
269
+ ========================================================================== */
270
+
136
271
  $off-black: rgba(0, 0, 0, 0.87) !default;
137
272
  // Header Styles
138
273
  $h1-fontsize: 4.2rem !default;
@@ -142,15 +277,24 @@ $h4-fontsize: 2.28rem !default;
142
277
  $h5-fontsize: 1.64rem !default;
143
278
  $h6-fontsize: 1rem !default;
144
279
 
145
- // Footer
280
+
281
+ /* 21. Footer
282
+ ========================================================================== */
283
+
146
284
  $footer-bg-color: $primary-color !default;
147
285
 
148
- // Flowtext
286
+
287
+ /* 22. Flow Text
288
+ ========================================================================== */
289
+
149
290
  $range : $large-screen - $small-screen !default;
150
291
  $intervals: 20 !default;
151
292
  $interval-size: $range / $intervals !default;
152
293
 
153
- /*** Collections ***/
294
+
295
+ /* 23. Collections
296
+ ========================================================================== */
297
+
154
298
  $collection-border-color: #e0e0e0 !default;
155
299
  $collection-bg-color: #fff !default;
156
300
  $collection-active-bg-color: $secondary-color !default;
@@ -158,5 +302,8 @@ $collection-active-color: lighten($secondary-color, 55%) !default;
158
302
  $collection-hover-bg-color: #ddd !default;
159
303
  $collection-link-color: $secondary-color !default;
160
304
 
161
- /* Progress Bar */
305
+
306
+ /* 24. Progress Bar
307
+ ========================================================================== */
308
+
162
309
  $progress-bar-color: $secondary-color !default;