mtl 1.1.0 → 1.1.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (44) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/mtl/dropdown.coffee +1 -1
  3. data/app/assets/stylesheets/mtl/extend/_chips.scss +20 -0
  4. data/app/assets/stylesheets/mtl/extend/_side-nav.scss +4 -2
  5. data/lib/generators/mtl/templates/_variables.scss +5 -0
  6. data/lib/mtl/version.rb +2 -2
  7. data/mtl.gemspec +11 -0
  8. data/package.json +1 -1
  9. data/vendor/assets/javascripts/materialize/animation.js +8 -9
  10. data/vendor/assets/javascripts/materialize/carousel.js +51 -24
  11. data/vendor/assets/javascripts/materialize/character_counter.js +2 -2
  12. data/vendor/assets/javascripts/materialize/chips.js +40 -11
  13. data/vendor/assets/javascripts/materialize/dropdown.js +12 -12
  14. data/vendor/assets/javascripts/materialize/forms.js +131 -35
  15. data/vendor/assets/javascripts/materialize/global.js +55 -0
  16. data/vendor/assets/javascripts/materialize/init.js +40 -3
  17. data/vendor/assets/javascripts/materialize/materialbox.js +93 -77
  18. data/vendor/assets/javascripts/materialize/modal.js +12 -12
  19. data/vendor/assets/javascripts/materialize/parallax.js +48 -48
  20. data/vendor/assets/javascripts/materialize/scrollFire.js +40 -37
  21. data/vendor/assets/javascripts/materialize/scrollspy.js +2 -53
  22. data/vendor/assets/javascripts/materialize/sideNav.js +46 -40
  23. data/vendor/assets/javascripts/materialize/slider.js +15 -12
  24. data/vendor/assets/javascripts/materialize/tabs.js +104 -35
  25. data/vendor/assets/javascripts/materialize/toasts.js +122 -123
  26. data/vendor/assets/javascripts/materialize/tooltip.js +15 -13
  27. data/vendor/assets/javascripts/materialize/transitions.js +24 -24
  28. data/vendor/assets/stylesheets/materialize/_badges.scss +46 -0
  29. data/vendor/assets/stylesheets/materialize/_buttons.scss +29 -17
  30. data/vendor/assets/stylesheets/materialize/_cards.scss +9 -3
  31. data/vendor/assets/stylesheets/materialize/_carousel.scss +1 -1
  32. data/vendor/assets/stylesheets/materialize/_collapsible.scss +3 -7
  33. data/vendor/assets/stylesheets/materialize/_global.scss +5 -61
  34. data/vendor/assets/stylesheets/materialize/_materialbox.scss +13 -12
  35. data/vendor/assets/stylesheets/materialize/_navbar.scss +26 -7
  36. data/vendor/assets/stylesheets/materialize/_sideNav.scss +5 -5
  37. data/vendor/assets/stylesheets/materialize/_table_of_contents.scss +2 -2
  38. data/vendor/assets/stylesheets/materialize/_toast.scss +1 -1
  39. data/vendor/assets/stylesheets/materialize/_tooltip.scss +2 -3
  40. data/vendor/assets/stylesheets/materialize/_transitions.scss +13 -0
  41. data/vendor/assets/stylesheets/materialize/_variables.scss +7 -1
  42. data/vendor/assets/stylesheets/materialize/_waves.scss +80 -143
  43. data/vendor/assets/stylesheets/materialize/forms/_input-fields.scss +4 -4
  44. metadata +9 -4
@@ -10,168 +10,105 @@
10
10
 
11
11
 
