-@import '_variables';
-@import '_mixins';
+@use '_variables' as *;
+@use '_mixins' as *;
input {
position: absolute;
visibility: hidden;
- & + label {
+ + label {
cursor: pointer;
text-indent: -9999px;
width: 35px;
position: relative;
margin: 0;
- &:after {
+ &::after {
content: '';
position: absolute;
top: 3px;
transition: 0.3s ease-out;
}
- &:active:after {
+ &:active::after {
width: 40px;
}
}
&:checked + label {
background: pvar(--mainColor);
- &:after {
+ &::after {
left: calc(100% - 3px);
transform: translateX(-100%);
}