This commit is contained in:
FezVrasta 2015-03-16 14:47:55 +01:00
parent a4372ffcc5
commit 2f7d6791eb
8 changed files with 1412 additions and 1412 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

188
dist/css/material.css vendored
View File

@ -4120,13 +4120,13 @@ body .jumbotron-material-blue-grey,
font-weight: 400;
cursor: pointer;
}
.togglebutton label input[type=checkbox]:first-of-type {
.togglebutton label input[type=checkbox] {
opacity: 0;
width: 0;
height: 0;
}
.togglebutton label .toggle,
.togglebutton label input[type=checkbox][disabled]:first-of-type + .toggle {
.togglebutton label input[type=checkbox][disabled] + .toggle {
content: "";
display: inline-block;
width: 30px;
@ -4150,270 +4150,270 @@ body .jumbotron-material-blue-grey,
top: -2px;
transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
}
.togglebutton label input[type=checkbox][disabled]:first-of-type + .toggle:after,
.togglebutton label input[type=checkbox][disabled]:checked:first-of-type + .toggle:after {
.togglebutton label input[type=checkbox][disabled] + .toggle:after,
.togglebutton label input[type=checkbox][disabled]:checked + .toggle:after {
background-color: #BDBDBD;
}
.togglebutton label input[type=checkbox]:first-of-type + .toggle:active:after,
.togglebutton label input[type=checkbox][disabled]:first-of-type + .toggle:active:after {
.togglebutton label input[type=checkbox] + .toggle:active:after,
.togglebutton label input[type=checkbox][disabled] + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
}
.togglebutton label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton label input[type=checkbox]:checked + .toggle:after {
left: 15px;
}
.togglebutton label input[type=checkbox]:first-of-type:checked + .toggle,
.togglebutton-default label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton label input[type=checkbox]:checked + .toggle,
.togglebutton-default label input[type=checkbox]:checked + .toggle {
background-color: rgba(0, 149, 135, 0.5);
}
.togglebutton-black label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-black label input[type=checkbox]:checked + .toggle {
background-color: rgba(0, 0, 0, 0.5);
}
.togglebutton-white label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-white label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 255, 255, 0.5);
}
.togglebutton-inverse label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-inverse label input[type=checkbox]:checked + .toggle {
background-color: rgba(63, 81, 181, 0.5);
}
.togglebutton-primary label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-primary label input[type=checkbox]:checked + .toggle {
background-color: rgba(0, 149, 135, 0.5);
}
.togglebutton-success label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-success label input[type=checkbox]:checked + .toggle {
background-color: rgba(15, 157, 88, 0.5);
}
.togglebutton-info label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-info label input[type=checkbox]:checked + .toggle {
background-color: rgba(3, 169, 244, 0.5);
}
.togglebutton-warning label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-warning label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 87, 34, 0.5);
}
.togglebutton-danger label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-danger label input[type=checkbox]:checked + .toggle {
background-color: rgba(244, 67, 54, 0.5);
}
.togglebutton-material-red label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-red label input[type=checkbox]:checked + .toggle {
background-color: rgba(244, 67, 54, 0.5);
}
.togglebutton-material-pink label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-pink label input[type=checkbox]:checked + .toggle {
background-color: rgba(233, 30, 99, 0.5);
}
.togglebutton-material-purple label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-purple label input[type=checkbox]:checked + .toggle {
background-color: rgba(156, 39, 176, 0.5);
}
.togglebutton-material-deep-purple label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-deep-purple label input[type=checkbox]:checked + .toggle {
background-color: rgba(103, 58, 183, 0.5);
}
.togglebutton-material-indigo label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-indigo label input[type=checkbox]:checked + .toggle {
background-color: rgba(63, 81, 181, 0.5);
}
.togglebutton-material-blue label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-blue label input[type=checkbox]:checked + .toggle {
background-color: rgba(33, 150, 243, 0.5);
}
.togglebutton-material-light-blue label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-light-blue label input[type=checkbox]:checked + .toggle {
background-color: rgba(3, 169, 244, 0.5);
}
.togglebutton-material-cyan label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-cyan label input[type=checkbox]:checked + .toggle {
background-color: rgba(0, 188, 212, 0.5);
}
.togglebutton-material-teal label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-teal label input[type=checkbox]:checked + .toggle {
background-color: rgba(0, 150, 136, 0.5);
}
.togglebutton-material-green label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-green label input[type=checkbox]:checked + .toggle {
background-color: rgba(76, 175, 80, 0.5);
}
.togglebutton-material-light-green label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-light-green label input[type=checkbox]:checked + .toggle {
background-color: rgba(139, 195, 74, 0.5);
}
.togglebutton-material-lime label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-lime label input[type=checkbox]:checked + .toggle {
background-color: rgba(205, 220, 57, 0.5);
}
.togglebutton-material-yellow label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-yellow label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 235, 59, 0.5);
}
.togglebutton-material-amber label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-amber label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 193, 7, 0.5);
}
.togglebutton-material-orange label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-orange label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 152, 0, 0.5);
}
.togglebutton-material-deep-orange label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-deep-orange label input[type=checkbox]:checked + .toggle {
background-color: rgba(255, 87, 34, 0.5);
}
.togglebutton-material-brown label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-brown label input[type=checkbox]:checked + .toggle {
background-color: rgba(121, 85, 72, 0.5);
}
.togglebutton-material-grey label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-grey label input[type=checkbox]:checked + .toggle {
background-color: rgba(158, 158, 158, 0.5);
}
.togglebutton-material-blue-grey label input[type=checkbox]:first-of-type:checked + .toggle {
.togglebutton-material-blue-grey label input[type=checkbox]:checked + .toggle {
background-color: rgba(96, 125, 139, 0.5);
}
.togglebutton label input[type=checkbox]:first-of-type:checked + .toggle:after,
.togglebutton-default label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton label input[type=checkbox]:checked + .toggle:after,
.togglebutton-default label input[type=checkbox]:checked + .toggle:after {
background-color: #009587;
}
.togglebutton-black label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-black label input[type=checkbox]:checked + .toggle:after {
background-color: #000000;
}
.togglebutton-white label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-white label input[type=checkbox]:checked + .toggle:after {
background-color: #ffffff;
}
.togglebutton-inverse label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-inverse label input[type=checkbox]:checked + .toggle:after {
background-color: #3f51b5;
}
.togglebutton-primary label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-primary label input[type=checkbox]:checked + .toggle:after {
background-color: #009587;
}
.togglebutton-success label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-success label input[type=checkbox]:checked + .toggle:after {
background-color: #0f9d58;
}
.togglebutton-info label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-info label input[type=checkbox]:checked + .toggle:after {
background-color: #03a9f4;
}
.togglebutton-warning label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-warning label input[type=checkbox]:checked + .toggle:after {
background-color: #ff5722;
}
.togglebutton-danger label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-danger label input[type=checkbox]:checked + .toggle:after {
background-color: #f44336;
}
.togglebutton-material-red label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-red label input[type=checkbox]:checked + .toggle:after {
background-color: #f44336;
}
.togglebutton-material-pink label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-pink label input[type=checkbox]:checked + .toggle:after {
background-color: #e91e63;
}
.togglebutton-material-purple label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-purple label input[type=checkbox]:checked + .toggle:after {
background-color: #9c27b0;
}
.togglebutton-material-deep-purple label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-deep-purple label input[type=checkbox]:checked + .toggle:after {
background-color: #673ab7;
}
.togglebutton-material-indigo label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-indigo label input[type=checkbox]:checked + .toggle:after {
background-color: #3f51b5;
}
.togglebutton-material-blue label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-blue label input[type=checkbox]:checked + .toggle:after {
background-color: #2196f3;
}
.togglebutton-material-light-blue label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-light-blue label input[type=checkbox]:checked + .toggle:after {
background-color: #03a9f4;
}
.togglebutton-material-cyan label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-cyan label input[type=checkbox]:checked + .toggle:after {
background-color: #00bcd4;
}
.togglebutton-material-teal label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-teal label input[type=checkbox]:checked + .toggle:after {
background-color: #009688;
}
.togglebutton-material-green label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-green label input[type=checkbox]:checked + .toggle:after {
background-color: #4caf50;
}
.togglebutton-material-light-green label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-light-green label input[type=checkbox]:checked + .toggle:after {
background-color: #8bc34a;
}
.togglebutton-material-lime label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-lime label input[type=checkbox]:checked + .toggle:after {
background-color: #cddc39;
}
.togglebutton-material-yellow label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-yellow label input[type=checkbox]:checked + .toggle:after {
background-color: #ffeb3b;
}
.togglebutton-material-amber label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-amber label input[type=checkbox]:checked + .toggle:after {
background-color: #ffc107;
}
.togglebutton-material-orange label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-orange label input[type=checkbox]:checked + .toggle:after {
background-color: #ff9800;
}
.togglebutton-material-deep-orange label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-deep-orange label input[type=checkbox]:checked + .toggle:after {
background-color: #ff5722;
}
.togglebutton-material-brown label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-brown label input[type=checkbox]:checked + .toggle:after {
background-color: #795548;
}
.togglebutton-material-grey label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-grey label input[type=checkbox]:checked + .toggle:after {
background-color: #9e9e9e;
}
.togglebutton-material-blue-grey label input[type=checkbox]:first-of-type:checked + .toggle:after {
.togglebutton-material-blue-grey label input[type=checkbox]:checked + .toggle:after {
background-color: #607d8b;
}
.togglebutton label input[type=checkbox]:first-of-type:checked + .toggle:active:after,
.togglebutton-default label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton label input[type=checkbox]:checked + .toggle:active:after,
.togglebutton-default label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 149, 135, 0.1);
}
.togglebutton-black label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-black label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
}
.togglebutton-white label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-white label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 255, 255, 0.1);
}
.togglebutton-inverse label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-inverse label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(63, 81, 181, 0.1);
}
.togglebutton-primary label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-primary label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 149, 135, 0.1);
}
.togglebutton-success label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-success label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(15, 157, 88, 0.1);
}
.togglebutton-info label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-info label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(3, 169, 244, 0.1);
}
.togglebutton-warning label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-warning label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 87, 34, 0.1);
}
.togglebutton-danger label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-danger label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(244, 67, 54, 0.1);
}
.togglebutton-material-red label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-red label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(244, 67, 54, 0.1);
}
.togglebutton-material-pink label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-pink label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(233, 30, 99, 0.1);
}
.togglebutton-material-purple label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-purple label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(156, 39, 176, 0.1);
}
.togglebutton-material-deep-purple label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-deep-purple label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(103, 58, 183, 0.1);
}
.togglebutton-material-indigo label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-indigo label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(63, 81, 181, 0.1);
}
.togglebutton-material-blue label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-blue label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(33, 150, 243, 0.1);
}
.togglebutton-material-light-blue label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-light-blue label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(3, 169, 244, 0.1);
}
.togglebutton-material-cyan label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-cyan label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 188, 212, 0.1);
}
.togglebutton-material-teal label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-teal label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1);
}
.togglebutton-material-green label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-green label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(76, 175, 80, 0.1);
}
.togglebutton-material-light-green label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-light-green label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(139, 195, 74, 0.1);
}
.togglebutton-material-lime label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-lime label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(205, 220, 57, 0.1);
}
.togglebutton-material-yellow label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-yellow label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 235, 59, 0.1);
}
.togglebutton-material-amber label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-amber label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 193, 7, 0.1);
}
.togglebutton-material-orange label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-orange label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 152, 0, 0.1);
}
.togglebutton-material-deep-orange label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-deep-orange label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 87, 34, 0.1);
}
.togglebutton-material-brown label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-brown label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(121, 85, 72, 0.1);
}
.togglebutton-material-grey label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-grey label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(158, 158, 158, 0.1);
}
.togglebutton-material-blue-grey label input[type=checkbox]:first-of-type:checked + .toggle:active:after {
.togglebutton-material-blue-grey label input[type=checkbox]:checked + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(96, 125, 139, 0.1);
}
.form-horizontal .radio {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -7,14 +7,14 @@
font-weight: 400;
cursor: pointer;
// Hide original checkbox
input[type=checkbox]:first-of-type {
input[type=checkbox] {
opacity: 0;
width: 0;
height:0;
}
// Switch bg off and disabled
.toggle,
input[type=checkbox][disabled]:first-of-type + .toggle {
input[type=checkbox][disabled] + .toggle {
content: "";
display: inline-block;
width: 30px;
@ -40,28 +40,28 @@
transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
}
// Handle disabled
input[type=checkbox][disabled]:first-of-type + .toggle:after,
input[type=checkbox][disabled]:checked:first-of-type + .toggle:after{
input[type=checkbox][disabled] + .toggle:after,
input[type=checkbox][disabled]:checked + .toggle:after{
background-color: #BDBDBD;
}
// Ripple off and disabled
input[type=checkbox]:first-of-type + .toggle:active:after,
input[type=checkbox][disabled]:first-of-type + .toggle:active:after {
input[type=checkbox] + .toggle:active:after,
input[type=checkbox][disabled] + .toggle:active:after {
box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
}
input[type=checkbox]:first-of-type:checked + .toggle:after {
input[type=checkbox]:checked + .toggle:after {
left: 15px;
}
}
// Switch bg on
.generic-variations(~" label input[type=checkbox]:first-of-type:checked + .toggle", @primary, {
.generic-variations(~" label input[type=checkbox]:checked + .toggle", @primary, {
background-color: fade(@material-color, 50%);
});
// Handle on
.variations(~" label input[type=checkbox]:first-of-type:checked + .toggle:after", background-color, @primary);
.variations(~" label input[type=checkbox]:checked + .toggle:after", background-color, @primary);
// Ripple on
.generic-variations(~" label input[type=checkbox]:first-of-type:checked + .toggle:active:after", @primary, {
.generic-variations(~" label input[type=checkbox]:checked + .toggle:active:after", @primary, {
box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4), 0 0 0 15px fade(@material-color, 10%);
});
}