12
12
  .waves-effect {
13
+ position: relative;
14
+ cursor: pointer;
15
+ display: inline-block;
16
+ overflow: hidden;
17
+ user-select: none;
18
+ -webkit-tap-highlight-color: transparent;
19
+ vertical-align: middle;
20
+ z-index: 1;
21
+ transition: .3s ease-out;
22
+
23
+ .waves-ripple {
24
+ position: absolute;
25
+ border-radius: 50%;
26
+ width: 20px;
27
+ height: 20px;
28
+ margin-top:-10px;
29
+ margin-left:-10px;
30
+ opacity: 0;
31
+
32
+ background: rgba(0,0,0,0.2);
33
+ transition: all 0.7s ease-out;
34
+ transition-property: transform, opacity;
35
+ transform: scale(0);
36
+ pointer-events: none;
37
+ }
38
+
39
+ // Waves Colors
40
+ &.waves-light .waves-ripple {
41
+ background-color: rgba(255, 255, 255, 0.45);
42
+ }
43
+ &.waves-red .waves-ripple {
44
+ background-color: rgba(244, 67, 54, .70);
45
+ }
46
+ &.waves-yellow .waves-ripple {
47
+ background-color: rgba(255, 235, 59, .70);
48
+ }
49
+ &.waves-orange .waves-ripple {
50
+ background-color: rgba(255, 152, 0, .70);
51
+ }
52
+ &.waves-purple .waves-ripple {
53
+ background-color: rgba(156, 39, 176, 0.70);
54
+ }
55
+ &.waves-green .waves-ripple {
56
+ background-color: rgba(76, 175, 80, 0.70);
57
+ }
58
+ &.waves-teal .waves-ripple {
59
+ background-color: rgba(0, 150, 136, 0.70);
60
+ }
61
+
62
+ // Style input button bug.
63
+ input[type="button"], input[type="reset"], input[type="submit"] {
64
+ border: 0;
65
+ font-style: normal;
66
+ font-size: inherit;
67
+ text-transform: inherit;
68
+ background: none;
69
+ }
70
+
71
+ img {
13
72
  position: relative;
14
- cursor: pointer;
15
- display: inline-block;
16
- overflow: hidden;
17
- -webkit-user-select: none;
18
- -moz-user-select: none;
19
- -ms-user-select: none;
20
- user-select: none;
21
- -webkit-tap-highlight-color: transparent;
22
- // white-space: nowrap;
23
- // outline: 0;
24
-
25
- vertical-align: middle;
26
- // cursor: pointer;
27
- // border: none;
28
- // outline: none;
29
- // color: inherit;
30
- // background-color: rgba(0, 0, 0, 0);
31
- // font-size: 1em;
32
- // line-height:1em;
33
- // text-align: center;
34
- // text-decoration: none;
35
- z-index: 1;
36
- will-change: opacity, transform;
37
- transition: .3s ease-out;
38
-
39
- .waves-ripple {
40
- position: absolute;
41
- border-radius: 50%;
42
- width: 20px;
43
- height: 20px;
44
- margin-top:-10px;
45
- margin-left:-10px;
46
- opacity: 0;
47
-
48
- background: rgba(0,0,0,0.2);
49
- // $gradient: rgba(0,0,0,0.2) 0,rgba(0,0,0,.3) 40%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.5) 60%,rgba(255,255,255,0) 70%;
50
- // background: -webkit-radial-gradient($gradient);
51
- // background: -o-radial-gradient($gradient);
52
- // background: -moz-radial-gradient($gradient);
53
- // background: radial-gradient($gradient);
54
- transition: all 0.7s ease-out;
55
- transition-property: transform, opacity;
56
- transform: scale(0);
57
- pointer-events: none;
58
- }
59
-
60
- // Waves Colors
61
- &.waves-light .waves-ripple {
62
- background-color: rgba(255, 255, 255, 0.45);
63
- }
64
-
65
- &.waves-red .waves-ripple {
66
- background-color: rgba(244, 67, 54, .70);
67
- }
68
- &.waves-yellow .waves-ripple {
69
- background-color: rgba(255, 235, 59, .70);
70
- }
71
- &.waves-orange .waves-ripple {
72
- background-color: rgba(255, 152, 0, .70);
73
- }
74
- &.waves-purple .waves-ripple {
75
- background-color: rgba(156, 39, 176, 0.70);
76
- }
77
- &.waves-green .waves-ripple {
78
- background-color: rgba(76, 175, 80, 0.70);
79
- }
80
- &.waves-teal .waves-ripple {
81
- background-color: rgba(0, 150, 136, 0.70);
82
- }
83
-
84
- // Style input button bug.
85
- input[type="button"], input[type="reset"], input[type="submit"] {
86
- border: 0;
87
- font-style: normal;
88
- font-size: inherit;
89
- text-transform: inherit;
90
- background: none;
91
- }
92
-
93
- img {
94
- position: relative;
95
- z-index: -1;
96
- }
73
+ z-index: -1;
74
+ }
97
75
  }
98
76
 
99
77
  .waves-notransition {
100
- transition: none #{"!important"};
78
+ transition: none #{"!important"};
101
79
  }
102
80
 
103
81
  .waves-circle {
104
- transform: translateZ(0);
105
- -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
82
+ transform: translateZ(0);
83
+ -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
106
84
  }
107
85
 
108
- // .waves-button,
109
- // .waves-button:hover,
110
- // .waves-button:visited,
111
- // .waves-button-input {
112
- // white-space: nowrap;
113
- // vertical-align: middle;
114
- // cursor: pointer;
115
- // border: none;
116
- // outline: none;
117
- // color: inherit;
118
- // background-color: rgba(0, 0, 0, 0);
119
- // font-size: 1em;
120
- // line-height:1em;
121
- // text-align: center;
122
- // text-decoration: none;
123
- // z-index: 1;
124
- // }
125
-
126
- // .waves-button {
127
- // padding: 0.85em 1.1em;
128
- // border-radius: 0.2em;
129
- // }
130
-
131
- // .waves-button-input {
132
- // margin: 0;
133
- // padding: 0.85em 1.1em;
134
- // }
135
-
136
86
  .waves-input-wrapper {
137
- border-radius: 0.2em;
138
- vertical-align: bottom;
87
+ border-radius: 0.2em;
88
+ vertical-align: bottom;
139
89
 
140
- // &.waves-button {
141
- // padding: 0;
142
- // }
143
-
144
- .waves-button-input {
145
- position: relative;
146
- top: 0;
147
- left: 0;
148
- z-index: 1;
149
- }
90
+ .waves-button-input {
91
+ position: relative;
92
+ top: 0;
93
+ left: 0;
94
+ z-index: 1;
95
+ }
150
96
  }
