materialize-sass 1.0.0.alpha4 → 1.0.0.beta
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.
- checksums.yaml +4 -4
- data/README.md +3 -3
- data/Rakefile +1 -2
- data/assets/javascripts/materialize.js +881 -608
- data/assets/javascripts/materialize/autocomplete.js +36 -16
- data/assets/javascripts/materialize/carousel.js +42 -34
- data/assets/javascripts/materialize/chips.js +3 -1
- data/assets/javascripts/materialize/collapsible.js +31 -8
- data/assets/javascripts/materialize/datepicker.js +38 -29
- data/assets/javascripts/materialize/dropdown.js +112 -24
- data/assets/javascripts/materialize/forms.js +2 -2
- data/assets/javascripts/materialize/global.js +35 -0
- data/assets/javascripts/materialize/modal.js +26 -1
- data/assets/javascripts/materialize/select.js +10 -0
- data/assets/javascripts/materialize/sidenav.js +30 -9
- data/assets/javascripts/materialize/slider.js +3 -1
- data/assets/javascripts/materialize/tabs.js +6 -0
- data/assets/javascripts/materialize/tapTarget.js +19 -19
- data/assets/javascripts/materialize/timepicker.js +584 -579
- data/assets/javascripts/materialize/tooltip.js +31 -12
- data/assets/stylesheets/materialize/components/_cards.scss +2 -1
- data/assets/stylesheets/materialize/components/_datepicker.scss +1 -0
- data/assets/stylesheets/materialize/components/_tabs.scss +7 -1
- data/assets/stylesheets/materialize/components/forms/_input-fields.scss +7 -5
- data/assets/stylesheets/materialize/components/forms/_select.scss +0 -14
- data/lib/materialize-sass/version.rb +1 -1
- metadata +2 -2
@@ -46,6 +46,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
46
46
|
|
47
47
|
_this.isOpen = false;
|
48
48
|
_this.isHovered = false;
|
49
|
+
_this.isFocused = false;
|
49
50
|
_this._appendTooltipEl();
|
50
51
|
_this._setupEventHandlers();
|
51
52
|
return _this;
|
@@ -61,7 +62,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
61
62
|
value: function destroy() {
|
62
63
|
$(this.tooltipEl).remove();
|
63
64
|
this._removeEventHandlers();
|
64
|
-
this
|
65
|
+
this.el.M_Tooltip = undefined;
|
65
66
|
}
|
66
67
|
}, {
|
67
68
|
key: '_appendTooltipEl',
|
@@ -84,16 +85,22 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
84
85
|
}, {
|
85
86
|
key: '_setupEventHandlers',
|
86
87
|
value: function _setupEventHandlers() {
|
87
|
-
this.
|
88
|
-
this.
|
89
|
-
this
|
90
|
-
this
|
88
|
+
this._handleMouseEnterBound = this._handleMouseEnter.bind(this);
|
89
|
+
this._handleMouseLeaveBound = this._handleMouseLeave.bind(this);
|
90
|
+
this._handleFocusBound = this._handleFocus.bind(this);
|
91
|
+
this._handleBlurBound = this._handleBlur.bind(this);
|
92
|
+
this.el.addEventListener('mouseenter', this._handleMouseEnterBound);
|
93
|
+
this.el.addEventListener('mouseleave', this._handleMouseLeaveBound);
|
94
|
+
this.el.addEventListener('focus', this._handleFocusBound, true);
|
95
|
+
this.el.addEventListener('blur', this._handleBlurBound, true);
|
91
96
|
}
|
92
97
|
}, {
|
93
98
|
key: '_removeEventHandlers',
|
94
99
|
value: function _removeEventHandlers() {
|
95
|
-
this
|
96
|
-
this
|
100
|
+
this.el.removeEventListener('mouseenter', this._handleMouseEnterBound);
|
101
|
+
this.el.removeEventListener('mouseleave', this._handleMouseLeaveBound);
|
102
|
+
this.el.removeEventListener('focus', this._handleFocusBound, true);
|
103
|
+
this.el.removeEventListener('blur', this._handleBlurBound, true);
|
97
104
|
}
|
98
105
|
}, {
|
99
106
|
key: 'open',
|
@@ -131,7 +138,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
131
138
|
clearTimeout(this._exitDelayTimeout);
|
132
139
|
|
133
140
|
this._exitDelayTimeout = setTimeout(function () {
|
134
|
-
if (_this2.isHovered) {
|
141
|
+
if (_this2.isHovered || _this2.isFocused) {
|
135
142
|
return;
|
136
143
|
}
|
137
144
|
|
@@ -151,7 +158,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
151
158
|
clearTimeout(this._enterDelayTimeout);
|
152
159
|
|
153
160
|
this._enterDelayTimeout = setTimeout(function () {
|
154
|
-
if (!_this3.isHovered) {
|
161
|
+
if (!_this3.isHovered && !_this3.isFocused) {
|
155
162
|
return;
|
156
163
|
}
|
157
164
|
|
@@ -161,7 +168,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
161
168
|
}, {
|
162
169
|
key: '_positionTooltip',
|
163
170
|
value: function _positionTooltip() {
|
164
|
-
var origin = this
|
171
|
+
var origin = this.el,
|
165
172
|
tooltip = this.tooltipEl,
|
166
173
|
originHeight = origin.offsetHeight,
|
167
174
|
originWidth = origin.offsetWidth,
|
@@ -276,12 +283,24 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
276
283
|
this.isHovered = false;
|
277
284
|
this.close();
|
278
285
|
}
|
286
|
+
}, {
|
287
|
+
key: '_handleFocus',
|
288
|
+
value: function _handleFocus() {
|
289
|
+
this.isFocused = true;
|
290
|
+
this.open();
|
291
|
+
}
|
292
|
+
}, {
|
293
|
+
key: '_handleBlur',
|
294
|
+
value: function _handleBlur() {
|
295
|
+
this.isFocused = false;
|
296
|
+
this.close();
|
297
|
+
}
|
279
298
|
}, {
|
280
299
|
key: '_getAttributeOptions',
|
281
300
|
value: function _getAttributeOptions() {
|
282
301
|
var attributeOptions = {};
|
283
|
-
var tooltipTextOption = this
|
284
|
-
var positionOption = this
|
302
|
+
var tooltipTextOption = this.el.getAttribute('data-tooltip');
|
303
|
+
var positionOption = this.el.getAttribute('data-position');
|
285
304
|
|
286
305
|
if (tooltipTextOption) {
|
287
306
|
attributeOptions.html = tooltipTextOption;
|
@@ -160,8 +160,9 @@
|
|
160
160
|
&:last-child {
|
161
161
|
border-radius: 0 0 2px 2px;
|
162
162
|
}
|
163
|
-
|
163
|
+
background-color: inherit; // Use inherit to inherit color classes
|
164
164
|
border-top: 1px solid rgba(160,160,160,.2);
|
165
|
+
position: relative;
|
165
166
|
padding: 16px $card-padding;
|
166
167
|
|
167
168
|
a:not(.btn):not(.btn-large):not(.btn-floating) {
|
@@ -45,6 +45,12 @@
|
|
45
45
|
text-transform: uppercase;
|
46
46
|
|
47
47
|
a {
|
48
|
+
&:focus,
|
49
|
+
&:focus.active {
|
50
|
+
background-color: transparentize($tabs-underline-color, .8);
|
51
|
+
outline: none;
|
52
|
+
}
|
53
|
+
|
48
54
|
&:hover,
|
49
55
|
&.active {
|
50
56
|
background-color: transparent;
|
@@ -59,7 +65,7 @@
|
|
59
65
|
font-size: 14px;
|
60
66
|
text-overflow: ellipsis;
|
61
67
|
overflow: hidden;
|
62
|
-
transition: color .28s ease;
|
68
|
+
transition: color .28s ease, background-color .28s ease;
|
63
69
|
}
|
64
70
|
|
65
71
|
&.disabled a,
|
@@ -193,6 +193,12 @@ textarea.materialize-textarea {
|
|
193
193
|
}
|
194
194
|
}
|
195
195
|
|
196
|
+
& > input[type=date]:not(.browser-default) + label,
|
197
|
+
& > input[type=time]:not(.browser-default) + label {
|
198
|
+
transform: translateY(-14px) scale(.8);
|
199
|
+
transform-origin: 0 0;
|
200
|
+
}
|
201
|
+
|
196
202
|
.helper-text {
|
197
203
|
&::after {
|
198
204
|
opacity: 1;
|
@@ -253,6 +259,7 @@ textarea.materialize-textarea {
|
|
253
259
|
.input-field input[type=search] {
|
254
260
|
display: block;
|
255
261
|
line-height: inherit;
|
262
|
+
transition: .3s background-color;
|
256
263
|
|
257
264
|
.nav-wrapper & {
|
258
265
|
height: inherit;
|
@@ -328,11 +335,6 @@ textarea {
|
|
328
335
|
|
329
336
|
/* Autocomplete */
|
330
337
|
.autocomplete-content {
|
331
|
-
margin-top: -1 * $input-margin-bottom;
|
332
|
-
margin-bottom: $input-margin-bottom;
|
333
|
-
opacity: 1;
|
334
|
-
position: static;
|
335
|
-
|
336
338
|
li {
|
337
339
|
.highlight { color: #444; }
|
338
340
|
|
@@ -13,20 +13,6 @@ select {
|
|
13
13
|
height: $input-height;
|
14
14
|
}
|
15
15
|
|
16
|
-
|
17
|
-
.input-field {
|
18
|
-
select {
|
19
|
-
display: block;
|
20
|
-
position: absolute;
|
21
|
-
width: 0;
|
22
|
-
pointer-events: none;
|
23
|
-
height: 0;
|
24
|
-
bottom: 0;
|
25
|
-
left: 0;
|
26
|
-
opacity: 0;
|
27
|
-
}
|
28
|
-
}
|
29
|
-
|
30
16
|
.select-label {
|
31
17
|
position: absolute;
|
32
18
|
}
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: materialize-sass
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.0.
|
4
|
+
version: 1.0.0.beta
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- mkhairi
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2018-
|
11
|
+
date: 2018-03-24 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|