40 lines
No EOL
741 B
CSS
40 lines
No EOL
741 B
CSS
label.slider {
|
|
display: inline-block;
|
|
background: #ccc;
|
|
border: 2px solid #ccc;
|
|
width: 34px;
|
|
height: 20px;
|
|
margin: 0 30px 0 5px;
|
|
border-radius: 10px;
|
|
vertical-align: middle!important;
|
|
box-sizing: border-box;
|
|
transition: 0.05s 0.05s;
|
|
cursor: pointer;
|
|
position: relative;
|
|
}
|
|
|
|
label.slider::before {
|
|
content: '';
|
|
display: block;
|
|
width: 16px;
|
|
height: 16px;
|
|
background: #f9f9f9;
|
|
border: 1px solid #fff;
|
|
box-sizing: border-box;
|
|
border-radius: 50%;
|
|
transition: 0.1s;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
display: none;
|
|
}
|
|
|
|
input[type="checkbox"]:checked + label.slider {
|
|
background: #6e1edc;
|
|
border-color: #6e1edc;
|
|
}
|
|
|
|
input[type="checkbox"]:checked + label.slider::before {
|
|
transform: translateX(14px);
|
|
} |