mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-25 11:04:09 +03:00
dist
This commit is contained in:
Kevin Ross
parent
2671c73cea
commit
8667184340
105
dist/css/bootstrap-material-design.css
vendored
105
dist/css/bootstrap-material-design.css
vendored
|
|
@ -859,6 +859,7 @@ label.checkbox-inline .checkbox-material {
|
|||
label.checkbox-inline .checkbox-material:before {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: 0;
|
||||
content: "";
|
||||
background-color: rgba(0, 0, 0, 0.84);
|
||||
|
|
@ -909,14 +910,47 @@ label.checkbox-inline .checkbox-material .check:before {
|
|||
0 0 0 0,
|
||||
0 0 0 0,
|
||||
0 0 0 0 inset;
|
||||
-webkit-animation: checkbox-off;
|
||||
-o-animation: checkbox-off;
|
||||
animation: checkbox-off;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus + .checkbox-material .check:after,
|
||||
label.checkbox-inline input[type=checkbox]:focus + .checkbox-material .check:after {
|
||||
opacity: 0.2;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:checked + .checkbox-material:before,
|
||||
label.checkbox-inline input[type=checkbox]:focus:checked + .checkbox-material:before {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-o-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:checked + .checkbox-material .check:before,
|
||||
label.checkbox-inline input[type=checkbox]:focus:checked + .checkbox-material .check:before {
|
||||
-webkit-animation: checkbox-on 0.3s forwards;
|
||||
-o-animation: checkbox-on 0.3s forwards;
|
||||
animation: checkbox-on 0.3s forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:checked + .checkbox-material .check:after,
|
||||
label.checkbox-inline input[type=checkbox]:focus:checked + .checkbox-material .check:after {
|
||||
-webkit-animation: rippleOn 500ms forwards;
|
||||
-o-animation: rippleOn 500ms forwards;
|
||||
animation: rippleOn 500ms forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:not(:checked) + .checkbox-material:before,
|
||||
label.checkbox-inline input[type=checkbox]:focus:not(:checked) + .checkbox-material:before {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-o-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:not(:checked) + .checkbox-material .check:before,
|
||||
label.checkbox-inline input[type=checkbox]:focus:not(:checked) + .checkbox-material .check:before {
|
||||
-webkit-animation: checkbox-off 0.3s forwards;
|
||||
-o-animation: checkbox-off 0.3s forwards;
|
||||
animation: checkbox-off 0.3s forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:focus:not(:checked) + .checkbox-material .check:after,
|
||||
label.checkbox-inline input[type=checkbox]:focus:not(:checked) + .checkbox-material .check:after {
|
||||
-webkit-animation: rippleOff 500ms forwards;
|
||||
-o-animation: rippleOff 500ms forwards;
|
||||
animation: rippleOff 500ms forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked + .checkbox-material .check,
|
||||
label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check {
|
||||
color: #009688;
|
||||
|
|
@ -927,33 +961,6 @@ label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check:b
|
|||
color: #009688;
|
||||
-webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0px 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
|
||||
box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0px 32px 0 20px, -5px 5px 0 10px, 20px -12px 0 11px;
|
||||
-webkit-animation: checkbox-on 0.3s forwards;
|
||||
-o-animation: checkbox-on 0.3s forwards;
|
||||
animation: checkbox-on 0.3s forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked + .checkbox-material:before,
|
||||
label.checkbox-inline input[type=checkbox]:checked + .checkbox-material:before {
|
||||
-webkit-animation: rippleOn;
|
||||
-o-animation: rippleOn;
|
||||
animation: rippleOn;
|
||||
}
|
||||
.checkbox input[type=checkbox]:checked + .checkbox-material .check:after,
|
||||
label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check:after {
|
||||
-webkit-animation: rippleOn 500ms forwards;
|
||||
-o-animation: rippleOn 500ms forwards;
|
||||
animation: rippleOn 500ms forwards;
|
||||
}
|
||||
.checkbox input[type=checkbox]:not(:checked) + .checkbox-material:before,
|
||||
label.checkbox-inline input[type=checkbox]:not(:checked) + .checkbox-material:before {
|
||||
-webkit-animation: rippleOff;
|
||||
-o-animation: rippleOff;
|
||||
animation: rippleOff;
|
||||
}
|
||||
.checkbox input[type=checkbox]:not(:checked) + .checkbox-material .check:after,
|
||||
label.checkbox-inline input[type=checkbox]:not(:checked) + .checkbox-material .check:after {
|
||||
-webkit-animation: rippleOff 500ms forwards;
|
||||
-o-animation: rippleOff 500ms forwards;
|
||||
animation: rippleOff 500ms forwards;
|
||||
}
|
||||
fieldset[disabled] .checkbox,
|
||||
fieldset[disabled] label.checkbox-inline,
|
||||
|
|
@ -975,24 +982,6 @@ label.checkbox-inline input[type=checkbox][disabled] + .checkbox-material .check
|
|||
-o-transform: rotate(-45deg);
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.is-focused .checkbox .checkbox-material .check:before,
|
||||
.is-focused label.checkbox-inline .checkbox-material .check:before {
|
||||
-webkit-animation: checkbox-off 0.3s forwards;
|
||||
-o-animation: checkbox-off 0.3s forwards;
|
||||
animation: checkbox-off 0.3s forwards;
|
||||
}
|
||||
.is-focused .checkbox input[type=checkbox]:checked + .checkbox-material:before,
|
||||
.is-focused label.checkbox-inline input[type=checkbox]:checked + .checkbox-material:before {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-o-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.is-focused .checkbox input[type=checkbox]:not(:checked) + .checkbox-material:before,
|
||||
.is-focused label.checkbox-inline input[type=checkbox]:not(:checked) + .checkbox-material:before {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-o-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
@-webkit-keyframes checkbox-on {
|
||||
0% {
|
||||
-webkit-box-shadow: 0 0 0 10px, 10px -10px 0 10px, 32px 0 0 20px, 0px 32px 0 20px, -5px 5px 0 10px, 15px 2px 0 11px;
|
||||
|
|
@ -1426,17 +1415,17 @@ label.radio-inline .check:after {
|
|||
-webkit-transform: scale3d(1.5, 1.5, 1);
|
||||
transform: scale3d(1.5, 1.5, 1);
|
||||
}
|
||||
.radio input[type=radio]:not(:checked) ~ .check:after,
|
||||
label.radio-inline input[type=radio]:not(:checked) ~ .check:after {
|
||||
.radio input[type=radio]:focus:not(:checked) ~ .check:after,
|
||||
label.radio-inline input[type=radio]:focus:not(:checked) ~ .check:after {
|
||||
-webkit-animation: rippleOff 500ms;
|
||||
-o-animation: rippleOff 500ms;
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
.radio input[type=radio]:checked ~ .check:after,
|
||||
label.radio-inline input[type=radio]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn;
|
||||
-o-animation: rippleOn;
|
||||
animation: rippleOn;
|
||||
.radio input[type=radio]:focus:checked ~ .check:after,
|
||||
label.radio-inline input[type=radio]:focus:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-o-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
.radio input[type=radio],
|
||||
label.radio-inline input[type=radio] {
|
||||
|
|
@ -1492,12 +1481,6 @@ label.radio-inline input[type=radio][disabled] ~ .circle {
|
|||
.theme-dark label.radio-inline input[type=radio][disabled] ~ .circle {
|
||||
border-color: #ffffff;
|
||||
}
|
||||
.is-focused .radio input[type=radio]:checked ~ .check:after,
|
||||
.is-focused label.radio-inline input[type=radio]:checked ~ .check:after {
|
||||
-webkit-animation: rippleOn 500ms;
|
||||
-o-animation: rippleOn 500ms;
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
|
|||
2
dist/css/bootstrap-material-design.css.map
vendored
2
dist/css/bootstrap-material-design.css.map
vendored
File diff suppressed because one or more lines are too long
2
dist/css/bootstrap-material-design.min.css
vendored
2
dist/css/bootstrap-material-design.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
3
dist/js/material.js
vendored
3
dist/js/material.js
vendored
|
|
@ -165,9 +165,6 @@
|
|||
var validate = this.options.validate;
|
||||
|
||||
$(document)
|
||||
.on("change", ".checkbox input[type=checkbox]", function () {
|
||||
$(this).blur();
|
||||
})
|
||||
.on("keydown paste", ".form-control", function (e) {
|
||||
if (_isChar(e)) {
|
||||
$(this).closest(".form-group").removeClass("is-empty");
|
||||
|
|
|
|||
2
dist/js/material.min.js
vendored
2
dist/js/material.min.js
vendored
File diff suppressed because one or more lines are too long
2
dist/js/material.min.js.map
vendored
2
dist/js/material.min.js.map
vendored
File diff suppressed because one or more lines are too long
|
|
@ -1,8 +1,6 @@
|
|||
// This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
|
||||
|
||||
// http://www.google.com/design/spec/components/selection-controls.html#selection-controls-checkbox
|
||||
.form-group {
|
||||
}
|
||||
|
||||
.checkbox label,
|
||||
label.checkbox-inline {
|
||||
|
|
@ -31,12 +29,13 @@ label.checkbox-inline {
|
|||
vertical-align: middle;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
&:before { // FIXME: document why this is necessary (doesn't seem to be on chrome)
|
||||
&:before { // FIXME: document why this is necessary (doesn't seem to be on chrome)
|
||||
display: block;
|
||||
position: absolute;
|
||||
top:-5px;
|
||||
left: 0;
|
||||
content: "";
|
||||
background-color: rgba(0,0,0,.84);
|
||||
background-color: rgba(0, 0, 0, .84);
|
||||
height: $mdb-checkbox-size;
|
||||
width: $mdb-checkbox-size;
|
||||
border-radius: 100%;
|
||||
|
|
@ -73,7 +72,6 @@ label.checkbox-inline {
|
|||
0 0 0 0,
|
||||
0 0 0 0,
|
||||
0 0 0 0 inset;
|
||||
animation: checkbox-off;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -83,6 +81,35 @@ label.checkbox-inline {
|
|||
opacity: 0.2;
|
||||
}
|
||||
|
||||
&:focus{
|
||||
|
||||
&:checked{
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
& + .checkbox-material .check:before {
|
||||
animation: checkbox-on $mdb-checkbox-animation-check forwards;
|
||||
}
|
||||
& + .checkbox-material .check:after {
|
||||
animation: rippleOn $mdb-checkbox-animation-ripple forwards; // Ripple effect on check
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:checked) {
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
& + .checkbox-material .check:before {
|
||||
animation: checkbox-off $mdb-checkbox-animation-check forwards;
|
||||
}
|
||||
& + .checkbox-material .check:after {
|
||||
animation: rippleOff $mdb-checkbox-animation-ripple forwards; // Ripple effect on uncheck
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
&:checked {
|
||||
|
||||
// FIXME: once working - combine further to reduce code
|
||||
|
|
@ -93,32 +120,17 @@ label.checkbox-inline {
|
|||
|
||||
& + .checkbox-material .check:before {
|
||||
color: $mdb-checkbox-checked-color;
|
||||
box-shadow: 0 0 0 10px,
|
||||
box-shadow:
|
||||
0 0 0 10px,
|
||||
10px -10px 0 10px,
|
||||
32px 0 0 20px,
|
||||
0px 32px 0 20px,
|
||||
-5px 5px 0 10px,
|
||||
32px 0 0 20px,
|
||||
0px 32px 0 20px,
|
||||
-5px 5px 0 10px,
|
||||
20px -12px 0 11px;
|
||||
animation: checkbox-on $mdb-checkbox-animation-check forwards;
|
||||
}
|
||||
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOn;
|
||||
}
|
||||
|
||||
& + .checkbox-material .check:after {
|
||||
//background-color: $brand-success; // FIXME: seems like tho wrong color, test and make sure it can be removed
|
||||
animation: rippleOn $mdb-checkbox-animation-ripple forwards; // Ripple effect on check
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:checked) {
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOff;
|
||||
}
|
||||
|
||||
& + .checkbox-material .check:after {
|
||||
animation: rippleOff $mdb-checkbox-animation-ripple forwards; // Ripple effect on uncheck
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -137,30 +149,6 @@ label.checkbox-inline {
|
|||
}
|
||||
}
|
||||
|
||||
// Prevent checkbox animation and ripple effect on page load
|
||||
.is-focused {
|
||||
.checkbox,
|
||||
label.checkbox-inline {
|
||||
.checkbox-material {
|
||||
.check:before {
|
||||
animation: checkbox-off $mdb-checkbox-animation-check forwards;
|
||||
}
|
||||
}
|
||||
input[type=checkbox] {
|
||||
&:checked {
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOn $mdb-checkbox-animation-ripple;
|
||||
}
|
||||
}
|
||||
&:not(:checked) {
|
||||
& + .checkbox-material:before {
|
||||
animation: rippleOff $mdb-checkbox-animation-ripple;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes checkbox-on {
|
||||
0% {
|
||||
box-shadow:
|
||||
|
|
|
|||
|
|
@ -59,11 +59,12 @@
|
|||
margin: 0;
|
||||
transform: scale3d(1.5, 1.5, 1);
|
||||
}
|
||||
input[type=radio]:not(:checked) ~ .check:after {
|
||||
|
||||
input[type=radio]:focus:not(:checked) ~ .check:after {
|
||||
animation: rippleOff 500ms;
|
||||
}
|
||||
input[type=radio]:checked ~ .check:after {
|
||||
animation: rippleOn;
|
||||
input[type=radio]:focus:checked ~ .check:after {
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
|
||||
input[type=radio] {
|
||||
|
|
@ -92,15 +93,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
// Prevent ripple effect on page load
|
||||
.is-focused {
|
||||
.radio, label.radio-inline {
|
||||
input[type=radio]:checked ~ .check:after {
|
||||
animation: rippleOn 500ms;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rippleOn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
@ -112,7 +104,6 @@
|
|||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rippleOff {
|
||||
0% {
|
||||
opacity: 0;
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user