Стилизация

Охват

• Токены: глобальные дизайн-токены из @vega-ui/tokens-core
• Темы: слои светлой и тёмной темы из @vega-ui/theme-core
• CSS-переменные: как глобальные переменные и переменные компонентов сочетаются в реальных приложениях

Источник истины

• packages/tokens/src/*.css: исходные определения токенов
• packages/theme/src/*.css: семантические слои темы
• packages/ui/src/**/style.module.css: точки переопределения на уровне компонентов

Ментальная модель

Используйте систему стилизации в таком порядке:

1. импортируйте глобальные токены
2. примените класс темы, например .light или .dark
3. используйте семантические переменные в компонентах
4. применяйте локальные переменные компонента --component-* только для точечных переопределений