mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2025-07-27 08:29:53 +03:00
nesting selectors for better readability and removing unused code
This commit is contained in:
parent
eb92b726e4
commit
d1041d959b
|
@ -30,6 +30,7 @@ label.checkbox-inline {
|
||||||
&: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);
|
||||||
|
@ -78,7 +79,9 @@ label.checkbox-inline {
|
||||||
opacity: 0.2;
|
opacity: 0.2;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus:checked{
|
&:focus{
|
||||||
|
|
||||||
|
&:checked{
|
||||||
& + .checkbox-material:before {
|
& + .checkbox-material:before {
|
||||||
animation: rippleOn 500ms;
|
animation: rippleOn 500ms;
|
||||||
}
|
}
|
||||||
|
@ -90,7 +93,7 @@ label.checkbox-inline {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:focus:not(:checked){
|
&:not(:checked) {
|
||||||
& + .checkbox-material:before {
|
& + .checkbox-material:before {
|
||||||
animation: rippleOff 500ms;
|
animation: rippleOff 500ms;
|
||||||
}
|
}
|
||||||
|
@ -102,6 +105,8 @@ label.checkbox-inline {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
&:checked {
|
&:checked {
|
||||||
|
|
||||||
|
@ -120,26 +125,10 @@ label.checkbox-inline {
|
||||||
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 500ms;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
& + .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 500ms;
|
|
||||||
}
|
|
||||||
|
|
||||||
& + .checkbox-material .check:after {
|
|
||||||
//animation: rippleOff @mdb-checkbox-animation-ripple forwards; // Ripple effect on uncheck
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -158,30 +147,6 @@ label.checkbox-inline {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Prevent checkbox animation and ripple effect on page load - removed in favour of supporting animation without .form-group
|
|
||||||
/*.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:
|
||||||
|
|
|
@ -91,15 +91,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Prevent ripple effect on page load - removed for supporting animation without .form-group
|
|
||||||
/*.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;
|
||||||
|
|
|
@ -165,10 +165,6 @@
|
||||||
var validate = this.options.validate;
|
var validate = this.options.validate;
|
||||||
|
|
||||||
$(document)
|
$(document)
|
||||||
/* removed in favour of supporting animation without .form-group using :focus */
|
|
||||||
/*.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");
|
||||||
|
|
Loading…
Reference in New Issue
Block a user