/
guselnikov
/
inst
Обзор
Документация
Войти
/
guselnikov
/
inst
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
admin/src/components/ui/Input.module.css
106 строк
2 KB
Viktor Guselnikov
first_commit
07 июл 2026, 11:54
07 июл 2026, 11:54
098126a
Код
Авторство
О чём код?
.field { display: flex; flex-direction: column; gap: 6px; } .label { font-size: 12px; font-weight: 500; letter-spacing: 0.02em; color: var(--text-muted); text-transform: uppercase; } .required { color: var(--accent); margin-left: 2px; } .inputWrap { position: relative; display: flex; align-items: center; } .icon { position: absolute; left: 14px; color: var(--text-faint); pointer-events: none; } .input { width: 100%; min-height: 44px; padding: 10px 14px; border: none; border-radius: var(--radius-sm); background: var(--bg-muted); box-shadow: var(--shadow-inset); color: var(--text-primary); font-size: 14px; transition: background var(--transition), box-shadow var(--transition); } .inputWithIcon { padding-left: 42px; } .inputWithToggle { padding-right: 44px; } .input::placeholder { color: var(--text-faint); } .input:hover { background: var(--bg-elevated); } .input:focus { outline: none; background: var(--bg-elevated); box-shadow: var(--shadow-inset), 0 0 0 1px var(--border-focus); } .toggle { position: absolute; right: 4px; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: none; border-radius: var(--radius-xs); background: transparent; color: var(--text-muted); cursor: pointer; transition: color var(--transition); } .toggle:hover { color: var(--text-secondary); } .hint { font-size: 12px; color: var(--text-faint); } .error { font-size: 12px; color: var(--danger); } .hasError .input { box-shadow: var(--shadow-inset), 0 0 0 1px var(--danger); }