@channel.io/bezier-tokens 0.3.3-beta.3 → 0.3.3-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,694 +1,694 @@
1
1
 
2
- $beta-backdrop-large: 60px !default;
3
- $beta-backdrop-small: 6px !default;
4
- $beta-border-default: 0 0 0 1px #00000014 !default;
5
- $beta-border-bottom: 0 -1px 0 0 #00000014 !default;
6
- $beta-border-right: -1px 0 0 0 #00000014 !default;
7
- $beta-border-left: 1px 0 0 0 #00000014 !default;
8
- $beta-border-top: 0 1px 0 0 #00000014 !default;
9
- $beta-border-white-high: 0 0 0 1px #ffffffff !default;
10
- $beta-border-white-higher: 0 0 0 1px #ffffffff !default;
11
- $beta-border-white-highest: 0 0 0 1px #ffffffff !default;
12
- $beta-elevation-1: 0 1px 2px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
13
- $beta-elevation-2: 0 2px 6px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
14
- $beta-elevation-3: 0 4px 12px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
15
- $beta-elevation-4: 0 4px 24px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
16
- $beta-elevation-5: 0 6px 40px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
17
- $beta-elevation-6: 0 12px 60px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
18
- $beta-layer-z-index-base: 0 !default;
19
- $beta-layer-z-index-floating: 1 !default;
20
- $beta-layer-z-index-overlay: 1000 !default;
21
- $beta-layer-z-index-modal: 1100 !default;
22
- $beta-layer-z-index-toast: 1200 !default;
23
- $beta-layer-z-index-tooltip: 1300 !default;
24
- $beta-layer-z-index-hidden: -1 !default;
25
- $beta-layer-z-index-important: 2000 !default;
26
- $beta-motion-transition-fast: 150ms cubic-bezier(0.3, 0, 0, 1) !default;
27
- $beta-motion-transition-default: 300ms cubic-bezier(0.3, 0, 0, 1) !default;
28
- $beta-motion-transition-slow: 450ms cubic-bezier(0.3, 0, 0, 1) !default;
29
- $beta-opacity-disabled: 40% !default;
30
- $beta-radius-2: 2px !default;
31
- $beta-radius-3: 3px !default;
32
- $beta-radius-4: 4px !default;
33
- $beta-radius-6: 6px !default;
34
- $beta-radius-7: 7px !default;
35
- $beta-radius-8: 8px !default;
36
- $beta-radius-10: 10px !default;
37
- $beta-radius-12: 12px !default;
38
- $beta-radius-14: 14px !default;
39
- $beta-radius-16: 16px !default;
40
- $beta-radius-20: 20px !default;
41
- $beta-radius-32: 32px !default;
42
- $beta-state-error: 0 0 0 1px #e67f2bff !default;
43
- $beta-state-active: 0 0 0 1px #6157eaff !default;
44
- $beta-state-input-default: 0 1px 2px 0 #0000000d, inset 0 0 0 1px #00000026 !default;
45
- $beta-state-input-hovered: 0 2px 6px 0 #0000000d, inset 0 0 0 1px #6157eaff !default;
46
- $beta-state-input-active: 0 2px 6px 0 #0000000d, 0 0 0 3px #6157ea4d, inset 0 0 0 1px #6157eaff !default;
47
- $beta-state-input-error: 0 2px 6px 0 #0000000d, 0 0 0 3px #e67f2b4d, inset 0 0 0 1px #e67f2bff !default;
48
- $beta-typography-heading-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
49
- $beta-typography-heading-size-xlarge: 24px !default;
50
- $beta-typography-heading-size-large: 22px !default;
51
- $beta-typography-heading-size-medium: 18px !default;
52
- $beta-typography-heading-size-small: 17px !default;
53
- $beta-typography-heading-size-xsmall: 16px !default;
54
- $beta-typography-heading-size-2xsmall: 15px !default;
55
- $beta-typography-heading-weight-bold: 700 !default;
56
- $beta-typography-heading-letter-spacing: 0 !default;
57
- $beta-typography-heading-letter-spacing-tight: -0.1px !default;
58
- $beta-typography-heading-letter-spacing-tighter: -0.4px !default;
59
- $beta-typography-heading-line-height-xlarge: 32px !default;
60
- $beta-typography-heading-line-height-large: 28px !default;
61
- $beta-typography-heading-line-height-medium: 24px !default;
62
- $beta-typography-heading-line-height-small: 24px !default;
63
- $beta-typography-heading-line-height-xsmall: 24px !default;
64
- $beta-typography-heading-line-height-2xsmall: 20px !default;
65
- $beta-typography-text-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
66
- $beta-typography-text-size-2xlarge: 17px !default;
67
- $beta-typography-text-size-xlarge: 16px !default;
68
- $beta-typography-text-size-large: 15px !default;
69
- $beta-typography-text-size-medium: 14px !default;
70
- $beta-typography-text-size-small: 13px !default;
71
- $beta-typography-text-size-xsmall: 12px !default;
72
- $beta-typography-text-size-2xsmall: 11px !default;
73
- $beta-typography-text-weight-bold: 700 !default;
74
- $beta-typography-text-weight-regular: 400 !default;
75
- $beta-typography-text-letter-spacing: 0 !default;
76
- $beta-typography-text-letter-spacing-tight: -0.1px !default;
77
- $beta-typography-text-line-height-2xlarge: 24px !default;
78
- $beta-typography-text-line-height-xlarge: 24px !default;
79
- $beta-typography-text-line-height-large: 20px !default;
80
- $beta-typography-text-line-height-medium: 18px !default;
81
- $beta-typography-text-line-height-small: 18px !default;
82
- $beta-typography-text-line-height-xsmall: 16px !default;
83
- $beta-typography-text-line-height-2xsmall: 16px !default;
84
- $beta-typography-display-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
85
- $beta-typography-display-size-large: 36px !default;
86
- $beta-typography-display-size-medium: 30px !default;
87
- $beta-typography-display-weight-bold: 700 !default;
88
- $beta-typography-display-letter-spacing-tighter: -0.4px !default;
89
- $beta-typography-display-line-height-large: 44px !default;
90
- $beta-typography-display-line-height-medium: 36px !default;
91
- $beta-typography-code-font-family: 'ui-monospace', 'Cascadia Code', 'Source Code Pro', 'Menlo', 'Consolas', 'DejaVu Sans Mono', 'monospace' !default;
92
- $beta-typography-code-size-medium: 14px !default;
93
- $beta-typography-code-size-small: 13px !default;
94
- $beta-typography-code-weight-regular: 400 !default;
95
- $beta-typography-code-letter-spacing: 0 !default;
96
- $beta-typography-code-line-height-medium: 18px !default;
97
- $beta-typography-code-line-height-small: 18px !default;
98
- $beta-color-text-action: #6157eaff !default;
99
- $beta-color-text-success: #20ab55ff !default;
100
- $beta-color-text-highlight: #3292e3ff !default;
101
- $beta-color-text-warning: #e67f2bff !default;
102
- $beta-color-text-critical: #e1535dff !default;
103
- $beta-color-text-neutral-heaviest: #000000ff !default;
104
- $beta-color-text-neutral: #000000d9 !default;
105
- $beta-color-text-neutral-light: #00000099 !default;
106
- $beta-color-text-neutral-lighter: #00000066 !default;
107
- $beta-color-text-accent-blue: #6157eaff !default;
108
- $beta-color-text-accent-cobalt: #3292e3ff !default;
109
- $beta-color-text-accent-green: #20ab55ff !default;
110
- $beta-color-text-accent-red: #e1535dff !default;
111
- $beta-color-text-accent-orange: #e67f2bff !default;
112
- $beta-color-text-accent-yellow: #edae0dff !default;
113
- $beta-color-text-accent-teal: #09b2acff !default;
114
- $beta-color-text-accent-navy: #424fabff !default;
115
- $beta-color-text-accent-purple: #8e57e7ff !default;
116
- $beta-color-text-accent-pink: #d64bb5ff !default;
117
- $beta-color-text-absolute-white: #ffffffff !default;
118
- $beta-color-text-absolute-black: #000000ff !default;
119
- $beta-color-icon-action: #6157eaff !default;
120
- $beta-color-icon-success: #20ab55ff !default;
121
- $beta-color-icon-highlight: #3292e3ff !default;
122
- $beta-color-icon-warning: #e67f2bff !default;
123
- $beta-color-icon-critical: #e1535dff !default;
124
- $beta-color-icon-neutral: #00000066 !default;
125
- $beta-color-icon-neutral-heavy: #00000099 !default;
126
- $beta-color-icon-neutral-heavier: #000000d9 !default;
127
- $beta-color-icon-accent-blue: #6157eaff !default;
128
- $beta-color-icon-accent-cobalt: #3292e3ff !default;
129
- $beta-color-icon-accent-green: #20ab55ff !default;
130
- $beta-color-icon-accent-red: #e1535dff !default;
131
- $beta-color-icon-accent-orange: #e67f2bff !default;
132
- $beta-color-icon-accent-yellow: #edae0dff !default;
133
- $beta-color-icon-accent-olive: #a9b110ff !default;
134
- $beta-color-icon-accent-teal: #09b2acff !default;
135
- $beta-color-icon-accent-navy: #424fabff !default;
136
- $beta-color-icon-accent-purple: #8e57e7ff !default;
137
- $beta-color-icon-accent-pink: #d64bb5ff !default;
138
- $beta-color-icon-absolute-white: #ffffffff !default;
139
- $beta-color-icon-absolute-black: #000000ff !default;
140
- $beta-color-fill-neutral-heaviest: #000000d9 !default;
141
- $beta-color-fill-neutral-heavier: #00000066 !default;
142
- $beta-color-fill-neutral-heavy: #00000026 !default;
143
- $beta-color-fill-neutral-light: #0000000d !default;
144
- $beta-color-fill-neutral-lighter: #00000008 !default;
145
- $beta-color-fill-neutral-lightest: #00000003 !default;
146
- $beta-color-fill-neutral-transparent: #00000000 !default;
147
- $beta-color-fill-action: #6157eaff !default;
148
- $beta-color-fill-action-light: #6157ea33 !default;
149
- $beta-color-fill-action-lighter: #6157ea1a !default;
150
- $beta-color-fill-action-transparent: #6157ea00 !default;
151
- $beta-color-fill-success: #20ab55ff !default;
152
- $beta-color-fill-success-light: #20ab5533 !default;
153
- $beta-color-fill-success-lighter: #20ab551a !default;
154
- $beta-color-fill-success-transparent: #20ab5500 !default;
155
- $beta-color-fill-highlight: #3292e3ff !default;
156
- $beta-color-fill-highlight-light: #3292e333 !default;
157
- $beta-color-fill-highlight-lighter: #3292e31a !default;
158
- $beta-color-fill-highlight-transparent: #3292e300 !default;
159
- $beta-color-fill-warning: #e67f2bff !default;
160
- $beta-color-fill-warning-light: #e67f2b33 !default;
161
- $beta-color-fill-warning-lighter: #e67f2b1a !default;
162
- $beta-color-fill-warning-transparent: #e67f2b00 !default;
163
- $beta-color-fill-critical: #e1535dff !default;
164
- $beta-color-fill-critical-light: #e1535d33 !default;
165
- $beta-color-fill-critical-lighter: #e1535d1a !default;
166
- $beta-color-fill-critical-transparent: #e1535d00 !default;
167
- $beta-color-fill-grey: #fbfbfbff !default;
168
- $beta-color-fill-grey-heavy: #f7f7f8ff !default;
169
- $beta-color-fill-grey-heavier: #efeff0ff !default;
170
- $beta-color-fill-accent-blue: #6157ea1a !default;
171
- $beta-color-fill-accent-blue-heavy: #6157ea33 !default;
172
- $beta-color-fill-accent-blue-heavier: #6157eaff !default;
173
- $beta-color-fill-accent-blue-transparent: #6157ea00 !default;
174
- $beta-color-fill-accent-cobalt: #3292e31a !default;
175
- $beta-color-fill-accent-cobalt-heavy: #3292e333 !default;
176
- $beta-color-fill-accent-cobalt-heavier: #3292e3ff !default;
177
- $beta-color-fill-accent-cobalt-transparent: #3292e300 !default;
178
- $beta-color-fill-accent-green: #20ab551a !default;
179
- $beta-color-fill-accent-green-heavy: #20ab5533 !default;
180
- $beta-color-fill-accent-green-heavier: #20ab55ff !default;
181
- $beta-color-fill-accent-green-transparent: #20ab5500 !default;
182
- $beta-color-fill-accent-red: #e1535d1a !default;
183
- $beta-color-fill-accent-red-heavy: #e1535d33 !default;
184
- $beta-color-fill-accent-red-heavier: #e1535dff !default;
185
- $beta-color-fill-accent-red-transparent: #e1535d00 !default;
186
- $beta-color-fill-accent-orange: #e67f2b1a !default;
187
- $beta-color-fill-accent-orange-heavy: #e67f2b33 !default;
188
- $beta-color-fill-accent-orange-heavier: #e67f2bff !default;
189
- $beta-color-fill-accent-orange-transparent: #e67f2b00 !default;
190
- $beta-color-fill-accent-yellow: #edae0d1a !default;
191
- $beta-color-fill-accent-yellow-heavy: #edae0d33 !default;
192
- $beta-color-fill-accent-yellow-heavier: #edae0dff !default;
193
- $beta-color-fill-accent-yellow-transparent: #edae0d00 !default;
194
- $beta-color-fill-accent-olive: #a9b1101a !default;
195
- $beta-color-fill-accent-olive-heavy: #a9b11033 !default;
196
- $beta-color-fill-accent-olive-heavier: #a9b110ff !default;
197
- $beta-color-fill-accent-olive-transparent: #a9b11000 !default;
198
- $beta-color-fill-accent-teal: #09b2ac1a !default;
199
- $beta-color-fill-accent-teal-heavy: #09b2ac33 !default;
200
- $beta-color-fill-accent-teal-heavier: #09b2acff !default;
201
- $beta-color-fill-accent-teal-transparent: #09b2ac00 !default;
202
- $beta-color-fill-accent-navy: #424fab1a !default;
203
- $beta-color-fill-accent-navy-heavy: #424fab33 !default;
204
- $beta-color-fill-accent-navy-heavier: #424fabff !default;
205
- $beta-color-fill-accent-navy-transparent: #424fab00 !default;
206
- $beta-color-fill-accent-purple: #8e57e71a !default;
207
- $beta-color-fill-accent-purple-heavy: #8e57e733 !default;
208
- $beta-color-fill-accent-purple-heavier: #8e57e7ff !default;
209
- $beta-color-fill-accent-purple-transparent: #8e57e700 !default;
210
- $beta-color-fill-accent-pink: #d64bb51a !default;
211
- $beta-color-fill-accent-pink-heavy: #d64bb533 !default;
212
- $beta-color-fill-accent-pink-heavier: #d64bb5ff !default;
213
- $beta-color-fill-accent-pink-transparent: #d64bb500 !default;
214
- $beta-color-fill-absolute-white: #ffffffff !default;
215
- $beta-color-fill-absolute-white-light: #ffffff33 !default;
216
- $beta-color-fill-absolute-white-transparent: #ffffff00 !default;
217
- $beta-color-fill-absolute-black: #000000ff !default;
218
- $beta-color-fill-absolute-black-light: #00000033 !default;
219
- $beta-color-fill-absolute-black-transparent: #00000000 !default;
220
- $beta-color-border-neutral: #00000014 !default;
221
- $beta-color-border-neutral-heavy: #00000026 !default;
222
- $beta-color-border-neutral-heavier: #00000066 !default;
223
- $beta-color-border-detach: #ffffffff !default;
224
- $beta-color-border-detach-highest: #ffffffff !default;
225
- $beta-color-border-detach-higher: #ffffffff !default;
226
- $beta-color-border-detach-high: #ffffffff !default;
227
- $beta-color-border-detach-low: #fbfbfbff !default;
228
- $beta-color-border-absolute-white: #ffffffff !default;
229
- $beta-color-surface: #ffffffff !default;
230
- $beta-color-surface-highest: #ffffffff !default;
231
- $beta-color-surface-higher: #ffffffff !default;
232
- $beta-color-surface-high: #ffffffff !default;
233
- $beta-color-surface-low: #fbfbfbff !default;
234
- $beta-color-surface-glass: #ffffffe6 !default;
235
- $beta-color-surface-glass-highest: #efeff0e6 !default;
236
- $beta-color-surface-glass-higher: #f7f7f8e6 !default;
237
- $beta-color-surface-glass-high: #ffffffe6 !default;
238
- $beta-color-surface-accent-blue: #6157eaff !default;
239
- $beta-color-surface-accent-cobalt: #3292e3ff !default;
240
- $beta-color-surface-accent-green: #20ab55ff !default;
241
- $beta-color-surface-accent-red: #e1535dff !default;
242
- $beta-color-surface-accent-orange: #e67f2bff !default;
243
- $beta-color-surface-accent-yellow: #edae0dff !default;
244
- $beta-color-surface-accent-olive: #a9b110ff !default;
245
- $beta-color-surface-accent-teal: #09b2acff !default;
246
- $beta-color-surface-accent-navy: #424fabff !default;
247
- $beta-color-surface-accent-purple: #8e57e7ff !default;
248
- $beta-color-surface-accent-pink: #d64bb5ff !default;
249
- $beta-color-dim-absolute-black: #00000066 !default;
250
- $beta-color-dim-absolute-black-heavy: #00000099 !default;
251
- $beta-color-dim-absolute-white: #ffffff66 !default;
252
- $beta-color-dim-absolute-white-heavy: #ffffff99 !default;
253
- $beta-color-gradient-green: #20ab55ff !default;
254
- $beta-color-gradient-green-heavy: #4bc16cff !default;
255
- $beta-color-state-default: #00000026 !default;
256
- $beta-color-state-action: #6157eaff !default;
257
- $beta-color-state-action-light: #6157ea4d !default;
258
- $beta-color-state-warning: #e67f2bff !default;
259
- $beta-color-state-warning-light: #e67f2b4d !default;
260
- $beta-color-elevation-xlarge: #0000004d !default;
261
- $beta-color-elevation-large: #00000038 !default;
262
- $beta-color-elevation-medium: #00000026 !default;
263
- $beta-color-elevation-small: #00000014 !default;
264
- $beta-color-elevation-base: #0000000d !default;
265
- $beta-color-elevation-base-inner: #ffffff1f !default;
2
+ $backdrop-large: 60px !default;
3
+ $backdrop-small: 6px !default;
4
+ $border-default: 0 0 0 1px #00000014 !default;
5
+ $border-bottom: 0 -1px 0 0 #00000014 !default;
6
+ $border-right: -1px 0 0 0 #00000014 !default;
7
+ $border-left: 1px 0 0 0 #00000014 !default;
8
+ $border-top: 0 1px 0 0 #00000014 !default;
9
+ $border-white-high: 0 0 0 1px #ffff !default;
10
+ $border-white-higher: 0 0 0 1px #ffff !default;
11
+ $border-white-highest: 0 0 0 1px #ffff !default;
12
+ $elevation-1: 0 1px 2px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
13
+ $elevation-2: 0 2px 6px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
14
+ $elevation-3: 0 4px 12px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
15
+ $elevation-4: 0 4px 24px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
16
+ $elevation-5: 0 6px 40px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
17
+ $elevation-6: 0 12px 60px 0 #00000014, 0 0 2px 1px #0000000d, inset 0 0 2px 0 #ffffff1f !default;
18
+ $layer-z-index-base: 0 !default;
19
+ $layer-z-index-floating: 1 !default;
20
+ $layer-z-index-overlay: 1000 !default;
21
+ $layer-z-index-modal: 1100 !default;
22
+ $layer-z-index-toast: 1200 !default;
23
+ $layer-z-index-tooltip: 1300 !default;
24
+ $layer-z-index-hidden: -1 !default;
25
+ $layer-z-index-important: 2000 !default;
26
+ $motion-transition-fast: 150ms cubic-bezier(0.3, 0, 0, 1) !default;
27
+ $motion-transition-default: 300ms cubic-bezier(0.3, 0, 0, 1) !default;
28
+ $motion-transition-slow: 450ms cubic-bezier(0.3, 0, 0, 1) !default;
29
+ $opacity-disabled: 40% !default;
30
+ $radius-2: 2px !default;
31
+ $radius-3: 3px !default;
32
+ $radius-4: 4px !default;
33
+ $radius-6: 6px !default;
34
+ $radius-7: 7px !default;
35
+ $radius-8: 8px !default;
36
+ $radius-10: 10px !default;
37
+ $radius-12: 12px !default;
38
+ $radius-14: 14px !default;
39
+ $radius-16: 16px !default;
40
+ $radius-20: 20px !default;
41
+ $radius-32: 32px !default;
42
+ $state-error: 0 0 0 1px #e67f2bff !default;
43
+ $state-active: 0 0 0 1px #6157eaff !default;
44
+ $state-input-default: 0 1px 2px 0 #0000000d, inset 0 0 0 1px #00000026 !default;
45
+ $state-input-hovered: 0 2px 6px 0 #0000000d, inset 0 0 0 1px #6157eaff !default;
46
+ $state-input-active: 0 2px 6px 0 #0000000d, 0 0 0 3px #6157ea4d, inset 0 0 0 1px #6157eaff !default;
47
+ $state-input-error: 0 2px 6px 0 #0000000d, 0 0 0 3px #e67f2b4d, inset 0 0 0 1px #e67f2bff !default;
48
+ $typography-heading-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
49
+ $typography-heading-size-xlarge: 24px !default;
50
+ $typography-heading-size-large: 22px !default;
51
+ $typography-heading-size-medium: 18px !default;
52
+ $typography-heading-size-small: 17px !default;
53
+ $typography-heading-size-xsmall: 16px !default;
54
+ $typography-heading-size-2xsmall: 15px !default;
55
+ $typography-heading-weight-bold: 700 !default;
56
+ $typography-heading-letter-spacing: 0 !default;
57
+ $typography-heading-letter-spacing-tight: -0.1px !default;
58
+ $typography-heading-letter-spacing-tighter: -0.4px !default;
59
+ $typography-heading-line-height-xlarge: 32px !default;
60
+ $typography-heading-line-height-large: 28px !default;
61
+ $typography-heading-line-height-medium: 24px !default;
62
+ $typography-heading-line-height-small: 24px !default;
63
+ $typography-heading-line-height-xsmall: 24px !default;
64
+ $typography-heading-line-height-2xsmall: 20px !default;
65
+ $typography-text-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
66
+ $typography-text-size-2xlarge: 17px !default;
67
+ $typography-text-size-xlarge: 16px !default;
68
+ $typography-text-size-large: 15px !default;
69
+ $typography-text-size-medium: 14px !default;
70
+ $typography-text-size-small: 13px !default;
71
+ $typography-text-size-xsmall: 12px !default;
72
+ $typography-text-size-2xsmall: 11px !default;
73
+ $typography-text-weight-bold: 700 !default;
74
+ $typography-text-weight-regular: 400 !default;
75
+ $typography-text-letter-spacing: 0 !default;
76
+ $typography-text-letter-spacing-tight: -0.1px !default;
77
+ $typography-text-line-height-2xlarge: 24px !default;
78
+ $typography-text-line-height-xlarge: 24px !default;
79
+ $typography-text-line-height-large: 20px !default;
80
+ $typography-text-line-height-medium: 18px !default;
81
+ $typography-text-line-height-small: 18px !default;
82
+ $typography-text-line-height-xsmall: 16px !default;
83
+ $typography-text-line-height-2xsmall: 16px !default;
84
+ $typography-display-font-family: 'Inter', 'NotoSansKR', 'Noto Sans KR', 'NotoSansJP', 'Noto Sans JP', '-apple-system', 'BlinkMacSystemFont', 'Helvetica Neue', 'Segoe UI', 'Roboto', 'system-ui', 'sans-serif' !default;
85
+ $typography-display-size-large: 36px !default;
86
+ $typography-display-size-medium: 30px !default;
87
+ $typography-display-weight-bold: 700 !default;
88
+ $typography-display-letter-spacing-tighter: -0.4px !default;
89
+ $typography-display-line-height-large: 44px !default;
90
+ $typography-display-line-height-medium: 36px !default;
91
+ $typography-code-font-family: 'ui-monospace', 'Cascadia Code', 'Source Code Pro', 'Menlo', 'Consolas', 'DejaVu Sans Mono', 'monospace' !default;
92
+ $typography-code-size-medium: 14px !default;
93
+ $typography-code-size-small: 13px !default;
94
+ $typography-code-weight-regular: 400 !default;
95
+ $typography-code-letter-spacing: 0 !default;
96
+ $typography-code-line-height-medium: 18px !default;
97
+ $typography-code-line-height-small: 18px !default;
98
+ $color-text-action: #6157eaff !default;
99
+ $color-text-success: #20ab55ff !default;
100
+ $color-text-highlight: #3292e3ff !default;
101
+ $color-text-warning: #e67f2bff !default;
102
+ $color-text-critical: #e1535dff !default;
103
+ $color-text-neutral-heaviest: #000f !default;
104
+ $color-text-neutral: #000000d9 !default;
105
+ $color-text-neutral-light: #0009 !default;
106
+ $color-text-neutral-lighter: #0006 !default;
107
+ $color-text-accent-blue: #6157eaff !default;
108
+ $color-text-accent-cobalt: #3292e3ff !default;
109
+ $color-text-accent-green: #20ab55ff !default;
110
+ $color-text-accent-red: #e1535dff !default;
111
+ $color-text-accent-orange: #e67f2bff !default;
112
+ $color-text-accent-yellow: #edae0dff !default;
113
+ $color-text-accent-teal: #09b2acff !default;
114
+ $color-text-accent-navy: #424fabff !default;
115
+ $color-text-accent-purple: #8e57e7ff !default;
116
+ $color-text-accent-pink: #d64bb5ff !default;
117
+ $color-text-absolute-white: #ffff !default;
118
+ $color-text-absolute-black: #000f !default;
119
+ $color-icon-action: #6157eaff !default;
120
+ $color-icon-success: #20ab55ff !default;
121
+ $color-icon-highlight: #3292e3ff !default;
122
+ $color-icon-warning: #e67f2bff !default;
123
+ $color-icon-critical: #e1535dff !default;
124
+ $color-icon-neutral: #0006 !default;
125
+ $color-icon-neutral-heavy: #0009 !default;
126
+ $color-icon-neutral-heavier: #000000d9 !default;
127
+ $color-icon-accent-blue: #6157eaff !default;
128
+ $color-icon-accent-cobalt: #3292e3ff !default;
129
+ $color-icon-accent-green: #20ab55ff !default;
130
+ $color-icon-accent-red: #e1535dff !default;
131
+ $color-icon-accent-orange: #e67f2bff !default;
132
+ $color-icon-accent-yellow: #edae0dff !default;
133
+ $color-icon-accent-olive: #a9b110ff !default;
134
+ $color-icon-accent-teal: #09b2acff !default;
135
+ $color-icon-accent-navy: #424fabff !default;
136
+ $color-icon-accent-purple: #8e57e7ff !default;
137
+ $color-icon-accent-pink: #d64bb5ff !default;
138
+ $color-icon-absolute-white: #ffff !default;
139
+ $color-icon-absolute-black: #000f !default;
140
+ $color-fill-neutral-heaviest: #000000d9 !default;
141
+ $color-fill-neutral-heavier: #0006 !default;
142
+ $color-fill-neutral-heavy: #00000026 !default;
143
+ $color-fill-neutral-light: #0000000d !default;
144
+ $color-fill-neutral-lighter: #00000008 !default;
145
+ $color-fill-neutral-lightest: #00000003 !default;
146
+ $color-fill-neutral-transparent: #0000 !default;
147
+ $color-fill-action: #6157eaff !default;
148
+ $color-fill-action-light: #6157ea33 !default;
149
+ $color-fill-action-lighter: #6157ea1a !default;
150
+ $color-fill-action-transparent: #6157ea00 !default;
151
+ $color-fill-success: #20ab55ff !default;
152
+ $color-fill-success-light: #20ab5533 !default;
153
+ $color-fill-success-lighter: #20ab551a !default;
154
+ $color-fill-success-transparent: #20ab5500 !default;
155
+ $color-fill-highlight: #3292e3ff !default;
156
+ $color-fill-highlight-light: #3292e333 !default;
157
+ $color-fill-highlight-lighter: #3292e31a !default;
158
+ $color-fill-highlight-transparent: #3292e300 !default;
159
+ $color-fill-warning: #e67f2bff !default;
160
+ $color-fill-warning-light: #e67f2b33 !default;
161
+ $color-fill-warning-lighter: #e67f2b1a !default;
162
+ $color-fill-warning-transparent: #e67f2b00 !default;
163
+ $color-fill-critical: #e1535dff !default;
164
+ $color-fill-critical-light: #e1535d33 !default;
165
+ $color-fill-critical-lighter: #e1535d1a !default;
166
+ $color-fill-critical-transparent: #e1535d00 !default;
167
+ $color-fill-grey: #fbfbfbff !default;
168
+ $color-fill-grey-heavy: #f7f7f8ff !default;
169
+ $color-fill-grey-heavier: #efeff0ff !default;
170
+ $color-fill-accent-blue: #6157ea1a !default;
171
+ $color-fill-accent-blue-heavy: #6157ea33 !default;
172
+ $color-fill-accent-blue-heavier: #6157eaff !default;
173
+ $color-fill-accent-blue-transparent: #6157ea00 !default;
174
+ $color-fill-accent-cobalt: #3292e31a !default;
175
+ $color-fill-accent-cobalt-heavy: #3292e333 !default;
176
+ $color-fill-accent-cobalt-heavier: #3292e3ff !default;
177
+ $color-fill-accent-cobalt-transparent: #3292e300 !default;
178
+ $color-fill-accent-green: #20ab551a !default;
179
+ $color-fill-accent-green-heavy: #20ab5533 !default;
180
+ $color-fill-accent-green-heavier: #20ab55ff !default;
181
+ $color-fill-accent-green-transparent: #20ab5500 !default;
182
+ $color-fill-accent-red: #e1535d1a !default;
183
+ $color-fill-accent-red-heavy: #e1535d33 !default;
184
+ $color-fill-accent-red-heavier: #e1535dff !default;
185
+ $color-fill-accent-red-transparent: #e1535d00 !default;
186
+ $color-fill-accent-orange: #e67f2b1a !default;
187
+ $color-fill-accent-orange-heavy: #e67f2b33 !default;
188
+ $color-fill-accent-orange-heavier: #e67f2bff !default;
189
+ $color-fill-accent-orange-transparent: #e67f2b00 !default;
190
+ $color-fill-accent-yellow: #edae0d1a !default;
191
+ $color-fill-accent-yellow-heavy: #edae0d33 !default;
192
+ $color-fill-accent-yellow-heavier: #edae0dff !default;
193
+ $color-fill-accent-yellow-transparent: #edae0d00 !default;
194
+ $color-fill-accent-olive: #a9b1101a !default;
195
+ $color-fill-accent-olive-heavy: #a9b11033 !default;
196
+ $color-fill-accent-olive-heavier: #a9b110ff !default;
197
+ $color-fill-accent-olive-transparent: #a9b11000 !default;
198
+ $color-fill-accent-teal: #09b2ac1a !default;
199
+ $color-fill-accent-teal-heavy: #09b2ac33 !default;
200
+ $color-fill-accent-teal-heavier: #09b2acff !default;
201
+ $color-fill-accent-teal-transparent: #09b2ac00 !default;
202
+ $color-fill-accent-navy: #424fab1a !default;
203
+ $color-fill-accent-navy-heavy: #424fab33 !default;
204
+ $color-fill-accent-navy-heavier: #424fabff !default;
205
+ $color-fill-accent-navy-transparent: #424fab00 !default;
206
+ $color-fill-accent-purple: #8e57e71a !default;
207
+ $color-fill-accent-purple-heavy: #8e57e733 !default;
208
+ $color-fill-accent-purple-heavier: #8e57e7ff !default;
209
+ $color-fill-accent-purple-transparent: #8e57e700 !default;
210
+ $color-fill-accent-pink: #d64bb51a !default;
211
+ $color-fill-accent-pink-heavy: #d64bb533 !default;
212
+ $color-fill-accent-pink-heavier: #d64bb5ff !default;
213
+ $color-fill-accent-pink-transparent: #d64bb500 !default;
214
+ $color-fill-absolute-white: #ffff !default;
215
+ $color-fill-absolute-white-light: #fff3 !default;
216
+ $color-fill-absolute-white-transparent: #fff0 !default;
217
+ $color-fill-absolute-black: #000f !default;
218
+ $color-fill-absolute-black-light: #0003 !default;
219
+ $color-fill-absolute-black-transparent: #0000 !default;
220
+ $color-border-neutral: #00000014 !default;
221
+ $color-border-neutral-heavy: #00000026 !default;
222
+ $color-border-neutral-heavier: #0006 !default;
223
+ $color-border-detach: #ffff !default;
224
+ $color-border-detach-highest: #ffff !default;
225
+ $color-border-detach-higher: #ffff !default;
226
+ $color-border-detach-high: #ffff !default;
227
+ $color-border-detach-low: #fbfbfbff !default;
228
+ $color-border-absolute-white: #ffff !default;
229
+ $color-surface: #ffff !default;
230
+ $color-surface-highest: #ffff !default;
231
+ $color-surface-higher: #ffff !default;
232
+ $color-surface-high: #ffff !default;
233
+ $color-surface-low: #fbfbfbff !default;
234
+ $color-surface-glass: #ffffffe6 !default;
235
+ $color-surface-glass-highest: #efeff0e6 !default;
236
+ $color-surface-glass-higher: #f7f7f8e6 !default;
237
+ $color-surface-glass-high: #ffffffe6 !default;
238
+ $color-surface-accent-blue: #6157eaff !default;
239
+ $color-surface-accent-cobalt: #3292e3ff !default;
240
+ $color-surface-accent-green: #20ab55ff !default;
241
+ $color-surface-accent-red: #e1535dff !default;
242
+ $color-surface-accent-orange: #e67f2bff !default;
243
+ $color-surface-accent-yellow: #edae0dff !default;
244
+ $color-surface-accent-olive: #a9b110ff !default;
245
+ $color-surface-accent-teal: #09b2acff !default;
246
+ $color-surface-accent-navy: #424fabff !default;
247
+ $color-surface-accent-purple: #8e57e7ff !default;
248
+ $color-surface-accent-pink: #d64bb5ff !default;
249
+ $color-dim-absolute-black: #0006 !default;
250
+ $color-dim-absolute-black-heavy: #0009 !default;
251
+ $color-dim-absolute-white: #fff6 !default;
252
+ $color-dim-absolute-white-heavy: #fff9 !default;
253
+ $color-gradient-green: #20ab55ff !default;
254
+ $color-gradient-green-heavy: #4bc16cff !default;
255
+ $color-state-default: #00000026 !default;
256
+ $color-state-action: #6157eaff !default;
257
+ $color-state-action-light: #6157ea4d !default;
258
+ $color-state-warning: #e67f2bff !default;
259
+ $color-state-warning-light: #e67f2b4d !default;
260
+ $color-elevation-xlarge: #0000004d !default;
261
+ $color-elevation-large: #00000038 !default;
262
+ $color-elevation-medium: #00000026 !default;
263
+ $color-elevation-small: #00000014 !default;
264
+ $color-elevation-base: #0000000d !default;
265
+ $color-elevation-base-inner: #ffffff1f !default;
266
266
 
