materialize-sass 0.97.5 → 0.97.6

Sign up to get free protection for your applications and to get access to all the features.
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;