Sha256: 9a616d05d0ef1407b1317aee8da44a8541fa1e8bcd2baeec3d2ddf3c1078bea4
Contents?: true
Size: 1.11 KB
Versions: 10
Compression:
Stored size: 1.11 KB
Contents
$switch-width: 3.75rem;
$switch-height: 1.75rem;
$switch-slot-height: 1.375rem;
tao-switch {
display: inline-block;
.switch-wrapper {
width: $switch-width;
height: $switch-height;
position: relative;
.switch-toggle {
width: 1.75rem;
height: 1.75rem;
background-color: $white-color;
margin-left: 0;
border: 1px solid $border-color;
border-radius: 50%;
box-shadow: 0 0 5px rgba(0,0,0,0.1);
transition: margin-left 0.2s;
position: relative;
z-index: 1;
}
.switch-slot {
width: $switch-width;
height: $switch-slot-height;
background-color: $light-line-color;
border-radius: 2.25rem;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-$switch-slot-height / 2);
transition: background-color 0.2s;
}
}
input[type=checkbox] {
display: none;
&:checked + .switch-wrapper {
.switch-toggle {
margin-left: 2rem;
}
.switch-slot {
background-color: $ui-color;
}
}
&:disabled + .switch-wrapper {
opacity: 0.5;
}
}
}
Version data entries
10 entries across 10 versions & 1 rubygems