Дизайн-система
Компоненты и токены палитры кита во всех вариантах и состояниях.
Основы
Цвета
Токены палитры Gravity в обеих темах: поверхности, текст, линии, бренд.
Типографика
Шкала кита в пикселях — от витринных заголовков до кода и сносок.
Шкалы
Радиусы и отступы кита, наши тени и длительности — единой лестницей.
Действия
Кнопка
Оформление, размеры и состояния — из общего каталога сценариев.
Переключатель
Одиночная кнопка с состоянием нажатия — на родном `selected` кита.
Группа переключателей
Набор взаимоисключающих вариантов — радиогруппа кита с работой с клавиатуры.
Переключатель темы
Светлая, системная, тёмная — три варианта на `ToggleGroup` и `next-themes`.
Переключатель языка
Русский, английский — переход на тот же путь с другим языковым сегментом.
Шторка
Выезжающая панель — мобильный режим сайдбара и вспомогательные формы.
Сайдбар
Боковая навигация: группы, пункты меню, сворачивание, шторка на мобильном.
Ввод данных
Поле ввода
Текстовое поле с подписью — обычное, отключённое, ошибка, загрузка.
Подпись поля
Подпись для элемента ввода — не встречается в интерфейсе без поля.
Отображение данных
Карточка
Статичный контейнер: наведение, фокус и ошибку несут элементы внутри.
Значок
Статус сигнала или репозитория — вариантами оформления, статично или ссылкой.
Разделитель
Декоративная линия между смысловыми блоками — горизонтальная и вертикальная.
Обратная связь
Оповещение
Статичный блок сообщения — успех, ошибка с действием, фоновая загрузка.
Скелетон
Заготовка макета на время загрузки — вместо пустого экрана или спиннера.
Индикатор ожидания
Вращение для кнопок и полей в состоянии загрузки.
Подсказка
Всплывающая подсказка при наведении или фокусе — короткая, без действий.