mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-13 13:17:03 +03:00
dist
This commit is contained in:
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 {
|
label.checkbox-inline .checkbox-material:before {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
top: -5px;
|
||||||
left: 0;
|
left: 0;
|
||||||
content: "";
|
content: "";
|
||||||
background-color: rgba(0, 0, 0, 0.84);
|
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,
|
0 0 0 0,
|
||||||
0 0 0 0 inset;
|
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,
|
.checkbox input[type=checkbox]:focus + .checkbox-material .check:after,
|
||||||
label.checkbox-inline input[type=checkbox]:focus + .checkbox-material .check:after {
|
label.checkbox-inline input[type=checkbox]:focus + .checkbox-material .check:after {
|
||||||
opacity: 0.2;
|
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,
|
.checkbox input[type=checkbox]:checked + .checkbox-material .check,
|
||||||
label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check {
|
label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check {
|
||||||
color: #009688;
|
color: #009688;
|
||||||
|
@ -927,33 +961,6 @@ label.checkbox-inline input[type=checkbox]:checked + .checkbox-material .check:b
|
||||||
color: #009688;
|
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;
|
-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;
|
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] .checkbox,
|
||||||
fieldset[disabled] label.checkbox-inline,
|
fieldset[disabled] label.checkbox-inline,
|
||||||
|
@ -975,24 +982,6 @@ label.checkbox-inline input[type=checkbox][disabled] + .checkbox-material .check
|
||||||
-o-transform: rotate(-45deg);
|
-o-transform: rotate(-45deg);
|
||||||
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 {
|
@-webkit-keyframes checkbox-on {
|
||||||
0% {
|
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;
|
-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);
|
-webkit-transform: scale3d(1.5, 1.5, 1);
|
||||||
transform: scale3d(1.5, 1.5, 1);
|
transform: scale3d(1.5, 1.5, 1);
|
||||||
}
|
}
|
||||||
.radio input[type=radio]:not(:checked) ~ .check:after,
|
.radio input[type=radio]:focus:not(:checked) ~ .check:after,
|
||||||
label.radio-inline input[type=radio]:not(:checked) ~ .check:after {
|
label.radio-inline input[type=radio]:focus:not(:checked) ~ .check:after {
|
||||||
-webkit-animation: rippleOff 500ms;
|
-webkit-animation: rippleOff 500ms;
|
||||||
-o-animation: rippleOff 500ms;
|
-o-animation: rippleOff 500ms;
|
||||||
animation: rippleOff 500ms;
|
animation: rippleOff 500ms;
|
||||||
}
|
}
|
||||||
.radio input[type=radio]:checked ~ .check:after,
|
.radio input[type=radio]:focus:checked ~ .check:after,
|
||||||
label.radio-inline input[type=radio]:checked ~ .check:after {
|
label.radio-inline input[type=radio]:focus:checked ~ .check:after {
|
||||||
-webkit-animation: rippleOn;
|
-webkit-animation: rippleOn 500ms;
|
||||||
-o-animation: rippleOn;
|
-o-animation: rippleOn 500ms;
|
||||||
animation: rippleOn;
|
animation: rippleOn 500ms;
|
||||||
}
|
}
|
||||||
.radio input[type=radio],
|
.radio input[type=radio],
|
||||||
label.radio-inline 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 {
|
.theme-dark label.radio-inline input[type=radio][disabled] ~ .circle {
|
||||||
border-color: #ffffff;
|
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 {
|
@keyframes rippleOn {
|
||||||
0% {
|
0% {
|
||||||
opacity: 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;
|
var validate = this.options.validate;
|
||||||
|
|
||||||
$(document)
|
$(document)
|
||||||
.on("change", ".checkbox input[type=checkbox]", function () {
|
|
||||||
$(this).blur();
|
|
||||||
})
|
|
||||||
.on("keydown paste", ".form-control", function (e) {
|
.on("keydown paste", ".form-control", function (e) {
|
||||||
if (_isChar(e)) {
|
if (_isChar(e)) {
|
||||||
$(this).closest(".form-group").removeClass("is-empty");
|
$(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.
|
// 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
|
// http://www.google.com/design/spec/components/selection-controls.html#selection-controls-checkbox
|
||||||
.form-group {
|
|
||||||
}
|
|
||||||
|
|
||||||
.checkbox label,
|
.checkbox label,
|
||||||
label.checkbox-inline {
|
label.checkbox-inline {
|
||||||
|
@ -31,12 +29,13 @@ label.checkbox-inline {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 3px;
|
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;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
top:-5px;
|
||||||
left: 0;
|
left: 0;
|
||||||
content: "";
|
content: "";
|
||||||
background-color: rgba(0,0,0,.84);
|
background-color: rgba(0, 0, 0, .84);
|
||||||
height: $mdb-checkbox-size;
|
height: $mdb-checkbox-size;
|
||||||
width: $mdb-checkbox-size;
|
width: $mdb-checkbox-size;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
|
@ -73,7 +72,6 @@ label.checkbox-inline {
|
||||||
0 0 0 0,
|
0 0 0 0,
|
||||||
0 0 0 0,
|
0 0 0 0,
|
||||||
0 0 0 0 inset;
|
0 0 0 0 inset;
|
||||||
animation: checkbox-off;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -82,7 +80,36 @@ label.checkbox-inline {
|
||||||
&:focus + .checkbox-material .check:after {
|
&:focus + .checkbox-material .check:after {
|
||||||
opacity: 0.2;
|
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 {
|
&:checked {
|
||||||
|
|
||||||
// FIXME: once working - combine further to reduce code
|
// FIXME: once working - combine further to reduce code
|
||||||
|
@ -93,32 +120,17 @@ label.checkbox-inline {
|
||||||
|
|
||||||
& + .checkbox-material .check:before {
|
& + .checkbox-material .check:before {
|
||||||
color: $mdb-checkbox-checked-color;
|
color: $mdb-checkbox-checked-color;
|
||||||
box-shadow: 0 0 0 10px,
|
box-shadow:
|
||||||
|
0 0 0 10px,
|
||||||
10px -10px 0 10px,
|
10px -10px 0 10px,
|
||||||
32px 0 0 20px,
|
32px 0 0 20px,
|
||||||
0px 32px 0 20px,
|
0px 32px 0 20px,
|
||||||
-5px 5px 0 10px,
|
-5px 5px 0 10px,
|
||||||
20px -12px 0 11px;
|
20px -12px 0 11px;
|
||||||
animation: checkbox-on $mdb-checkbox-animation-check forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
& + .checkbox-material:before {
|
|
||||||
animation: rippleOn;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& + .checkbox-material .check:after {
|
& + .checkbox-material .check:after {
|
||||||
//background-color: $brand-success; // FIXME: seems like tho wrong color, test and make sure it can be removed
|
//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 {
|
@keyframes checkbox-on {
|
||||||
0% {
|
0% {
|
||||||
box-shadow:
|
box-shadow:
|
||||||
|
|
|
@ -59,11 +59,12 @@
|
||||||
margin: 0;
|
margin: 0;
|
||||||
transform: scale3d(1.5, 1.5, 1);
|
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;
|
animation: rippleOff 500ms;
|
||||||
}
|
}
|
||||||
input[type=radio]:checked ~ .check:after {
|
input[type=radio]:focus:checked ~ .check:after {
|
||||||
animation: rippleOn;
|
animation: rippleOn 500ms;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type=radio] {
|
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 {
|
@keyframes rippleOn {
|
||||||
0% {
|
0% {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
@ -112,7 +104,6 @@
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes rippleOff {
|
@keyframes rippleOff {
|
||||||
0% {
|
0% {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
|
|
Loading…
Reference in New Issue
Block a user