/
jonca3d
/
react-animation-ts
Обзор
Документация
Войти
/
jonca3d
/
react-animation-ts
Код
Запросы
0
Задачи
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
src/components/Toggle/toggle.module.scss
43 строки
771 B
Evgeniy
update proj
10 окт 2024, 18:17
10 окт 2024, 18:17
cdc0030
Код
Авторство
О чём код?
input[type=checkbox]{ height: 0; width: 0; visibility: hidden; } .label { cursor: pointer; text-indent: -9999px; width: 60px; height: 20px; background: grey; display: block; border-radius: 100px; position: relative; margin-top: 2rem; margin-right: 1rem; } .label:after { content: ''; position: absolute; top: 5px; left: 5px; width: 10px; height: 10px; background: #fff; border-radius: 20px; transition: 0.3s; } input:checked + .label { background: #bada55; } input:checked + .label:after { left: calc(100% - 5px); transform: translateX(-100%); } .label:active:after { width: 30px; }