Files
Тимур Городецкий 7623425d97 feat: initial design system v1.0.0 (tokens, mixins, guide)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-02 10:18:16 +05:00

59 lines
1.7 KiB
SCSS

// ============================================
// @tansu/design-system — Runtime CSS Variables
//
// Этот файл ПРОИЗВОДИТ CSS (:root{...}), поэтому подключай его
// РОВНО ОДИН РАЗ на веб-часть — в корневом .module.scss компонента:
//
// @import '~@tansu/design-system/styles/global';
//
// Нужен только если читаешь переменные в рантайме — например
// в инлайн-стилях (style={{ color: 'var(--gold-500)' }}) или для
// динамической темизации. Для обычной SCSS-вёрстки хватает _tokens.scss.
// ============================================
@import 'tokens';
:root {
--navy-950: #{$navy-950};
--navy-900: #{$navy-900};
--navy-800: #{$navy-800};
--navy-700: #{$navy-700};
--navy-600: #{$navy-600};
--navy-100: #{$navy-100};
--navy-50: #{$navy-50};
--gold-600: #{$gold-600};
--gold-500: #{$gold-500};
--gold-400: #{$gold-400};
--gold-300: #{$gold-300};
--gold-100: #{$gold-100};
--gold-50: #{$gold-50};
--gray-900: #{$gray-900};
--gray-700: #{$gray-700};
--gray-500: #{$gray-500};
--gray-400: #{$gray-400};
--gray-300: #{$gray-300};
--gray-200: #{$gray-200};
--gray-100: #{$gray-100};
--gray-50: #{$gray-50};
--red-500: #{$red-500};
--red-50: #{$red-50};
--green-600: #{$green-600};
--green-50: #{$green-50};
--blue-600: #{$blue-600};
--blue-50: #{$blue-50};
--amber-700: #{$amber-700};
--sh-1: #{$sh-1};
--sh-2: #{$sh-2};
--sh-3: #{$sh-3};
--sh-gold: #{$sh-gold};
--sh-modal: #{$sh-modal};
--r-sm: #{$r-sm};
--r-md: #{$r-md};
--r-lg: #{$r-lg};
}