267
267
  $tokens: (
268
268
  'backdrop': (
269
- 'large': $beta-backdrop-large,
270
- 'small': $beta-backdrop-small
269
+ 'large': $backdrop-large,
270
+ 'small': $backdrop-small
271
271
  ),
272
272
  'border': (
273
- 'default': $beta-border-default,
274
- 'bottom': $beta-border-bottom,
275
- 'right': $beta-border-right,
276
- 'left': $beta-border-left,
277
- 'top': $beta-border-top,
278
- 'white-high': $beta-border-white-high,
279
- 'white-higher': $beta-border-white-higher,
280
- 'white-highest': $beta-border-white-highest
273
+ 'default': $border-default,
274
+ 'bottom': $border-bottom,
275
+ 'right': $border-right,
276
+ 'left': $border-left,
277
+ 'top': $border-top,
278
+ 'white-high': $border-white-high,
279
+ 'white-higher': $border-white-higher,
280
+ 'white-highest': $border-white-highest
281
281
  ),
282
282
  'elevation': (
283
- '1': $beta-elevation-1,
284
- '2': $beta-elevation-2,
285
- '3': $beta-elevation-3,
286
- '4': $beta-elevation-4,
287
- '5': $beta-elevation-5,
288
- '6': $beta-elevation-6
283
+ '1': $elevation-1,
284
+ '2': $elevation-2,
285
+ '3': $elevation-3,
286
+ '4': $elevation-4,
287
+ '5': $elevation-5,
288
+ '6': $elevation-6
289
289
  ),
290
290
  'layer': (
291
291
  'z-index': (
292
- 'base': $beta-layer-z-index-base,
293
- 'floating': $beta-layer-z-index-floating,
294
- 'overlay': $beta-layer-z-index-overlay,
295
- 'modal': $beta-layer-z-index-modal,
296
- 'toast': $beta-layer-z-index-toast,
297
- 'tooltip': $beta-layer-z-index-tooltip,
298
- 'hidden': $beta-layer-z-index-hidden,
299
- 'important': $beta-layer-z-index-important
292
+ 'base': $layer-z-index-base,
293
+ 'floating': $layer-z-index-floating,
294
+ 'overlay': $layer-z-index-overlay,
295
+ 'modal': $layer-z-index-modal,
296
+ 'toast': $layer-z-index-toast,
297
+ 'tooltip': $layer-z-index-tooltip,
298
+ 'hidden': $layer-z-index-hidden,
299
+ 'important': $layer-z-index-important
300
300
  )
301
301
  ),
302
302
  'motion': (
303
303
  'transition': (
304
- 'fast': $beta-motion-transition-fast,
305
- 'default': $beta-motion-transition-default,
306
- 'slow': $beta-motion-transition-slow
304
+ 'fast': $motion-transition-fast,
305
+ 'default': $motion-transition-default,
306
+ 'slow': $motion-transition-slow
307
307
  )
308
308
  ),
309
309
  'opacity': (
310
- 'disabled': $beta-opacity-disabled
310
+ 'disabled': $opacity-disabled
311
311
  ),
312
312
  'radius': (
313
- '2': $beta-radius-2,
314
- '3': $beta-radius-3,
315
- '4': $beta-radius-4,
316
- '6': $beta-radius-6,
317
- '7': $beta-radius-7,
318
- '8': $beta-radius-8,
319
- '10': $beta-radius-10,
320
- '12': $beta-radius-12,
321
- '14': $beta-radius-14,
322
- '16': $beta-radius-16,
323
- '20': $beta-radius-20,
324
- '32': $beta-radius-32
313
+ '2': $radius-2,
314
+ '3': $radius-3,
315
+ '4': $radius-4,
316
+ '6': $radius-6,
317
+ '7': $radius-7,
318
+ '8': $radius-8,
319
+ '10': $radius-10,
320
+ '12': $radius-12,
321
+ '14': $radius-14,
322
+ '16': $radius-16,
323
+ '20': $radius-20,
324
+ '32': $radius-32
325
325
  ),
326
326
  'state': (
327
- 'error': $beta-state-error,
328
- 'active': $beta-state-active,
327
+ 'error': $state-error,
328
+ 'active': $state-active,
329
329
  'input': (
330
- 'default': $beta-state-input-default,
331
- 'hovered': $beta-state-input-hovered,
332
- 'active': $beta-state-input-active,
333
- 'error': $beta-state-input-error
330
+ 'default': $state-input-default,
331
+ 'hovered': $state-input-hovered,
332
+ 'active': $state-input-active,
333
+ 'error': $state-input-error
334
334
  )
335
335
  ),
336
336
  'typography': (
337
337
  'heading': (
338
- 'font-family': $beta-typography-heading-font-family,
338
+ 'font-family': $typography-heading-font-family,
339
339
  'size': (
340
- 'xlarge': $beta-typography-heading-size-xlarge,
341
- 'large': $beta-typography-heading-size-large,
342
- 'medium': $beta-typography-heading-size-medium,
343
- 'small': $beta-typography-heading-size-small,
344
- 'xsmall': $beta-typography-heading-size-xsmall,
345
- '2xsmall': $beta-typography-heading-size-2xsmall
340
+ 'xlarge': $typography-heading-size-xlarge,
341
+ 'large': $typography-heading-size-large,
342
+ 'medium': $typography-heading-size-medium,
343
+ 'small': $typography-heading-size-small,
344
+ 'xsmall': $typography-heading-size-xsmall,
345
+ '2xsmall': $typography-heading-size-2xsmall
346
346
  ),
347
347
  'weight': (
348
- 'bold': $beta-typography-heading-weight-bold
348
+ 'bold': $typography-heading-weight-bold
349
349
  ),
350
350
  'letter-spacing': (
351
- 'normal': $beta-typography-heading-letter-spacing,
352
- 'tight': $beta-typography-heading-letter-spacing-tight,
353
- 'tighter': $beta-typography-heading-letter-spacing-tighter
351
+ 'normal': $typography-heading-letter-spacing,
352
+ 'tight': $typography-heading-letter-spacing-tight,
353
+ 'tighter': $typography-heading-letter-spacing-tighter
354
354
  ),
355
355
  'line-height': (
356
- 'xlarge': $beta-typography-heading-line-height-xlarge,
357
- 'large': $beta-typography-heading-line-height-large,
358
- 'medium': $beta-typography-heading-line-height-medium,
359
- 'small': $beta-typography-heading-line-height-small,
360
- 'xsmall': $beta-typography-heading-line-height-xsmall,
361
- '2xsmall': $beta-typography-heading-line-height-2xsmall
356
+ 'xlarge': $typography-heading-line-height-xlarge,
357
+ 'large': $typography-heading-line-height-large,
358
+ 'medium': $typography-heading-line-height-medium,
359
+ 'small': $typography-heading-line-height-small,
360
+ 'xsmall': $typography-heading-line-height-xsmall,
361
+ '2xsmall': $typography-heading-line-height-2xsmall
362
362
  )
363
363
  ),
364
364
  'text': (
365
- 'font-family': $beta-typography-text-font-family,
365
+ 'font-family': $typography-text-font-family,
366
366
  'size': (
367
- '2xlarge': $beta-typography-text-size-2xlarge,
368
- 'xlarge': $beta-typography-text-size-xlarge,
369
- 'large': $beta-typography-text-size-large,
370
- 'medium': $beta-typography-text-size-medium,
371
- 'small': $beta-typography-text-size-small,
372
- 'xsmall': $beta-typography-text-size-xsmall,
373
- '2xsmall': $beta-typography-text-size-2xsmall
367
+ '2xlarge': $typography-text-size-2xlarge,
368
+ 'xlarge': $typography-text-size-xlarge,
369
+ 'large': $typography-text-size-large,
370
+ 'medium': $typography-text-size-medium,
371
+ 'small': $typography-text-size-small,
372
+ 'xsmall': $typography-text-size-xsmall,
373
+ '2xsmall': $typography-text-size-2xsmall
374
374
  ),
375
375
  'weight': (
376
- 'bold': $beta-typography-text-weight-bold,
377
- 'regular': $beta-typography-text-weight-regular
376
+ 'bold': $typography-text-weight-bold,
377
+ 'regular': $typography-text-weight-regular
378
378
  ),
379
379
  'letter-spacing': (
380
- 'normal': $beta-typography-text-letter-spacing,
381
- 'tight': $beta-typography-text-letter-spacing-tight
380
+ 'normal': $typography-text-letter-spacing,
381
+ 'tight': $typography-text-letter-spacing-tight
382
382
  ),
383
383
  'line-height': (
384
- '2xlarge': $beta-typography-text-line-height-2xlarge,
385
- 'xlarge': $beta-typography-text-line-height-xlarge,
386
- 'large': $beta-typography-text-line-height-large,
387
- 'medium': $beta-typography-text-line-height-medium,
388
- 'small': $beta-typography-text-line-height-small,
389
- 'xsmall': $beta-typography-text-line-height-xsmall,
390
- '2xsmall': $beta-typography-text-line-height-2xsmall
384
+ '2xlarge': $typography-text-line-height-2xlarge,
385
+ 'xlarge': $typography-text-line-height-xlarge,
386
+ 'large': $typography-text-line-height-large,
387
+ 'medium': $typography-text-line-height-medium,
388
+ 'small': $typography-text-line-height-small,
389
+ 'xsmall': $typography-text-line-height-xsmall,
390
+ '2xsmall': $typography-text-line-height-2xsmall
391
391
  )
392
392
  ),
393
393
  'display': (
394
- 'font-family': $beta-typography-display-font-family,
394
+ 'font-family': $typography-display-font-family,
395
395
  'size': (
396
- 'large': $beta-typography-display-size-large,
397
- 'medium': $beta-typography-display-size-medium
396
+ 'large': $typography-display-size-large,
397
+ 'medium': $typography-display-size-medium
398
398
  ),
399
399
  'weight': (
400
- 'bold': $beta-typography-display-weight-bold
400
+ 'bold': $typography-display-weight-bold
401
401
  ),
402
402
  'letter-spacing': (
403
- 'tighter': $beta-typography-display-letter-spacing-tighter
403
+ 'tighter': $typography-display-letter-spacing-tighter
404
404
  ),
405
405
  'line-height': (
406
- 'large': $beta-typography-display-line-height-large,
407
- 'medium': $beta-typography-display-line-height-medium
406
+ 'large': $typography-display-line-height-large,
407
+ 'medium': $typography-display-line-height-medium
408
408
  )
409
409
  ),
410
410
  'code': (
411
- 'font-family': $beta-typography-code-font-family,
411
+ 'font-family': $typography-code-font-family,
412
412
  'size': (
413
- 'medium': $beta-typography-code-size-medium,
414
- 'small': $beta-typography-code-size-small
413
+ 'medium': $typography-code-size-medium,
414
+ 'small': $typography-code-size-small
415
415
  ),
416
416
  'weight': (
417
- 'regular': $beta-typography-code-weight-regular
417
+ 'regular': $typography-code-weight-regular
418
418
  ),
419
419
  'letter-spacing': (
420
- 'normal': $beta-typography-code-letter-spacing
420
+ 'normal': $typography-code-letter-spacing
421
421
  ),
422
422
  'line-height': (
423
- 'medium': $beta-typography-code-line-height-medium,
424
- 'small': $beta-typography-code-line-height-small
423
+ 'medium': $typography-code-line-height-medium,
424
+ 'small': $typography-code-line-height-small
425
425
  )
426
426
  )
427
427
  ),
428
428
  'color': (
429
429
  'text': (
430
- 'action': $beta-color-text-action,
431
- 'success': $beta-color-text-success,
432
- 'highlight': $beta-color-text-highlight,
433
- 'warning': $beta-color-text-warning,
434
- 'critical': $beta-color-text-critical,
430
+ 'action': $color-text-action,
431
+ 'success': $color-text-success,
432
+ 'highlight': $color-text-highlight,
433
+ 'warning': $color-text-warning,
434
+ 'critical': $color-text-critical,
435
435
  'neutral': (
436
- 'heaviest': $beta-color-text-neutral-heaviest,
437
- 'normal': $beta-color-text-neutral,
438
- 'light': $beta-color-text-neutral-light,
439
- 'lighter': $beta-color-text-neutral-lighter
436
+ 'heaviest': $color-text-neutral-heaviest,
437
+ 'normal': $color-text-neutral,
438
+ 'light': $color-text-neutral-light,
439
+ 'lighter': $color-text-neutral-lighter
440
440
  ),
441
441
  'accent': (
442
- 'blue': $beta-color-text-accent-blue,
443
- 'cobalt': $beta-color-text-accent-cobalt,
444
- 'green': $beta-color-text-accent-green,
445
- 'red': $beta-color-text-accent-red,
446
- 'orange': $beta-color-text-accent-orange,
447
- 'yellow': $beta-color-text-accent-yellow,
448
- 'teal': $beta-color-text-accent-teal,
449
- 'navy': $beta-color-text-accent-navy,
450
- 'purple': $beta-color-text-accent-purple,
451
- 'pink': $beta-color-text-accent-pink
442
+ 'blue': $color-text-accent-blue,
443
+ 'cobalt': $color-text-accent-cobalt,
444
+ 'green': $color-text-accent-green,
445
+ 'red': $color-text-accent-red,
446
+ 'orange': $color-text-accent-orange,
447
+ 'yellow': $color-text-accent-yellow,
448
+ 'teal': $color-text-accent-teal,
449
+ 'navy': $color-text-accent-navy,
450
+ 'purple': $color-text-accent-purple,
451
+ 'pink': $color-text-accent-pink
452
452
  ),
453
453
  'absolute': (
454
- 'white': $beta-color-text-absolute-white,
455
- 'black': $beta-color-text-absolute-black
454
+ 'white': $color-text-absolute-white,
455
+ 'black': $color-text-absolute-black
456
456
  )
457
457
  ),
458
458
  'icon': (
459
- 'action': $beta-color-icon-action,
460
- 'success': $beta-color-icon-success,
461
- 'highlight': $beta-color-icon-highlight,
462
- 'warning': $beta-color-icon-warning,
463
- 'critical': $beta-color-icon-critical,
459
+ 'action': $color-icon-action,
460
+ 'success': $color-icon-success,
461
+ 'highlight': $color-icon-highlight,
462
+ 'warning': $color-icon-warning,
463
+ 'critical': $color-icon-critical,
464
464
  'neutral': (
465
- 'normal': $beta-color-icon-neutral,
466
- 'heavy': $beta-color-icon-neutral-heavy,
467
- 'heavier': $beta-color-icon-neutral-heavier
465
+ 'normal': $color-icon-neutral,
466
+ 'heavy': $color-icon-neutral-heavy,
467
+ 'heavier': $color-icon-neutral-heavier
468
468
  ),
469
469
  'accent': (
470
- 'blue': $beta-color-icon-accent-blue,
471
- 'cobalt': $beta-color-icon-accent-cobalt,
472
- 'green': $beta-color-icon-accent-green,
473
- 'red': $beta-color-icon-accent-red,
474
- 'orange': $beta-color-icon-accent-orange,
475
- 'yellow': $beta-color-icon-accent-yellow,
476
- 'olive': $beta-color-icon-accent-olive,
477
- 'teal': $beta-color-icon-accent-teal,
478
- 'navy': $beta-color-icon-accent-navy,
479
- 'purple': $beta-color-icon-accent-purple,
480
- 'pink': $beta-color-icon-accent-pink
470
+ 'blue': $color-icon-accent-blue,
471
+ 'cobalt': $color-icon-accent-cobalt,
472
+ 'green': $color-icon-accent-green,
473
+ 'red': $color-icon-accent-red,
474
+ 'orange': $color-icon-accent-orange,
475
+ 'yellow': $color-icon-accent-yellow,
476
+ 'olive': $color-icon-accent-olive,
477
+ 'teal': $color-icon-accent-teal,
478
+ 'navy': $color-icon-accent-navy,
479
+ 'purple': $color-icon-accent-purple,
480
+ 'pink': $color-icon-accent-pink
481
481
  ),
482
482
  'absolute': (
483
- 'white': $beta-color-icon-absolute-white,
484
- 'black': $beta-color-icon-absolute-black
483
+ 'white': $color-icon-absolute-white,
484
+ 'black': $color-icon-absolute-black
485
485
  )
486
486
  ),
487
487
  'fill': (
488
488
  'neutral': (
489
- 'heaviest': $beta-color-fill-neutral-heaviest,
490
- 'heavier': $beta-color-fill-neutral-heavier,
491
- 'heavy': $beta-color-fill-neutral-heavy,
492
- 'light': $beta-color-fill-neutral-light,
493
- 'lighter': $beta-color-fill-neutral-lighter,
494
- 'lightest': $beta-color-fill-neutral-lightest,
495
- 'transparent': $beta-color-fill-neutral-transparent
489
+ 'heaviest': $color-fill-neutral-heaviest,
490
+ 'heavier': $color-fill-neutral-heavier,
491
+ 'heavy': $color-fill-neutral-heavy,
492
+ 'light': $color-fill-neutral-light,
493
+ 'lighter': $color-fill-neutral-lighter,
494
+ 'lightest': $color-fill-neutral-lightest,
495
+ 'transparent': $color-fill-neutral-transparent
496
496
  ),
497
497
  'action': (
498
- 'normal': $beta-color-fill-action,
499
- 'light': $beta-color-fill-action-light,
500
- 'lighter': $beta-color-fill-action-lighter,
501
- 'transparent': $beta-color-fill-action-transparent
498
+ 'normal': $color-fill-action,
499
+ 'light': $color-fill-action-light,
500
+ 'lighter': $color-fill-action-lighter,
501
+ 'transparent': $color-fill-action-transparent
502
502
  ),
503
503
  'success': (
504
- 'normal': $beta-color-fill-success,
505
- 'light': $beta-color-fill-success-light,
506
- 'lighter': $beta-color-fill-success-lighter,
507
- 'transparent': $beta-color-fill-success-transparent
504
+ 'normal': $color-fill-success,
505
+ 'light': $color-fill-success-light,
506
+ 'lighter': $color-fill-success-lighter,
507
+ 'transparent': $color-fill-success-transparent
508
508
  ),
509
509
  'highlight': (
510
- 'normal': $beta-color-fill-highlight,
511
- 'light': $beta-color-fill-highlight-light,
512
- 'lighter': $beta-color-fill-highlight-lighter,
513
- 'transparent': $beta-color-fill-highlight-transparent
510
+ 'normal': $color-fill-highlight,
511
+ 'light': $color-fill-highlight-light,
512
+ 'lighter': $color-fill-highlight-lighter,
513
+ 'transparent': $color-fill-highlight-transparent
514
514
  ),
515
515
  'warning': (
516
- 'normal': $beta-color-fill-warning,
517
- 'light': $beta-color-fill-warning-light,
518
- 'lighter': $beta-color-fill-warning-lighter,
519
- 'transparent': $beta-color-fill-warning-transparent
516
+ 'normal': $color-fill-warning,
517
+ 'light': $color-fill-warning-light,
518
+ 'lighter': $color-fill-warning-lighter,
519
+ 'transparent': $color-fill-warning-transparent
520
520
  ),
521
521
  'critical': (
522
- 'normal': $beta-color-fill-critical,
523
- 'light': $beta-color-fill-critical-light,
524
- 'lighter': $beta-color-fill-critical-lighter,
525
- 'transparent': $beta-color-fill-critical-transparent
522
+ 'normal': $color-fill-critical,
523
+ 'light': $color-fill-critical-light,
524
+ 'lighter': $color-fill-critical-lighter,
525
+ 'transparent': $color-fill-critical-transparent
526
526
  ),
527
527
  'grey': (
528
- 'normal': $beta-color-fill-grey,
529
- 'heavy': $beta-color-fill-grey-heavy,
530
- 'heavier': $beta-color-fill-grey-heavier
528
+ 'normal': $color-fill-grey,
529
+ 'heavy': $color-fill-grey-heavy,
530
+ 'heavier': $color-fill-grey-heavier
531
531
  ),
532
532
  'accent': (
533
533
  'blue': (
534
- 'normal': $beta-color-fill-accent-blue,
535
- 'heavy': $beta-color-fill-accent-blue-heavy,
536
- 'heavier': $beta-color-fill-accent-blue-heavier,
537
- 'transparent': $beta-color-fill-accent-blue-transparent
534
+ 'normal': $color-fill-accent-blue,
535
+ 'heavy': $color-fill-accent-blue-heavy,
536
+ 'heavier': $color-fill-accent-blue-heavier,
537
+ 'transparent': $color-fill-accent-blue-transparent
538
538
  ),
539
539
  'cobalt': (
540
- 'normal': $beta-color-fill-accent-cobalt,
541
- 'heavy': $beta-color-fill-accent-cobalt-heavy,
542
- 'heavier': $beta-color-fill-accent-cobalt-heavier,
543
- 'transparent': $beta-color-fill-accent-cobalt-transparent
540
+ 'normal': $color-fill-accent-cobalt,
541
+ 'heavy': $color-fill-accent-cobalt-heavy,
542
+ 'heavier': $color-fill-accent-cobalt-heavier,
543
+ 'transparent': $color-fill-accent-cobalt-transparent
544
544
  ),
545
545
  'green': (
546
- 'normal': $beta-color-fill-accent-green,
547
- 'heavy': $beta-color-fill-accent-green-heavy,
548
- 'heavier': $beta-color-fill-accent-green-heavier,
549
- 'transparent': $beta-color-fill-accent-green-transparent
546
+ 'normal': $color-fill-accent-green,
547
+ 'heavy': $color-fill-accent-green-heavy,
548
+ 'heavier': $color-fill-accent-green-heavier,
549
+ 'transparent': $color-fill-accent-green-transparent
550
550
  ),
551
551
  'red': (
552
- 'normal': $beta-color-fill-accent-red,
553
- 'heavy': $beta-color-fill-accent-red-heavy,
554
- 'heavier': $beta-color-fill-accent-red-heavier,
555
- 'transparent': $beta-color-fill-accent-red-transparent
552
+ 'normal': $color-fill-accent-red,
553
+ 'heavy': $color-fill-accent-red-heavy,
554
+ 'heavier': $color-fill-accent-red-heavier,
555
+ 'transparent': $color-fill-accent-red-transparent
556
556
  ),
557
557
  'orange': (
558
- 'normal': $beta-color-fill-accent-orange,
559
- 'heavy': $beta-color-fill-accent-orange-heavy,
560
- 'heavier': $beta-color-fill-accent-orange-heavier,
561
- 'transparent': $beta-color-fill-accent-orange-transparent
558
+ 'normal': $color-fill-accent-orange,
559
+ 'heavy': $color-fill-accent-orange-heavy,
560
+ 'heavier': $color-fill-accent-orange-heavier,
561
+ 'transparent': $color-fill-accent-orange-transparent
562
562
  ),
563
563
  'yellow': (
564
- 'normal': $beta-color-fill-accent-yellow,
565
- 'heavy': $beta-color-fill-accent-yellow-heavy,
566
- 'heavier': $beta-color-fill-accent-yellow-heavier,
567
- 'transparent': $beta-color-fill-accent-yellow-transparent
564
+ 'normal': $color-fill-accent-yellow,
565
+ 'heavy': $color-fill-accent-yellow-heavy,
566
+ 'heavier': $color-fill-accent-yellow-heavier,
567
+ 'transparent': $color-fill-accent-yellow-transparent
568
568
  ),
569
569
  'olive': (
570
- 'normal': $beta-color-fill-accent-olive,
571
- 'heavy': $beta-color-fill-accent-olive-heavy,
572
- 'heavier': $beta-color-fill-accent-olive-heavier,
573
- 'transparent': $beta-color-fill-accent-olive-transparent
570
+ 'normal': $color-fill-accent-olive,
571
+ 'heavy': $color-fill-accent-olive-heavy,
572
+ 'heavier': $color-fill-accent-olive-heavier,
573
+ 'transparent': $color-fill-accent-olive-transparent
574
574
  ),
575
575
  'teal': (
576
- 'normal': $beta-color-fill-accent-teal,
577
- 'heavy': $beta-color-fill-accent-teal-heavy,
578
- 'heavier': $beta-color-fill-accent-teal-heavier,
579
- 'transparent': $beta-color-fill-accent-teal-transparent
576
+ 'normal': $color-fill-accent-teal,
577
+ 'heavy': $color-fill-accent-teal-heavy,
578
+ 'heavier': $color-fill-accent-teal-heavier,
579
+ 'transparent': $color-fill-accent-teal-transparent
580
580
  ),
581
581
  'navy': (
582
- 'normal': $beta-color-fill-accent-navy,
583
- 'heavy': $beta-color-fill-accent-navy-heavy,
584
- 'heavier': $beta-color-fill-accent-navy-heavier,
585
- 'transparent': $beta-color-fill-accent-navy-transparent
582
+ 'normal': $color-fill-accent-navy,
583
+ 'heavy': $color-fill-accent-navy-heavy,
584
+ 'heavier': $color-fill-accent-navy-heavier,
585
+ 'transparent': $color-fill-accent-navy-transparent
586
586
  ),
587
587
  'purple': (
588
- 'normal': $beta-color-fill-accent-purple,
589
- 'heavy': $beta-color-fill-accent-purple-heavy,
590
- 'heavier': $beta-color-fill-accent-purple-heavier,
591
- 'transparent': $beta-color-fill-accent-purple-transparent
588
+ 'normal': $color-fill-accent-purple,
589
+ 'heavy': $color-fill-accent-purple-heavy,
590
+ 'heavier': $color-fill-accent-purple-heavier,
591
+ 'transparent': $color-fill-accent-purple-transparent
592
592
  ),
593
593
  'pink': (
594
- 'normal': $beta-color-fill-accent-pink,
595
- 'heavy': $beta-color-fill-accent-pink-heavy,
596
- 'heavier': $beta-color-fill-accent-pink-heavier,
597
- 'transparent': $beta-color-fill-accent-pink-transparent
594
+ 'normal': $color-fill-accent-pink,
595
+ 'heavy': $color-fill-accent-pink-heavy,
596
+ 'heavier': $color-fill-accent-pink-heavier,
597
+ 'transparent': $color-fill-accent-pink-transparent
598
598
  )
599
599
  ),
600
600
  'absolute': (
601
601
  'white': (
602
- 'normal': $beta-color-fill-absolute-white,
603
- 'light': $beta-color-fill-absolute-white-light,
604
- 'transparent': $beta-color-fill-absolute-white-transparent
602
+ 'normal': $color-fill-absolute-white,
603
+ 'light': $color-fill-absolute-white-light,
604
+ 'transparent': $color-fill-absolute-white-transparent
605
605
  ),
606
606
  'black': (
607
- 'normal': $beta-color-fill-absolute-black,
608
- 'light': $beta-color-fill-absolute-black-light,
609
- 'transparent': $beta-color-fill-absolute-black-transparent
607
+ 'normal': $color-fill-absolute-black,
608
+ 'light': $color-fill-absolute-black-light,
609
+ 'transparent': $color-fill-absolute-black-transparent
610
610
  )
611
611
  )
612
612
  ),
613
613
  'border': (
614
614
  'neutral': (
615
- 'normal': $beta-color-border-neutral,
616
- 'heavy': $beta-color-border-neutral-heavy,
617
- 'heavier': $beta-color-border-neutral-heavier
615
+ 'normal': $color-border-neutral,
616
+ 'heavy': $color-border-neutral-heavy,
617
+ 'heavier': $color-border-neutral-heavier
618
618
  ),
619
619
  'detach': (
620
- 'normal': $beta-color-border-detach,
621
- 'highest': $beta-color-border-detach-highest,
622
- 'higher': $beta-color-border-detach-higher,
623
- 'high': $beta-color-border-detach-high,
624
- 'low': $beta-color-border-detach-low
620
+ 'normal': $color-border-detach,
621
+ 'highest': $color-border-detach-highest,
622
+ 'higher': $color-border-detach-higher,
623
+ 'high': $color-border-detach-high,
624
+ 'low': $color-border-detach-low
625
625
  ),
626
626
  'absolute': (
627
- 'white': $beta-color-border-absolute-white
627
+ 'white': $color-border-absolute-white
628
628
  )
629
629
  ),
630
630
  'surface': (
631
- 'normal': $beta-color-surface,
632
- 'highest': $beta-color-surface-highest,
633
- 'higher': $beta-color-surface-higher,
634
- 'high': $beta-color-surface-high,
635
- 'low': $beta-color-surface-low,
631
+ 'normal': $color-surface,
632
+ 'highest': $color-surface-highest,
633
+ 'higher': $color-surface-higher,
634
+ 'high': $color-surface-high,
635
+ 'low': $color-surface-low,
636
636
  'glass': (
637
- 'normal': $beta-color-surface-glass,
638
- 'highest': $beta-color-surface-glass-highest,
639
- 'higher': $beta-color-surface-glass-higher,
640
- 'high': $beta-color-surface-glass-high
637
+ 'normal': $color-surface-glass,
638
+ 'highest': $color-surface-glass-highest,
639
+ 'higher': $color-surface-glass-higher,
640
+ 'high': $color-surface-glass-high
641
641
  ),
642
642
  'accent': (
643
- 'blue': $beta-color-surface-accent-blue,
644
- 'cobalt': $beta-color-surface-accent-cobalt,
645
- 'green': $beta-color-surface-accent-green,
646
- 'red': $beta-color-surface-accent-red,
647
- 'orange': $beta-color-surface-accent-orange,
648
- 'yellow': $beta-color-surface-accent-yellow,
649
- 'olive': $beta-color-surface-accent-olive,
650
- 'teal': $beta-color-surface-accent-teal,
651
- 'navy': $beta-color-surface-accent-navy,
652
- 'purple': $beta-color-surface-accent-purple,
653
- 'pink': $beta-color-surface-accent-pink
643
+ 'blue': $color-surface-accent-blue,
644
+ 'cobalt': $color-surface-accent-cobalt,
645
+ 'green': $color-surface-accent-green,
646
+ 'red': $color-surface-accent-red,
647
+ 'orange': $color-surface-accent-orange,
648
+ 'yellow': $color-surface-accent-yellow,
649
+ 'olive': $color-surface-accent-olive,
650
+ 'teal': $color-surface-accent-teal,
651
+ 'navy': $color-surface-accent-navy,
652
+ 'purple': $color-surface-accent-purple,
653
+ 'pink': $color-surface-accent-pink
654
654
  )
655
655
  ),
656
656
  'dim': (
657
657
  'absolute': (
658
658
  'black': (
659
- 'normal': $beta-color-dim-absolute-black,
660
- 'heavy': $beta-color-dim-absolute-black-heavy
659
+ 'normal': $color-dim-absolute-black,
660
+ 'heavy': $color-dim-absolute-black-heavy
661
661
  ),
662
662
  'white': (
663
- 'normal': $beta-color-dim-absolute-white,
664
- 'heavy': $beta-color-dim-absolute-white-heavy
663
+ 'normal': $color-dim-absolute-white,
664
+ 'heavy': $color-dim-absolute-white-heavy
665
665
  )
666
666
  )
667
667
  ),
668
668
  'gradient': (
669
669
  'green': (
670
- 'normal': $beta-color-gradient-green,
671
- 'heavy': $beta-color-gradient-green-heavy
670
+ 'normal': $color-gradient-green,
671
+ 'heavy': $color-gradient-green-heavy
672
672
  )
673
673
  ),
674
674
  'state': (
675
- 'default': $beta-color-state-default,
675
+ 'default': $color-state-default,
676
676
  'action': (
677
- 'normal': $beta-color-state-action,
678
- 'light': $beta-color-state-action-light
677
+ 'normal': $color-state-action,
678
+ 'light': $color-state-action-light
679
679
  ),
680
680
  'warning': (
681
- 'normal': $beta-color-state-warning,
682
- 'light': $beta-color-state-warning-light
681
+ 'normal': $color-state-warning,
682
+ 'light': $color-state-warning-light
683
683
  )
684
684
  ),
685
685
  'elevation': (
686
- 'xlarge': $beta-color-elevation-xlarge,
687
- 'large': $beta-color-elevation-large,
688
- 'medium': $beta-color-elevation-medium,
689
- 'small': $beta-color-elevation-small,
690
- 'base': $beta-color-elevation-base,
691
- 'base-inner': $beta-color-elevation-base-inner
686
+ 'xlarge': $color-elevation-xlarge,
687
+ 'large': $color-elevation-large,
688
+ 'medium': $color-elevation-medium,
689
+ 'small': $color-elevation-small,
690
+ 'base': $color-elevation-base,
691
+ 'base-inner': $color-elevation-base-inner
692
692
  )
693
693
  )
694
694
  );