/
Alex_Ural
/
opencode
Обзор
Документация
Войти
/
Alex_Ural
/
opencode
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
dev
packages/console/app/src/component/dropdown.css
80 строк
2 KB
Dax Raad
big format
06 ноя 2025, 21:03
06 ноя 2025, 21:03
1ea3a8e
Код
Авторство
О чём код?
[data-component="dropdown"] { position: relative; [data-slot="trigger"] { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: var(--space-2) var(--space-3); border: none; border-radius: var(--border-radius-sm); background-color: transparent; color: var(--color-text); font-size: var(--font-size-sm); font-family: var(--font-sans); cursor: pointer; transition: all 0.15s ease; &:hover { background-color: var(--color-surface-hover); } span { flex: 1; text-align: left; font-weight: 500; } } [data-slot="chevron"] { flex-shrink: 0; color: var(--color-text-secondary); } [data-slot="dropdown"] { position: absolute; top: 100%; z-index: 1000; margin-top: var(--space-1); border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); background-color: var(--color-bg); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); min-width: 160px; &[data-align="left"] { left: 0; } &[data-align="right"] { right: 0; } @media (prefers-color-scheme: dark) { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); } } [data-slot="item"] { display: block; width: 100%; padding: var(--space-2-5) var(--space-3); border: none; background: none; color: var(--color-text); font-size: var(--font-size-sm); font-family: var(--font-sans); text-align: left; cursor: pointer; transition: background-color 0.15s ease; &:hover { background-color: var(--color-bg-surface); } &[data-selected="true"] { background-color: var(--color-accent-alpha); } } }