materialize-sass 1.0.0.alpha3 → 1.0.0.alpha4
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/assets/javascripts/materialize.js +289 -184
- data/assets/javascripts/materialize/autocomplete.js +7 -0
- data/assets/javascripts/materialize/buttons.js +1 -1
- data/assets/javascripts/materialize/chips.js +1 -1
- data/assets/javascripts/materialize/component.js +1 -1
- data/assets/javascripts/materialize/datepicker.js +30 -7
- data/assets/javascripts/materialize/dropdown.js +27 -16
- data/assets/javascripts/materialize/extras/nouislider.js +1 -1
- data/assets/javascripts/materialize/extras/nouislider.min.js +1 -1
- data/assets/javascripts/materialize/forms.js +8 -3
- data/assets/javascripts/materialize/global.js +12 -9
- data/assets/javascripts/materialize/materialbox.js +34 -13
- data/assets/javascripts/materialize/modal.js +16 -10
- data/assets/javascripts/materialize/parallax.js +6 -5
- data/assets/javascripts/materialize/select.js +26 -19
- data/assets/javascripts/materialize/sidenav.js +17 -3
- data/assets/javascripts/materialize/timepicker.js +19 -12
- data/assets/stylesheets/materialize/components/_badges.scss +8 -0
- data/assets/stylesheets/materialize/components/_buttons.scss +35 -37
- data/assets/stylesheets/materialize/components/_datepicker.scss +2 -2
- data/assets/stylesheets/materialize/components/_dropdown.scss +3 -1
- data/assets/stylesheets/materialize/components/_global.scss +11 -1
- data/assets/stylesheets/materialize/components/_sidenav.scss +1 -1
- data/assets/stylesheets/materialize/components/_timepicker.scss +2 -2
- data/assets/stylesheets/materialize/components/_variables.scss +11 -3
- data/assets/stylesheets/materialize/components/forms/_input-fields.scss +4 -3
- data/assets/stylesheets/materialize/components/forms/_select.scss +3 -2
- data/assets/stylesheets/materialize/extras/nouislider.css +1 -1
- data/lib/materialize-sass/version.rb +1 -1
- metadata +2 -2
@@ -31,9 +31,14 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
31
31
|
* @prop {Number} responsiveThreshold
|
32
32
|
*/
|
33
33
|
_this.options = $.extend({}, Parallax.defaults, options);
|
34
|
+
_this._enabled = window.innerWidth > _this.options.responsiveThreshold;
|
34
35
|
|
35
36
|
_this.$img = _this.$el.find('img').first();
|
36
|
-
_this.
|
37
|
+
_this.$img.each(function () {
|
38
|
+
var el = this;
|
39
|
+
if (el.complete) $(el).trigger("load");
|
40
|
+
});
|
41
|
+
|
37
42
|
_this._updateParallax();
|
38
43
|
_this._setupEventHandlers();
|
39
44
|
_this._setupStyles();
|
@@ -89,10 +94,6 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
89
94
|
key: '_handleImageLoad',
|
90
95
|
value: function _handleImageLoad() {
|
91
96
|
this._updateParallax();
|
92
|
-
this.$img.each(function () {
|
93
|
-
var el = this;
|
94
|
-
if (el.complete) $(el).trigger("load");
|
95
|
-
});
|
96
97
|
}
|
97
98
|
}, {
|
98
99
|
key: '_updateParallax',
|
@@ -12,7 +12,8 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
12
12
|
'use strict';
|
13
13
|
|
14
14
|
var _defaults = {
|
15
|
-
classes: ''
|
15
|
+
classes: '',
|
16
|
+
dropdownOptions: {}
|
16
17
|
};
|
17
18
|
|
18
19
|
/**
|
@@ -20,31 +21,37 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
20
21
|
*
|
21
22
|
*/
|
22
23
|
|
23
|
-
var
|
24
|
-
_inherits(
|
24
|
+
var FormSelect = function (_Component) {
|
25
|
+
_inherits(FormSelect, _Component);
|
25
26
|
|
26
27
|
/**
|
27
|
-
* Construct
|
28
|
+
* Construct FormSelect instance
|
28
29
|
* @constructor
|
29
30
|
* @param {Element} el
|
30
31
|
* @param {Object} options
|
31
32
|
*/
|
32
|
-
function
|
33
|
-
_classCallCheck(this,
|
33
|
+
function FormSelect(el, options) {
|
34
|
+
_classCallCheck(this, FormSelect);
|
34
35
|
|
35
|
-
|
36
|
+
// Don't init if browser default version
|
37
|
+
var _this = _possibleConstructorReturn(this, (FormSelect.__proto__ || Object.getPrototypeOf(FormSelect)).call(this, FormSelect, el, options));
|
36
38
|
|
37
|
-
_this
|
39
|
+
if (_this.$el.hasClass('browser-default')) {
|
40
|
+
return _possibleConstructorReturn(_this);
|
41
|
+
}
|
42
|
+
|
43
|
+
_this.el.M_FormSelect = _this;
|
38
44
|
|
39
45
|
/**
|
40
46
|
* Options for the select
|
41
|
-
* @member
|
47
|
+
* @member FormSelect#options
|
42
48
|
*/
|
43
|
-
_this.options = $.extend({},
|
49
|
+
_this.options = $.extend({}, FormSelect.defaults, options);
|
44
50
|
|
45
51
|
_this.isMultiple = _this.$el.prop('multiple');
|
46
52
|
|
47
53
|
// Setup
|
54
|
+
_this.el.tabIndex = -1;
|
48
55
|
_this._keysSelected = {};
|
49
56
|
_this._valueDict = {}; // Maps key to original and generated option element.
|
50
57
|
_this._setupDropdown();
|
@@ -53,7 +60,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
53
60
|
return _this;
|
54
61
|
}
|
55
62
|
|
56
|
-
_createClass(
|
63
|
+
_createClass(FormSelect, [{
|
57
64
|
key: 'destroy',
|
58
65
|
|
59
66
|
|
@@ -63,7 +70,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
63
70
|
value: function destroy() {
|
64
71
|
this._removeEventHandlers();
|
65
72
|
this._removeDropdown();
|
66
|
-
this.el.
|
73
|
+
this.el.M_FormSelect = undefined;
|
67
74
|
}
|
68
75
|
|
69
76
|
/**
|
@@ -100,7 +107,6 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
100
107
|
});
|
101
108
|
this.el.removeEventListener('change', this._handleSelectChangeBound);
|
102
109
|
this.input.removeEventListener('click', this._handleInputClickBound);
|
103
|
-
this.input.removeEventListener('focus', this._handleInputFocusBound);
|
104
110
|
}
|
105
111
|
|
106
112
|
/**
|
@@ -238,7 +244,8 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
238
244
|
|
239
245
|
// Initialize dropdown
|
240
246
|
if (!this.el.disabled) {
|
241
|
-
var dropdownOptions = {};
|
247
|
+
var dropdownOptions = $.extend({}, this.options.dropdownOptions);
|
248
|
+
|
242
249
|
if (this.isMultiple) {
|
243
250
|
dropdownOptions.closeOnClick = false;
|
244
251
|
}
|
@@ -425,7 +432,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
425
432
|
}], [{
|
426
433
|
key: 'init',
|
427
434
|
value: function init(els, options) {
|
428
|
-
return _get(
|
435
|
+
return _get(FormSelect.__proto__ || Object.getPrototypeOf(FormSelect), 'init', this).call(this, this, els, options);
|
429
436
|
}
|
430
437
|
|
431
438
|
/**
|
@@ -436,7 +443,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
436
443
|
key: 'getInstance',
|
437
444
|
value: function getInstance(el) {
|
438
445
|
var domElem = !!el.jquery ? el[0] : el;
|
439
|
-
return domElem.
|
446
|
+
return domElem.M_FormSelect;
|
440
447
|
}
|
441
448
|
}, {
|
442
449
|
key: 'defaults',
|
@@ -445,12 +452,12 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
445
452
|
}
|
446
453
|
}]);
|
447
454
|
|
448
|
-
return
|
455
|
+
return FormSelect;
|
449
456
|
}(Component);
|
450
457
|
|
451
|
-
M.
|
458
|
+
M.FormSelect = FormSelect;
|
452
459
|
|
453
460
|
if (M.jQueryLoaded) {
|
454
|
-
M.initializeJqueryWrapper(
|
461
|
+
M.initializeJqueryWrapper(FormSelect, 'formSelect', 'M_FormSelect');
|
455
462
|
}
|
456
463
|
})(cash);
|
@@ -226,6 +226,11 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
226
226
|
}, {
|
227
227
|
key: '_handleDragTargetDrag',
|
228
228
|
value: function _handleDragTargetDrag(e) {
|
229
|
+
// Check if draggable
|
230
|
+
if (!this.options.draggable || this._isCurrentlyFixed()) {
|
231
|
+
return;
|
232
|
+
}
|
233
|
+
|
229
234
|
// If not being dragged, set initial drag start variables
|
230
235
|
if (!this.isDragged) {
|
231
236
|
this._startDrag(e);
|
@@ -293,6 +298,10 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
293
298
|
key: '_handleCloseDrag',
|
294
299
|
value: function _handleCloseDrag(e) {
|
295
300
|
if (this.isOpen) {
|
301
|
+
// Check if draggable
|
302
|
+
if (!this.options.draggable || this._isCurrentlyFixed()) {
|
303
|
+
return;
|
304
|
+
}
|
296
305
|
|
297
306
|
// If not being dragged, set initial drag start variables
|
298
307
|
if (!this.isDragged) {
|
@@ -389,10 +398,15 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
389
398
|
}, {
|
390
399
|
key: '_setupFixed',
|
391
400
|
value: function _setupFixed() {
|
392
|
-
if (this.
|
401
|
+
if (this._isCurrentlyFixed()) {
|
393
402
|
this.open();
|
394
403
|
}
|
395
404
|
}
|
405
|
+
}, {
|
406
|
+
key: '_isCurrentlyFixed',
|
407
|
+
value: function _isCurrentlyFixed() {
|
408
|
+
return this.isFixed && window.innerWidth > 992;
|
409
|
+
}
|
396
410
|
}, {
|
397
411
|
key: '_createDragTarget',
|
398
412
|
value: function _createDragTarget() {
|
@@ -428,7 +442,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
428
442
|
}
|
429
443
|
|
430
444
|
// Handle fixed Sidenav
|
431
|
-
if (this.
|
445
|
+
if (this._isCurrentlyFixed()) {
|
432
446
|
anim.remove(this.el);
|
433
447
|
anim({
|
434
448
|
targets: this.el,
|
@@ -463,7 +477,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
463
477
|
}
|
464
478
|
|
465
479
|
// Handle fixed Sidenav
|
466
|
-
if (this.
|
480
|
+
if (this._isCurrentlyFixed()) {
|
467
481
|
var transformX = this.options.edge === 'left' ? '-105%' : '105%';
|
468
482
|
this.el.style.transform = 'translateX(' + transformX + ')';
|
469
483
|
|
@@ -20,9 +20,14 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
20
20
|
container: null,
|
21
21
|
defaultTime: 'now', // default time, 'now' or '13:14' e.g.
|
22
22
|
fromnow: 0, // Millisecond offset from the defaultTime
|
23
|
-
|
24
|
-
|
25
|
-
|
23
|
+
|
24
|
+
// internationalization
|
25
|
+
i18n: {
|
26
|
+
done: 'Ok',
|
27
|
+
clear: 'Clear',
|
28
|
+
cancel: 'Cancel'
|
29
|
+
},
|
30
|
+
|
26
31
|
autoClose: false, // auto close when minute is selected
|
27
32
|
twelveHour: true, // change to 12 hour AM/PM clock from 24 hour
|
28
33
|
vibrate: true // vibrate the device when dragging clock hand
|
@@ -148,6 +153,8 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
148
153
|
}, {
|
149
154
|
key: '_handleDocumentClickEnd',
|
150
155
|
value: function _handleDocumentClickEnd(e) {
|
156
|
+
var _this2 = this;
|
157
|
+
|
151
158
|
e.preventDefault();
|
152
159
|
document.removeEventListener('mouseup', this._handleDocumentClickEndBound);
|
153
160
|
document.removeEventListener('touchend', this._handleDocumentClickEndBound);
|
@@ -161,9 +168,9 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
161
168
|
if (this.currentView === 'hours') {
|
162
169
|
this.showView('minutes', this.options.duration / 2);
|
163
170
|
} else if (this.options.autoClose) {
|
164
|
-
this.minutesView.addClass('timepicker-dial-out');
|
171
|
+
$(this.minutesView).addClass('timepicker-dial-out');
|
165
172
|
setTimeout(function () {
|
166
|
-
|
173
|
+
_this2.done();
|
167
174
|
}, this.options.duration / 2);
|
168
175
|
}
|
169
176
|
|
@@ -189,11 +196,11 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
189
196
|
}, {
|
190
197
|
key: '_setupModal',
|
191
198
|
value: function _setupModal() {
|
192
|
-
var
|
199
|
+
var _this3 = this;
|
193
200
|
|
194
201
|
this.modal = M.Modal.init(this.modalEl, {
|
195
202
|
onCloseEnd: function () {
|
196
|
-
|
203
|
+
_this3.isOpen = false;
|
197
204
|
}
|
198
205
|
});
|
199
206
|
}
|
@@ -217,11 +224,11 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
217
224
|
}, {
|
218
225
|
key: '_pickerSetup',
|
219
226
|
value: function _pickerSetup() {
|
220
|
-
$('<button class="btn-flat timepicker-clear waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.
|
227
|
+
$('<button class="btn-flat timepicker-clear waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.i18n.clear + '</button>').appendTo(this.footer).on('click', this.clear.bind(this));
|
221
228
|
|
222
229
|
var confirmationBtnsContainer = $('<div class="confirmation-btns"></div>');
|
223
|
-
$('<button class="btn-flat timepicker-close waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.
|
224
|
-
$('<button class="btn-flat timepicker-close waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.
|
230
|
+
$('<button class="btn-flat timepicker-close waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.i18n.cancel + '</button>').appendTo(confirmationBtnsContainer).on('click', this.close.bind(this));
|
231
|
+
$('<button class="btn-flat timepicker-close waves-effect" type="button" tabindex="' + (this.options.twelveHour ? '3' : '1') + '">' + this.options.i18n.done + '</button>').appendTo(confirmationBtnsContainer).on('click', this.done.bind(this));
|
225
232
|
confirmationBtnsContainer.appendTo(this.footer);
|
226
233
|
}
|
227
234
|
}, {
|
@@ -419,7 +426,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
419
426
|
}, {
|
420
427
|
key: 'setHand',
|
421
428
|
value: function setHand(x, y, roundBy5) {
|
422
|
-
var
|
429
|
+
var _this4 = this;
|
423
430
|
|
424
431
|
var radian = Math.atan2(x, -y),
|
425
432
|
isHours = this.currentView === 'hours',
|
@@ -474,7 +481,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
|
|
474
481
|
if (!this.vibrateTimer) {
|
475
482
|
navigator[this.vibrate](10);
|
476
483
|
this.vibrateTimer = setTimeout(function () {
|
477
|
-
|
484
|
+
_this4.vibrateTimer = null;
|
478
485
|
}, 100);
|
479
486
|
}
|
480
487
|
}
|
@@ -26,6 +26,8 @@ span.badge {
|
|
26
26
|
content: " " attr(data-badge-caption);
|
27
27
|
}
|
28
28
|
}
|
29
|
+
|
30
|
+
// Special cases
|
29
31
|
nav ul a span.badge {
|
30
32
|
display: inline-block;
|
31
33
|
float: none;
|
@@ -45,3 +47,9 @@ nav ul a span.badge {
|
|
45
47
|
.sidenav span.badge {
|
46
48
|
margin-top: calc(#{$sidenav-line-height / 2} - #{$badge-height / 2});
|
47
49
|
}
|
50
|
+
|
51
|
+
table span.badge {
|
52
|
+
display: inline-block;
|
53
|
+
float: none;
|
54
|
+
margin-left: auto;
|
55
|
+
}
|
@@ -9,29 +9,30 @@
|
|
9
9
|
padding: $button-padding;
|
10
10
|
text-transform: uppercase;
|
11
11
|
vertical-align: middle;
|
12
|
-
// Gets rid of tap active state
|
13
|
-
-webkit-tap-highlight-color: transparent;
|
12
|
+
-webkit-tap-highlight-color: transparent; // Gets rid of tap active state
|
14
13
|
}
|
15
14
|
|
16
15
|
// Disabled shared style
|
17
16
|
.btn.disabled,
|
18
17
|
.btn-floating.disabled,
|
19
18
|
.btn-large.disabled,
|
19
|
+
.btn-small.disabled,
|
20
20
|
.btn-flat.disabled,
|
21
21
|
.btn:disabled,
|
22
22
|
.btn-floating:disabled,
|
23
23
|
.btn-large:disabled,
|
24
|
+
.btn-small:disabled,
|
24
25
|
.btn-flat:disabled,
|
25
26
|
.btn[disabled],
|
26
27
|
.btn-floating[disabled],
|
27
28
|
.btn-large[disabled],
|
29
|
+
.btn-small[disabled],
|
28
30
|
.btn-flat[disabled] {
|
29
31
|
pointer-events: none;
|
30
32
|
background-color: $button-disabled-background !important;
|
31
33
|
box-shadow: none;
|
32
34
|
color: $button-disabled-color !important;
|
33
35
|
cursor: default;
|
34
|
-
|
35
36
|
&:hover {
|
36
37
|
background-color: $button-disabled-background !important;
|
37
38
|
color: $button-disabled-color !important;
|
@@ -42,10 +43,10 @@
|
|
42
43
|
.btn,
|
43
44
|
.btn-floating,
|
44
45
|
.btn-large,
|
46
|
+
.btn-small,
|
45
47
|
.btn-flat {
|
46
48
|
font-size: $button-font-size;
|
47
49
|
outline: 0;
|
48
|
-
|
49
50
|
i {
|
50
51
|
font-size: $button-icon-font-size;
|
51
52
|
line-height: inherit;
|
@@ -70,7 +71,6 @@
|
|
70
71
|
@extend .z-depth-1;
|
71
72
|
transition: background-color .2s ease-out;
|
72
73
|
cursor: pointer;
|
73
|
-
|
74
74
|
&:hover {
|
75
75
|
background-color: $button-raised-background-hover;
|
76
76
|
@extend .z-depth-1-half;
|
@@ -83,34 +83,41 @@
|
|
83
83
|
background-color: $button-floating-background-hover;
|
84
84
|
@extend .z-depth-1-half;
|
85
85
|
}
|
86
|
-
|
87
86
|
&:before {
|
88
87
|
border-radius: 0;
|
89
88
|
}
|
90
|
-
|
91
89
|
&.btn-large {
|
92
90
|
&.halfway-fab {
|
93
91
|
bottom: -$button-floating-large-size / 2;
|
94
92
|
}
|
95
|
-
|
96
93
|
width: $button-floating-large-size;
|
97
94
|
height: $button-floating-large-size;
|
95
|
+
padding: 0;
|
98
96
|
i {
|
99
97
|
line-height: $button-floating-large-size;
|
100
98
|
}
|
101
99
|
}
|
102
100
|
|
101
|
+
&.btn-small {
|
102
|
+
&.halfway-fab {
|
103
|
+
bottom: -$button-floating-small-size / 2;
|
104
|
+
}
|
105
|
+
width: $button-floating-small-size;
|
106
|
+
height: $button-floating-small-size;
|
107
|
+
i {
|
108
|
+
line-height: $button-floating-small-size;
|
109
|
+
}
|
110
|
+
}
|
111
|
+
|
103
112
|
&.halfway-fab {
|
104
113
|
&.left {
|
105
114
|
right: auto;
|
106
115
|
left: 24px;
|
107
116
|
}
|
108
|
-
|
109
117
|
position: absolute;
|
110
118
|
right: 24px;
|
111
119
|
bottom: -$button-floating-size / 2;
|
112
120
|
}
|
113
|
-
|
114
121
|
display: inline-block;
|
115
122
|
color: $button-floating-color;
|
116
123
|
position: relative;
|
@@ -126,7 +133,6 @@
|
|
126
133
|
transition: background-color .3s;
|
127
134
|
cursor: pointer;
|
128
135
|
vertical-align: middle;
|
129
|
-
|
130
136
|
i {
|
131
137
|
width: inherit;
|
132
138
|
display: inline-block;
|
@@ -146,7 +152,7 @@ button.btn-floating {
|
|
146
152
|
.fixed-action-btn {
|
147
153
|
&.active {
|
148
154
|
ul {
|
149
|
-
|
155
|
+
visibility: visible;
|
150
156
|
}
|
151
157
|
}
|
152
158
|
|
@@ -154,7 +160,6 @@ button.btn-floating {
|
|
154
160
|
&.direction-left,
|
155
161
|
&.direction-right {
|
156
162
|
padding: 0 0 0 15px;
|
157
|
-
|
158
163
|
ul {
|
159
164
|
text-align: right;
|
160
165
|
right: 64px;
|
@@ -162,68 +167,57 @@ button.btn-floating {
|
|
162
167
|
transform: translateY(-50%);
|
163
168
|
height: 100%;
|
164
169
|
left: auto;
|
165
|
-
|
166
|
-
|
170
|
+
/*width 100% only goes to width of button container */
|
171
|
+
width: 500px;
|
167
172
|
li {
|
168
173
|
display: inline-block;
|
169
174
|
margin: 7.5px 15px 0 0;
|
170
175
|
}
|
171
176
|
}
|
172
177
|
}
|
173
|
-
|
174
178
|
&.direction-right {
|
175
179
|
padding: 0 15px 0 0;
|
176
|
-
|
177
180
|
ul {
|
178
181
|
text-align: left;
|
179
182
|
direction: rtl;
|
180
183
|
left: 64px;
|
181
184
|
right: auto;
|
182
|
-
|
183
185
|
li {
|
184
186
|
margin: 7.5px 0 0 15px;
|
185
187
|
}
|
186
188
|
}
|
187
189
|
}
|
188
|
-
|
189
190
|
&.direction-bottom {
|
190
191
|
padding: 0 0 15px 0;
|
191
|
-
|
192
192
|
ul {
|
193
193
|
top: 64px;
|
194
194
|
bottom: auto;
|
195
195
|
display: flex;
|
196
196
|
flex-direction: column-reverse;
|
197
|
-
|
198
197
|
li {
|
199
198
|
margin: 15px 0 0 0;
|
200
199
|
}
|
201
200
|
}
|
202
201
|
}
|
203
|
-
|
204
202
|
&.toolbar {
|
205
203
|
&.active {
|
206
|
-
|
204
|
+
&>a i {
|
207
205
|
opacity: 0;
|
208
206
|
}
|
209
207
|
}
|
210
|
-
|
211
208
|
padding: 0;
|
212
209
|
height: $button-floating-large-size;
|
213
|
-
|
214
210
|
ul {
|
215
211
|
display: flex;
|
216
212
|
top: 0;
|
217
213
|
bottom: 0;
|
218
214
|
z-index: 1;
|
219
|
-
|
220
215
|
li {
|
221
216
|
flex: 1;
|
222
217
|
display: inline-block;
|
223
218
|
margin: 0;
|
224
219
|
height: 100%;
|
225
220
|
transition: none;
|
226
|
-
|
227
221
|
a {
|
228
222
|
display: block;
|
229
223
|
overflow: hidden;
|
@@ -235,7 +229,6 @@ button.btn-floating {
|
|
235
229
|
color: #fff;
|
236
230
|
line-height: $button-floating-large-size;
|
237
231
|
z-index: 1;
|
238
|
-
|
239
232
|
i {
|
240
233
|
line-height: inherit;
|
241
234
|
}
|
@@ -243,14 +236,12 @@ button.btn-floating {
|
|
243
236
|
}
|
244
237
|
}
|
245
238
|
}
|
246
|
-
|
247
239
|
position: fixed;
|
248
240
|
right: 23px;
|
249
241
|
bottom: 23px;
|
250
242
|
padding-top: 15px;
|
251
243
|
margin-bottom: 0;
|
252
244
|
z-index: 997;
|
253
|
-
|
254
245
|
ul {
|
255
246
|
left: 0;
|
256
247
|
right: 0;
|
@@ -259,16 +250,13 @@ button.btn-floating {
|
|
259
250
|
bottom: 64px;
|
260
251
|
margin: 0;
|
261
252
|
visibility: hidden;
|
262
|
-
|
263
253
|
li {
|
264
254
|
margin-bottom: 15px;
|
265
255
|
}
|
266
|
-
|
267
256
|
a.btn-floating {
|
268
257
|
opacity: 0;
|
269
258
|
}
|
270
259
|
}
|
271
|
-
|
272
260
|
.fab-backdrop {
|
273
261
|
position: absolute;
|
274
262
|
top: 0;
|
@@ -289,16 +277,13 @@ button.btn-floating {
|
|
289
277
|
color: $button-flat-color;
|
290
278
|
cursor: pointer;
|
291
279
|
transition: background-color .2s;
|
292
|
-
|
293
280
|
&:focus,
|
294
281
|
&:hover {
|
295
282
|
box-shadow: none;
|
296
283
|
}
|
297
|
-
|
298
284
|
&:focus {
|
299
|
-
background-color: rgba(0,0,0
|
285
|
+
background-color: rgba(0, 0, 0, .1);
|
300
286
|
}
|
301
|
-
|
302
287
|
&.disabled {
|
303
288
|
background-color: transparent !important;
|
304
289
|
color: $button-flat-disabled-color !important;
|
@@ -311,12 +296,25 @@ button.btn-floating {
|
|
311
296
|
@extend .btn;
|
312
297
|
height: $button-large-height;
|
313
298
|
line-height: $button-large-height;
|
299
|
+
font-size: $button-large-font-size;
|
300
|
+
padding: 0 28px;
|
314
301
|
|
315
302
|
i {
|
316
303
|
font-size: $button-large-icon-font-size;
|
317
304
|
}
|
318
305
|
}
|
319
306
|
|
307
|
+
// Small button
|
308
|
+
.btn-small {
|
309
|
+
@extend .btn;
|
310
|
+
height: $button-small-height;
|
311
|
+
line-height: $button-small-height;
|
312
|
+
font-size: $button-small-font-size;
|
313
|
+
i {
|
314
|
+
font-size: $button-small-icon-font-size;
|
315
|
+
}
|
316
|
+
}
|
317
|
+
|
320
318
|
// Block button
|
321
319
|
.btn-block {
|
322
320
|
display: block;
|