151
97
 
152
98
  .waves-circle {
153
- text-align: center;
154
- width: 2.5em;
155
- height: 2.5em;
156
- line-height: 2.5em;
157
- border-radius: 50%;
158
- -webkit-mask-image: none;
99
+ text-align: center;
100
+ width: 2.5em;
101
+ height: 2.5em;
102
+ line-height: 2.5em;
103
+ border-radius: 50%;
104
+ -webkit-mask-image: none;
159
105
  }
160
106
 
161
- // .waves-float {
162
- // -webkit-mask-image: none;
163
- // @include box-shadow(0px 1px 1.5px 1px rgba(0, 0, 0, 0.12));
164
-
165
- // &:active {
166
- // @include box-shadow(0px 8px 20px 1px rgba(0, 0, 0, 0.30));
167
- // }
168
- // }
169
-
170
107
  .waves-block {
171
- display: block;
108
+ display: block;
172
109
  }
173
110
 
174
111
  /* Firefox Bug: link not triggered */
175
112
  .waves-effect .waves-ripple {
176
- z-index: -1;
113
+ z-index: -1;
177
114
  }
@@ -158,11 +158,11 @@ textarea.materialize-textarea {
158
158
  font-size: 1rem;
159
159
  cursor: text;
160
160
  transition: .2s ease-out;
161
- }
162
161
 
163
- label.active {
164
- font-size: $label-font-size;
165
- transform: translateY(-140%);
162
+ &:not(.label-icon).active {
163
+ font-size: $label-font-size;
164
+ transform: translateY(-140%);
165
+ }
166
166
  }
167
167
 
168
168
  // Prefix Icons
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: mtl
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.1.0
4
+ version: 1.1.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Marco Plüss
@@ -10,7 +10,7 @@ authors:
10
10
  autorequire:
11
11
  bindir: exe
12
12
  cert_chain: []
13
- date: 2017-01-15 00:00:00.000000000 Z
13
+ date: 2017-02-03 00:00:00.000000000 Z
14
14
  dependencies:
15
15
  - !ruby/object:Gem::Dependency
16
16
  name: railties
@@ -243,6 +243,7 @@ files:
243
243
  - vendor/assets/javascripts/materialize/velocity.min.js
244
244
  - vendor/assets/javascripts/materialize/waves.js
245
245
  - vendor/assets/javascripts/pdfobject.js
246
+ - vendor/assets/stylesheets/materialize/_badges.scss
246
247
  - vendor/assets/stylesheets/materialize/_buttons.scss
247
248
  - vendor/assets/stylesheets/materialize/_cards.scss
248
249
  - vendor/assets/stylesheets/materialize/_carousel.scss
@@ -267,6 +268,7 @@ files:
267
268
  - vendor/assets/stylesheets/materialize/_tabs.scss
268
269
  - vendor/assets/stylesheets/materialize/_toast.scss
269
270
  - vendor/assets/stylesheets/materialize/_tooltip.scss
271
+ - vendor/assets/stylesheets/materialize/_transitions.scss
270
272
  - vendor/assets/stylesheets/materialize/_typography.scss
271
273
  - vendor/assets/stylesheets/materialize/_variables.scss
272
274
  - vendor/assets/stylesheets/materialize/_waves.scss
@@ -285,7 +287,11 @@ homepage: https://github.com/at-point/mtl
285
287
  licenses:
286
288
  - MIT
287
289
  metadata: {}
288
- post_install_message:
290
+ post_install_message: "\n Some component have been extend with configuration variables,
291
+ don't forget to re-generate the scss configuration or\n add the following values
292
+ to your existing one:\n\n $chip-height: 32px !default;\n $chip-line-height:
293
+ 32px !default;\n $chip-font-size: 13px !default;\n $chip-font-weight:
294
+ 500 !default;\n $chip-border-radius: 16px !default;\n "
289
295
  rdoc_options: []
290
296
  require_paths:
291
297
  - lib
@@ -306,4 +312,3 @@ signing_key:
306
312
  specification_version: 4
307
313
  summary: Rails gem to package materialize-css for reuse between projects.
308
314
  test_files: []
309
- has_rdoc: