@vaneui/md 0.3.1-alpha.20251215154956.4cdf4bf → 0.3.1-alpha.20251226134656.e7f8e22

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.
Files changed (2) hide show
  1. package/dist/styles/index.css +193 -236
  2. package/package.json +3 -3
@@ -4,8 +4,8 @@
4
4
  /* Import @vaneui/ui base styles */
5
5
  @theme {
6
6
  /* Text Colors */
7
- --color-text-default: var(--color-gray-900);
8
- --color-text-primary: var(--color-blue-600);
7
+ --color-text-primary: var(--color-gray-900);
8
+ --color-text-brand: var(--color-blue-600);
9
9
  --color-text-secondary: var(--color-gray-600);
10
10
  --color-text-tertiary: var(--color-gray-500);
11
11
  --color-text-link: var(--color-blue-600);
@@ -16,8 +16,8 @@
16
16
  --color-text-info: var(--color-cyan-600);
17
17
 
18
18
  /* Filled Text Colors */
19
- --color-text-filled-default: var(--color-white);
20
- --color-text-filled-primary: var(--color-blue-100);
19
+ --color-text-filled-primary: var(--color-white);
20
+ --color-text-filled-brand: var(--color-blue-100);
21
21
  --color-text-filled-secondary: var(--color-gray-200);
22
22
  --color-text-filled-tertiary: var(--color-gray-300);
23
23
  --color-text-filled-link: var(--color-blue-100);
@@ -29,8 +29,8 @@
29
29
  --color-text-filled-transparent: transparent;
30
30
 
31
31
  /* UI Background Colors */
32
- --color-bg-default: var(--color-white);
33
- --color-bg-primary: var(--color-blue-50);
32
+ --color-bg-primary: var(--color-white);
33
+ --color-bg-brand: var(--color-blue-50);
34
34
  --color-bg-secondary: var(--color-gray-50);
35
35
  --color-bg-tertiary: var(--color-gray-100);
36
36
  --color-bg-accent: var(--color-rose-50);
@@ -38,11 +38,10 @@
38
38
  --color-bg-danger: var(--color-red-50);
39
39
  --color-bg-warning: var(--color-amber-50);
40
40
  --color-bg-info: var(--color-cyan-50);
41
- --color-bg-link: var(--color-blue-50);
42
41
 
43
42
  /* UI Background Hover Colors */
44
- --color-bg-hover-default: var(--color-gray-50);
45
- --color-bg-hover-primary: var(--color-blue-100);
43
+ --color-bg-hover-primary: var(--color-gray-50);
44
+ --color-bg-hover-brand: var(--color-blue-100);
46
45
  --color-bg-hover-secondary: var(--color-gray-100);
47
46
  --color-bg-hover-tertiary: var(--color-gray-200);
48
47
  --color-bg-hover-accent: var(--color-rose-100);
@@ -50,11 +49,10 @@
50
49
  --color-bg-hover-danger: var(--color-red-100);
51
50
  --color-bg-hover-warning: var(--color-amber-100);
52
51
  --color-bg-hover-info: var(--color-cyan-100);
53
- --color-bg-hover-link: var(--color-blue-100);
54
52
 
55
53
  /* UI Background Active Colors */
56
- --color-bg-active-default: var(--color-gray-100);
57
- --color-bg-active-primary: var(--color-blue-200);
54
+ --color-bg-active-primary: var(--color-gray-100);
55
+ --color-bg-active-brand: var(--color-blue-200);
58
56
  --color-bg-active-secondary: var(--color-gray-200);
59
57
  --color-bg-active-tertiary: var(--color-gray-300);
60
58
  --color-bg-active-accent: var(--color-rose-200);
@@ -62,11 +60,10 @@
62
60
  --color-bg-active-danger: var(--color-red-200);
63
61
  --color-bg-active-warning: var(--color-amber-200);
64
62
  --color-bg-active-info: var(--color-cyan-200);
65
- --color-bg-active-link: var(--color-blue-200);
66
63
 
67
64
  /* Filled UI Background Colors */
68
- --color-bg-filled-default: var(--color-gray-800);
69
- --color-bg-filled-primary: var(--color-blue-600);
65
+ --color-bg-filled-primary: var(--color-gray-800);
66
+ --color-bg-filled-brand: var(--color-blue-600);
70
67
  --color-bg-filled-secondary: var(--color-gray-600);
71
68
  --color-bg-filled-tertiary: var(--color-gray-500);
72
69
  --color-bg-filled-accent: var(--color-rose-600);
@@ -74,11 +71,10 @@
74
71
  --color-bg-filled-danger: var(--color-red-600);
75
72
  --color-bg-filled-warning: var(--color-amber-600);
76
73
  --color-bg-filled-info: var(--color-cyan-600);
77
- --color-bg-filled-link: var(--color-blue-600);
78
74
 
79
75
  /* Filled UI Hover Background Colors */
80
- --color-bg-filled-hover-default: var(--color-gray-900);
81
- --color-bg-filled-hover-primary: var(--color-blue-700);
76
+ --color-bg-filled-hover-primary: var(--color-gray-900);
77
+ --color-bg-filled-hover-brand: var(--color-blue-700);
82
78
  --color-bg-filled-hover-secondary: var(--color-gray-700);
83
79
  --color-bg-filled-hover-tertiary: var(--color-gray-600);
84
80
  --color-bg-filled-hover-accent: var(--color-rose-700);
@@ -86,11 +82,10 @@
86
82
  --color-bg-filled-hover-danger: var(--color-red-700);
87
83
  --color-bg-filled-hover-warning: var(--color-amber-700);
88
84
  --color-bg-filled-hover-info: var(--color-cyan-700);
89
- --color-bg-filled-hover-link: var(--color-blue-700);
90
85
 
91
86
  /* Filled UI Active Background Colors */
92
- --color-bg-filled-active-default: var(--color-gray-950);
93
- --color-bg-filled-active-primary: var(--color-blue-800);
87
+ --color-bg-filled-active-primary: var(--color-gray-950);
88
+ --color-bg-filled-active-brand: var(--color-blue-800);
94
89
  --color-bg-filled-active-secondary: var(--color-gray-800);
95
90
  --color-bg-filled-active-tertiary: var(--color-gray-700);
96
91
  --color-bg-filled-active-accent: var(--color-rose-800);
@@ -98,11 +93,10 @@
98
93
  --color-bg-filled-active-danger: var(--color-red-800);
99
94
  --color-bg-filled-active-warning: var(--color-amber-800);
100
95
  --color-bg-filled-active-info: var(--color-cyan-800);
101
- --color-bg-filled-active-link: var(--color-blue-800);
102
96
 
103
97
  /* Layout Background Colors */
104
- --color-bg-layout-default: var(--color-white);
105
98
  --color-bg-layout-primary: var(--color-white);
99
+ --color-bg-layout-brand: var(--color-blue-50);
106
100
  --color-bg-layout-secondary: var(--color-gray-50);
107
101
  --color-bg-layout-tertiary: var(--color-gray-100);
108
102
  --color-bg-layout-accent: var(--color-indigo-50);
@@ -111,11 +105,10 @@
111
105
  --color-bg-layout-warning: var(--color-yellow-50);
112
106
  --color-bg-layout-info: var(--color-blue-50);
113
107
  --color-bg-layout-transparent: transparent;
114
- --color-bg-layout-link: var(--color-blue-50);
115
108
 
116
109
  /* Layout Filled Background Colors */
117
- --color-bg-filled-layout-default: var(--color-gray-700);
118
- --color-bg-filled-layout-primary: var(--color-blue-800);
110
+ --color-bg-filled-layout-primary: var(--color-gray-700);
111
+ --color-bg-filled-layout-brand: var(--color-blue-800);
119
112
  --color-bg-filled-layout-secondary: var(--color-gray-800);
120
113
  --color-bg-filled-layout-tertiary: var(--color-gray-900);
121
114
  --color-bg-filled-layout-accent: var(--color-indigo-700);
@@ -124,31 +117,28 @@
124
117
  --color-bg-filled-layout-warning: var(--color-yellow-800);
125
118
  --color-bg-filled-layout-info: var(--color-blue-700);
126
119
  --color-bg-filled-layout-transparent: transparent;
127
- --color-bg-filled-layout-link: var(--color-blue-700);
128
120
 
129
121
  /* Border Colors */
130
- --color-border-default: var(--color-gray-200);
131
- --color-border-primary: var(--color-blue-200);
132
- --color-border-secondary: var(--color-gray-200);
133
- --color-border-tertiary: var(--color-gray-300);
134
- --color-border-link: var(--color-blue-200);
135
- --color-border-accent: var(--color-rose-200);
136
- --color-border-success: var(--color-green-200);
137
- --color-border-danger: var(--color-red-200);
138
- --color-border-warning: var(--color-yellow-200);
139
- --color-border-info: var(--color-blue-200);
122
+ --color-border-primary: var(--color-gray-200);
123
+ --color-border-brand: var(--color-blue-300);
124
+ --color-border-secondary: var(--color-gray-300);
125
+ --color-border-tertiary: var(--color-gray-400);
126
+ --color-border-accent: var(--color-rose-300);
127
+ --color-border-success: var(--color-emerald-300);
128
+ --color-border-danger: var(--color-red-300);
129
+ --color-border-warning: var(--color-amber-300);
130
+ --color-border-info: var(--color-cyan-300);
140
131
 
141
132
  /* Filled Button Border Colors */
142
- --color-border-filled-default: var(--color-gray-600);
143
- --color-border-filled-primary: var(--color-blue-600);
133
+ --color-border-filled-primary: var(--color-gray-600);
134
+ --color-border-filled-brand: var(--color-blue-600);
144
135
  --color-border-filled-secondary: var(--color-gray-700);
145
- --color-border-filled-tertiary: var(--color-gray-800);
136
+ --color-border-filled-tertiary: var(--color-gray-600);
146
137
  --color-border-filled-accent: var(--color-rose-600);
147
- --color-border-filled-success: var(--color-green-600);
138
+ --color-border-filled-success: var(--color-emerald-600);
148
139
  --color-border-filled-danger: var(--color-red-600);
149
- --color-border-filled-warning: var(--color-yellow-600);
150
- --color-border-filled-info: var(--color-blue-600);
151
- --color-border-filled-link: var(--color-blue-600);
140
+ --color-border-filled-warning: var(--color-amber-600);
141
+ --color-border-filled-info: var(--color-cyan-600);
152
142
 
153
143
  --layout-spacing: var(--spacing);
154
144
  --ui-spacing: var(--spacing);
@@ -206,22 +196,21 @@
206
196
  --color-amber-50: oklch(98.7% 0.022 95.277);
207
197
  --color-amber-100: oklch(96.2% 0.059 95.617);
208
198
  --color-amber-200: oklch(92.4% 0.12 95.746);
199
+ --color-amber-300: oklch(87.9% 0.169 91.605);
209
200
  --color-amber-600: oklch(66.6% 0.179 58.318);
210
201
  --color-amber-700: oklch(55.5% 0.163 48.998);
211
202
  --color-amber-800: oklch(47.3% 0.137 46.201);
212
203
  --color-yellow-50: oklch(98.7% 0.026 102.212);
213
204
  --color-yellow-100: oklch(97.3% 0.071 103.193);
214
- --color-yellow-200: oklch(94.5% 0.129 101.54);
215
- --color-yellow-600: oklch(68.1% 0.162 75.834);
216
205
  --color-yellow-800: oklch(47.6% 0.114 61.907);
217
206
  --color-green-50: oklch(98.2% 0.018 155.826);
218
- --color-green-200: oklch(92.5% 0.084 155.995);
219
207
  --color-green-500: oklch(72.3% 0.219 149.579);
220
208
  --color-green-600: oklch(62.7% 0.194 149.214);
221
209
  --color-green-700: oklch(52.7% 0.154 150.069);
222
210
  --color-emerald-50: oklch(97.9% 0.021 166.113);
223
211
  --color-emerald-100: oklch(95% 0.052 163.051);
224
212
  --color-emerald-200: oklch(90.5% 0.093 164.15);
213
+ --color-emerald-300: oklch(84.5% 0.143 164.978);
225
214
  --color-emerald-500: oklch(69.6% 0.17 162.48);
226
215
  --color-emerald-600: oklch(59.6% 0.145 163.225);
227
216
  --color-emerald-700: oklch(50.8% 0.118 165.612);
@@ -229,12 +218,14 @@
229
218
  --color-cyan-50: oklch(98.4% 0.019 200.873);
230
219
  --color-cyan-100: oklch(95.6% 0.045 203.388);
231
220
  --color-cyan-200: oklch(91.7% 0.08 205.041);
221
+ --color-cyan-300: oklch(86.5% 0.127 207.078);
232
222
  --color-cyan-600: oklch(60.9% 0.126 221.723);
233
223
  --color-cyan-700: oklch(52% 0.105 223.128);
234
224
  --color-cyan-800: oklch(45% 0.085 224.283);
235
225
  --color-blue-50: oklch(97% 0.014 254.604);
236
226
  --color-blue-100: oklch(93.2% 0.032 255.585);
237
227
  --color-blue-200: oklch(88.2% 0.059 254.128);
228
+ --color-blue-300: oklch(80.9% 0.105 251.813);
238
229
  --color-blue-500: oklch(62.3% 0.214 259.815);
239
230
  --color-blue-600: oklch(54.6% 0.245 262.881);
240
231
  --color-blue-700: oklch(48.8% 0.243 264.376);
@@ -247,12 +238,14 @@
247
238
  --color-indigo-700: oklch(45.7% 0.24 277.023);
248
239
  --color-violet-400: oklch(70.2% 0.183 293.541);
249
240
  --color-violet-600: oklch(54.1% 0.281 293.009);
241
+ --color-purple-100: oklch(94.6% 0.033 307.174);
250
242
  --color-purple-600: oklch(55.8% 0.288 302.321);
251
243
  --color-purple-700: oklch(49.6% 0.265 301.924);
252
244
  --color-pink-600: oklch(59.2% 0.249 0.584);
253
245
  --color-rose-50: oklch(96.9% 0.015 12.422);
254
246
  --color-rose-100: oklch(94.1% 0.03 12.58);
255
247
  --color-rose-200: oklch(89.2% 0.058 10.001);
248
+ --color-rose-300: oklch(81% 0.117 11.638);
256
249
  --color-rose-600: oklch(58.6% 0.253 17.585);
257
250
  --color-rose-700: oklch(51.4% 0.222 16.935);
258
251
  --color-rose-800: oklch(45.5% 0.188 13.697);
@@ -260,6 +253,7 @@
260
253
  --color-gray-100: oklch(96.7% 0.003 264.542);
261
254
  --color-gray-200: oklch(92.8% 0.006 264.531);
262
255
  --color-gray-300: oklch(87.2% 0.01 258.338);
256
+ --color-gray-400: oklch(70.7% 0.022 261.325);
263
257
  --color-gray-500: oklch(55.1% 0.027 264.364);
264
258
  --color-gray-600: oklch(44.6% 0.03 256.802);
265
259
  --color-gray-700: oklch(37.3% 0.034 259.733);
@@ -316,8 +310,8 @@
316
310
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
317
311
  --default-font-family: var(--font-sans);
318
312
  --default-mono-font-family: var(--font-mono);
319
- --color-text-default: var(--color-gray-900);
320
- --color-text-primary: var(--color-blue-600);
313
+ --color-text-primary: var(--color-gray-900);
314
+ --color-text-brand: var(--color-blue-600);
321
315
  --color-text-secondary: var(--color-gray-600);
322
316
  --color-text-tertiary: var(--color-gray-500);
323
317
  --color-text-link: var(--color-blue-600);
@@ -326,8 +320,8 @@
326
320
  --color-text-danger: var(--color-red-600);
327
321
  --color-text-warning: var(--color-amber-600);
328
322
  --color-text-info: var(--color-cyan-600);
329
- --color-text-filled-default: var(--color-white);
330
- --color-text-filled-primary: var(--color-blue-100);
323
+ --color-text-filled-primary: var(--color-white);
324
+ --color-text-filled-brand: var(--color-blue-100);
331
325
  --color-text-filled-secondary: var(--color-gray-200);
332
326
  --color-text-filled-tertiary: var(--color-gray-300);
333
327
  --color-text-filled-link: var(--color-blue-100);
@@ -336,8 +330,8 @@
336
330
  --color-text-filled-danger: var(--color-red-100);
337
331
  --color-text-filled-warning: var(--color-amber-100);
338
332
  --color-text-filled-info: var(--color-cyan-100);
339
- --color-bg-default: var(--color-white);
340
- --color-bg-primary: var(--color-blue-50);
333
+ --color-bg-primary: var(--color-white);
334
+ --color-bg-brand: var(--color-blue-50);
341
335
  --color-bg-secondary: var(--color-gray-50);
342
336
  --color-bg-tertiary: var(--color-gray-100);
343
337
  --color-bg-accent: var(--color-rose-50);
@@ -345,9 +339,8 @@
345
339
  --color-bg-danger: var(--color-red-50);
346
340
  --color-bg-warning: var(--color-amber-50);
347
341
  --color-bg-info: var(--color-cyan-50);
348
- --color-bg-link: var(--color-blue-50);
349
- --color-bg-hover-default: var(--color-gray-50);
350
- --color-bg-hover-primary: var(--color-blue-100);
342
+ --color-bg-hover-primary: var(--color-gray-50);
343
+ --color-bg-hover-brand: var(--color-blue-100);
351
344
  --color-bg-hover-secondary: var(--color-gray-100);
352
345
  --color-bg-hover-tertiary: var(--color-gray-200);
353
346
  --color-bg-hover-accent: var(--color-rose-100);
@@ -355,9 +348,8 @@
355
348
  --color-bg-hover-danger: var(--color-red-100);
356
349
  --color-bg-hover-warning: var(--color-amber-100);
357
350
  --color-bg-hover-info: var(--color-cyan-100);
358
- --color-bg-hover-link: var(--color-blue-100);
359
- --color-bg-active-default: var(--color-gray-100);
360
- --color-bg-active-primary: var(--color-blue-200);
351
+ --color-bg-active-primary: var(--color-gray-100);
352
+ --color-bg-active-brand: var(--color-blue-200);
361
353
  --color-bg-active-secondary: var(--color-gray-200);
362
354
  --color-bg-active-tertiary: var(--color-gray-300);
363
355
  --color-bg-active-accent: var(--color-rose-200);
@@ -365,9 +357,8 @@
365
357
  --color-bg-active-danger: var(--color-red-200);
366
358
  --color-bg-active-warning: var(--color-amber-200);
367
359
  --color-bg-active-info: var(--color-cyan-200);
368
- --color-bg-active-link: var(--color-blue-200);
369
- --color-bg-filled-default: var(--color-gray-800);
370
- --color-bg-filled-primary: var(--color-blue-600);
360
+ --color-bg-filled-primary: var(--color-gray-800);
361
+ --color-bg-filled-brand: var(--color-blue-600);
371
362
  --color-bg-filled-secondary: var(--color-gray-600);
372
363
  --color-bg-filled-tertiary: var(--color-gray-500);
373
364
  --color-bg-filled-accent: var(--color-rose-600);
@@ -375,9 +366,8 @@
375
366
  --color-bg-filled-danger: var(--color-red-600);
376
367
  --color-bg-filled-warning: var(--color-amber-600);
377
368
  --color-bg-filled-info: var(--color-cyan-600);
378
- --color-bg-filled-link: var(--color-blue-600);
379
- --color-bg-filled-hover-default: var(--color-gray-900);
380
- --color-bg-filled-hover-primary: var(--color-blue-700);
369
+ --color-bg-filled-hover-primary: var(--color-gray-900);
370
+ --color-bg-filled-hover-brand: var(--color-blue-700);
381
371
  --color-bg-filled-hover-secondary: var(--color-gray-700);
382
372
  --color-bg-filled-hover-tertiary: var(--color-gray-600);
383
373
  --color-bg-filled-hover-accent: var(--color-rose-700);
@@ -385,9 +375,8 @@
385
375
  --color-bg-filled-hover-danger: var(--color-red-700);
386
376
  --color-bg-filled-hover-warning: var(--color-amber-700);
387
377
  --color-bg-filled-hover-info: var(--color-cyan-700);
388
- --color-bg-filled-hover-link: var(--color-blue-700);
389
- --color-bg-filled-active-default: var(--color-gray-950);
390
- --color-bg-filled-active-primary: var(--color-blue-800);
378
+ --color-bg-filled-active-primary: var(--color-gray-950);
379
+ --color-bg-filled-active-brand: var(--color-blue-800);
391
380
  --color-bg-filled-active-secondary: var(--color-gray-800);
392
381
  --color-bg-filled-active-tertiary: var(--color-gray-700);
393
382
  --color-bg-filled-active-accent: var(--color-rose-800);
@@ -395,9 +384,8 @@
395
384
  --color-bg-filled-active-danger: var(--color-red-800);
396
385
  --color-bg-filled-active-warning: var(--color-amber-800);
397
386
  --color-bg-filled-active-info: var(--color-cyan-800);
398
- --color-bg-filled-active-link: var(--color-blue-800);
399
- --color-bg-layout-default: var(--color-white);
400
387
  --color-bg-layout-primary: var(--color-white);
388
+ --color-bg-layout-brand: var(--color-blue-50);
401
389
  --color-bg-layout-secondary: var(--color-gray-50);
402
390
  --color-bg-layout-tertiary: var(--color-gray-100);
403
391
  --color-bg-layout-accent: var(--color-indigo-50);
@@ -405,9 +393,8 @@
405
393
  --color-bg-layout-danger: var(--color-red-50);
406
394
  --color-bg-layout-warning: var(--color-yellow-50);
407
395
  --color-bg-layout-info: var(--color-blue-50);
408
- --color-bg-layout-link: var(--color-blue-50);
409
- --color-bg-filled-layout-default: var(--color-gray-700);
410
- --color-bg-filled-layout-primary: var(--color-blue-800);
396
+ --color-bg-filled-layout-primary: var(--color-gray-700);
397
+ --color-bg-filled-layout-brand: var(--color-blue-800);
411
398
  --color-bg-filled-layout-secondary: var(--color-gray-800);
412
399
  --color-bg-filled-layout-tertiary: var(--color-gray-900);
413
400
  --color-bg-filled-layout-accent: var(--color-indigo-700);
@@ -415,27 +402,24 @@
415
402
  --color-bg-filled-layout-danger: var(--color-red-700);
416
403
  --color-bg-filled-layout-warning: var(--color-yellow-800);
417
404
  --color-bg-filled-layout-info: var(--color-blue-700);
418
- --color-bg-filled-layout-link: var(--color-blue-700);
419
- --color-border-default: var(--color-gray-200);
420
- --color-border-primary: var(--color-blue-200);
421
- --color-border-secondary: var(--color-gray-200);
422
- --color-border-tertiary: var(--color-gray-300);
423
- --color-border-link: var(--color-blue-200);
424
- --color-border-accent: var(--color-rose-200);
425
- --color-border-success: var(--color-green-200);
426
- --color-border-danger: var(--color-red-200);
427
- --color-border-warning: var(--color-yellow-200);
428
- --color-border-info: var(--color-blue-200);
429
- --color-border-filled-default: var(--color-gray-600);
430
- --color-border-filled-primary: var(--color-blue-600);
405
+ --color-border-primary: var(--color-gray-200);
406
+ --color-border-brand: var(--color-blue-300);
407
+ --color-border-secondary: var(--color-gray-300);
408
+ --color-border-tertiary: var(--color-gray-400);
409
+ --color-border-accent: var(--color-rose-300);
410
+ --color-border-success: var(--color-emerald-300);
411
+ --color-border-danger: var(--color-red-300);
412
+ --color-border-warning: var(--color-amber-300);
413
+ --color-border-info: var(--color-cyan-300);
414
+ --color-border-filled-primary: var(--color-gray-600);
415
+ --color-border-filled-brand: var(--color-blue-600);
431
416
  --color-border-filled-secondary: var(--color-gray-700);
432
- --color-border-filled-tertiary: var(--color-gray-800);
417
+ --color-border-filled-tertiary: var(--color-gray-600);
433
418
  --color-border-filled-accent: var(--color-rose-600);
434
- --color-border-filled-success: var(--color-green-600);
419
+ --color-border-filled-success: var(--color-emerald-600);
435
420
  --color-border-filled-danger: var(--color-red-600);
436
- --color-border-filled-warning: var(--color-yellow-600);
437
- --color-border-filled-info: var(--color-blue-600);
438
- --color-border-filled-link: var(--color-blue-600);
421
+ --color-border-filled-warning: var(--color-amber-600);
422
+ --color-border-filled-info: var(--color-cyan-600);
439
423
  --layout-spacing: var(--spacing);
440
424
  --ui-spacing: var(--spacing);
441
425
  --br-base: var(--spacing);
@@ -669,6 +653,12 @@
669
653
  .mb-2 {
670
654
  margin-bottom: calc(var(--spacing) * 2);
671
655
  }
656
+ .mb-3 {
657
+ margin-bottom: calc(var(--spacing) * 3);
658
+ }
659
+ .mb-6 {
660
+ margin-bottom: calc(var(--spacing) * 6);
661
+ }
672
662
  .block {
673
663
  display: block;
674
664
  }
@@ -709,6 +699,9 @@
709
699
  width: var(--ui-size);
710
700
  height: var(--ui-size);
711
701
  }
702
+ .h-10 {
703
+ height: calc(var(--spacing) * 10);
704
+ }
712
705
  .h-\[calc\(var\(--lh\)\*var\(--fs\)\)\] {
713
706
  height: calc(var(--lh) * var(--fs));
714
707
  }
@@ -793,6 +786,9 @@
793
786
  .grid-cols-1 {
794
787
  grid-template-columns: repeat(1, minmax(0, 1fr));
795
788
  }
789
+ .grid-cols-6 {
790
+ grid-template-columns: repeat(6, minmax(0, 1fr));
791
+ }
796
792
  .flex-col {
797
793
  flex-direction: column;
798
794
  }
@@ -862,6 +858,9 @@
862
858
  .gap-0 {
863
859
  gap: calc(var(--spacing) * 0);
864
860
  }
861
+ .gap-1 {
862
+ gap: calc(var(--spacing) * 1);
863
+ }
865
864
  .gap-unit {
866
865
  gap: var(--gap-unit);
867
866
  }
@@ -879,6 +878,11 @@
879
878
  margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
880
879
  }
881
880
  }
881
+ .truncate {
882
+ overflow: hidden;
883
+ text-overflow: ellipsis;
884
+ white-space: nowrap;
885
+ }
882
886
  .overflow-auto {
883
887
  overflow: auto;
884
888
  }
@@ -978,6 +982,9 @@
978
982
  .border-\(--color-border-accent\) {
979
983
  border-color: var(--color-border-accent);
980
984
  }
985
+ .border-\(--color-border-brand\) {
986
+ border-color: var(--color-border-brand);
987
+ }
981
988
  .border-\(--color-border-danger\) {
982
989
  border-color: var(--color-border-danger);
983
990
  }
@@ -987,18 +994,15 @@
987
994
  .border-\(--color-border-filled-accent\) {
988
995
  border-color: var(--color-border-filled-accent);
989
996
  }
997
+ .border-\(--color-border-filled-brand\) {
998
+ border-color: var(--color-border-filled-brand);
999
+ }
990
1000
  .border-\(--color-border-filled-danger\) {
991
1001
  border-color: var(--color-border-filled-danger);
992
1002
  }
993
- .border-\(--color-border-filled-default\) {
994
- border-color: var(--color-border-filled-default);
995
- }
996
1003
  .border-\(--color-border-filled-info\) {
997
1004
  border-color: var(--color-border-filled-info);
998
1005
  }
999
- .border-\(--color-border-filled-link\) {
1000
- border-color: var(--color-border-filled-link);
1001
- }
1002
1006
  .border-\(--color-border-filled-primary\) {
1003
1007
  border-color: var(--color-border-filled-primary);
1004
1008
  }
@@ -1017,9 +1021,6 @@
1017
1021
  .border-\(--color-border-info\) {
1018
1022
  border-color: var(--color-border-info);
1019
1023
  }
1020
- .border-\(--color-border-link\) {
1021
- border-color: var(--color-border-link);
1022
- }
1023
1024
  .border-\(--color-border-primary\) {
1024
1025
  border-color: var(--color-border-primary);
1025
1026
  }
@@ -1056,39 +1057,36 @@
1056
1057
  .bg-\(--color-bg-accent\) {
1057
1058
  background-color: var(--color-bg-accent);
1058
1059
  }
1060
+ .bg-\(--color-bg-brand\) {
1061
+ background-color: var(--color-bg-brand);
1062
+ }
1059
1063
  .bg-\(--color-bg-danger\) {
1060
1064
  background-color: var(--color-bg-danger);
1061
1065
  }
1062
- .bg-\(--color-bg-default\) {
1063
- background-color: var(--color-bg-default);
1064
- }
1065
1066
  .bg-\(--color-bg-filled-accent\) {
1066
1067
  background-color: var(--color-bg-filled-accent);
1067
1068
  }
1069
+ .bg-\(--color-bg-filled-brand\) {
1070
+ background-color: var(--color-bg-filled-brand);
1071
+ }
1068
1072
  .bg-\(--color-bg-filled-danger\) {
1069
1073
  background-color: var(--color-bg-filled-danger);
1070
1074
  }
1071
- .bg-\(--color-bg-filled-default\) {
1072
- background-color: var(--color-bg-filled-default);
1073
- }
1074
1075
  .bg-\(--color-bg-filled-info\) {
1075
1076
  background-color: var(--color-bg-filled-info);
1076
1077
  }
1077
1078
  .bg-\(--color-bg-filled-layout-accent\) {
1078
1079
  background-color: var(--color-bg-filled-layout-accent);
1079
1080
  }
1081
+ .bg-\(--color-bg-filled-layout-brand\) {
1082
+ background-color: var(--color-bg-filled-layout-brand);
1083
+ }
1080
1084
  .bg-\(--color-bg-filled-layout-danger\) {
1081
1085
  background-color: var(--color-bg-filled-layout-danger);
1082
1086
  }
1083
- .bg-\(--color-bg-filled-layout-default\) {
1084
- background-color: var(--color-bg-filled-layout-default);
1085
- }
1086
1087
  .bg-\(--color-bg-filled-layout-info\) {
1087
1088
  background-color: var(--color-bg-filled-layout-info);
1088
1089
  }
1089
- .bg-\(--color-bg-filled-layout-link\) {
1090
- background-color: var(--color-bg-filled-layout-link);
1091
- }
1092
1090
  .bg-\(--color-bg-filled-layout-primary\) {
1093
1091
  background-color: var(--color-bg-filled-layout-primary);
1094
1092
  }
@@ -1104,9 +1102,6 @@
1104
1102
  .bg-\(--color-bg-filled-layout-warning\) {
1105
1103
  background-color: var(--color-bg-filled-layout-warning);
1106
1104
  }
1107
- .bg-\(--color-bg-filled-link\) {
1108
- background-color: var(--color-bg-filled-link);
1109
- }
1110
1105
  .bg-\(--color-bg-filled-primary\) {
1111
1106
  background-color: var(--color-bg-filled-primary);
1112
1107
  }
@@ -1128,18 +1123,15 @@
1128
1123
  .bg-\(--color-bg-layout-accent\) {
1129
1124
  background-color: var(--color-bg-layout-accent);
1130
1125
  }
1126
+ .bg-\(--color-bg-layout-brand\) {
1127
+ background-color: var(--color-bg-layout-brand);
1128
+ }
1131
1129
  .bg-\(--color-bg-layout-danger\) {
1132
1130
  background-color: var(--color-bg-layout-danger);
1133
1131
  }
1134
- .bg-\(--color-bg-layout-default\) {
1135
- background-color: var(--color-bg-layout-default);
1136
- }
1137
1132
  .bg-\(--color-bg-layout-info\) {
1138
1133
  background-color: var(--color-bg-layout-info);
1139
1134
  }
1140
- .bg-\(--color-bg-layout-link\) {
1141
- background-color: var(--color-bg-layout-link);
1142
- }
1143
1135
  .bg-\(--color-bg-layout-primary\) {
1144
1136
  background-color: var(--color-bg-layout-primary);
1145
1137
  }
@@ -1155,9 +1147,6 @@
1155
1147
  .bg-\(--color-bg-layout-warning\) {
1156
1148
  background-color: var(--color-bg-layout-warning);
1157
1149
  }
1158
- .bg-\(--color-bg-link\) {
1159
- background-color: var(--color-bg-link);
1160
- }
1161
1150
  .bg-\(--color-bg-primary\) {
1162
1151
  background-color: var(--color-bg-primary);
1163
1152
  }
@@ -1176,18 +1165,15 @@
1176
1165
  .bg-\(--color-border-accent\) {
1177
1166
  background-color: var(--color-border-accent);
1178
1167
  }
1168
+ .bg-\(--color-border-brand\) {
1169
+ background-color: var(--color-border-brand);
1170
+ }
1179
1171
  .bg-\(--color-border-danger\) {
1180
1172
  background-color: var(--color-border-danger);
1181
1173
  }
1182
- .bg-\(--color-border-default\) {
1183
- background-color: var(--color-border-default);
1184
- }
1185
1174
  .bg-\(--color-border-info\) {
1186
1175
  background-color: var(--color-border-info);
1187
1176
  }
1188
- .bg-\(--color-border-link\) {
1189
- background-color: var(--color-border-link);
1190
- }
1191
1177
  .bg-\(--color-border-primary\) {
1192
1178
  background-color: var(--color-border-primary);
1193
1179
  }
@@ -1257,6 +1243,9 @@
1257
1243
  .px-\(--ui-px\) {
1258
1244
  padding-inline: var(--ui-px);
1259
1245
  }
1246
+ .px-1 {
1247
+ padding-inline: calc(var(--spacing) * 1);
1248
+ }
1260
1249
  .px-4 {
1261
1250
  padding-inline: calc(var(--spacing) * 4);
1262
1251
  }
@@ -1364,6 +1353,9 @@
1364
1353
  .text-\(length\:--fs\) {
1365
1354
  font-size: var(--fs);
1366
1355
  }
1356
+ .text-\[10px\] {
1357
+ font-size: 10px;
1358
+ }
1367
1359
  .leading-\(--lh\) {
1368
1360
  --tw-leading: var(--lh);
1369
1361
  line-height: var(--lh);
@@ -1425,21 +1417,21 @@
1425
1417
  .text-\(--color-text-accent\) {
1426
1418
  color: var(--color-text-accent);
1427
1419
  }
1420
+ .text-\(--color-text-brand\) {
1421
+ color: var(--color-text-brand);
1422
+ }
1428
1423
  .text-\(--color-text-danger\) {
1429
1424
  color: var(--color-text-danger);
1430
1425
  }
1431
- .text-\(--color-text-default\) {
1432
- color: var(--color-text-default);
1433
- }
1434
1426
  .text-\(--color-text-filled-accent\) {
1435
1427
  color: var(--color-text-filled-accent);
1436
1428
  }
1429
+ .text-\(--color-text-filled-brand\) {
1430
+ color: var(--color-text-filled-brand);
1431
+ }
1437
1432
  .text-\(--color-text-filled-danger\) {
1438
1433
  color: var(--color-text-filled-danger);
1439
1434
  }
1440
- .text-\(--color-text-filled-default\) {
1441
- color: var(--color-text-filled-default);
1442
- }
1443
1435
  .text-\(--color-text-filled-info\) {
1444
1436
  color: var(--color-text-filled-info);
1445
1437
  }
@@ -1488,6 +1480,15 @@
1488
1480
  .text-blue-500 {
1489
1481
  color: var(--color-blue-500);
1490
1482
  }
1483
+ .text-gray-500 {
1484
+ color: var(--color-gray-500);
1485
+ }
1486
+ .text-gray-600 {
1487
+ color: var(--color-gray-600);
1488
+ }
1489
+ .text-gray-700 {
1490
+ color: var(--color-gray-700);
1491
+ }
1491
1492
  .text-green-500 {
1492
1493
  color: var(--color-green-500);
1493
1494
  }
@@ -1497,6 +1498,12 @@
1497
1498
  .text-pink-600 {
1498
1499
  color: var(--color-pink-600);
1499
1500
  }
1501
+ .text-purple-100 {
1502
+ color: var(--color-purple-100);
1503
+ }
1504
+ .text-purple-600 {
1505
+ color: var(--color-purple-600);
1506
+ }
1500
1507
  .text-red-500 {
1501
1508
  color: var(--color-red-500);
1502
1509
  }
@@ -1545,27 +1552,24 @@
1545
1552
  .accent-\(--color-bg-accent\) {
1546
1553
  accent-color: var(--color-bg-accent);
1547
1554
  }
1555
+ .accent-\(--color-bg-brand\) {
1556
+ accent-color: var(--color-bg-brand);
1557
+ }
1548
1558
  .accent-\(--color-bg-danger\) {
1549
1559
  accent-color: var(--color-bg-danger);
1550
1560
  }
1551
- .accent-\(--color-bg-default\) {
1552
- accent-color: var(--color-bg-default);
1553
- }
1554
1561
  .accent-\(--color-bg-filled-accent\) {
1555
1562
  accent-color: var(--color-bg-filled-accent);
1556
1563
  }
1564
+ .accent-\(--color-bg-filled-brand\) {
1565
+ accent-color: var(--color-bg-filled-brand);
1566
+ }
1557
1567
  .accent-\(--color-bg-filled-danger\) {
1558
1568
  accent-color: var(--color-bg-filled-danger);
1559
1569
  }
1560
- .accent-\(--color-bg-filled-default\) {
1561
- accent-color: var(--color-bg-filled-default);
1562
- }
1563
1570
  .accent-\(--color-bg-filled-info\) {
1564
1571
  accent-color: var(--color-bg-filled-info);
1565
1572
  }
1566
- .accent-\(--color-bg-filled-link\) {
1567
- accent-color: var(--color-bg-filled-link);
1568
- }
1569
1573
  .accent-\(--color-bg-filled-primary\) {
1570
1574
  accent-color: var(--color-bg-filled-primary);
1571
1575
  }
@@ -1584,9 +1588,6 @@
1584
1588
  .accent-\(--color-bg-info\) {
1585
1589
  accent-color: var(--color-bg-info);
1586
1590
  }
1587
- .accent-\(--color-bg-link\) {
1588
- accent-color: var(--color-bg-link);
1589
- }
1590
1591
  .accent-\(--color-bg-primary\) {
1591
1592
  accent-color: var(--color-bg-primary);
1592
1593
  }
@@ -1662,27 +1663,24 @@
1662
1663
  .ring-\(--color-border-accent\) {
1663
1664
  --tw-ring-color: var(--color-border-accent);
1664
1665
  }
1666
+ .ring-\(--color-border-brand\) {
1667
+ --tw-ring-color: var(--color-border-brand);
1668
+ }
1665
1669
  .ring-\(--color-border-danger\) {
1666
1670
  --tw-ring-color: var(--color-border-danger);
1667
1671
  }
1668
- .ring-\(--color-border-default\) {
1669
- --tw-ring-color: var(--color-border-default);
1670
- }
1671
1672
  .ring-\(--color-border-filled-accent\) {
1672
1673
  --tw-ring-color: var(--color-border-filled-accent);
1673
1674
  }
1675
+ .ring-\(--color-border-filled-brand\) {
1676
+ --tw-ring-color: var(--color-border-filled-brand);
1677
+ }
1674
1678
  .ring-\(--color-border-filled-danger\) {
1675
1679
  --tw-ring-color: var(--color-border-filled-danger);
1676
1680
  }
1677
- .ring-\(--color-border-filled-default\) {
1678
- --tw-ring-color: var(--color-border-filled-default);
1679
- }
1680
1681
  .ring-\(--color-border-filled-info\) {
1681
1682
  --tw-ring-color: var(--color-border-filled-info);
1682
1683
  }
1683
- .ring-\(--color-border-filled-link\) {
1684
- --tw-ring-color: var(--color-border-filled-link);
1685
- }
1686
1684
  .ring-\(--color-border-filled-primary\) {
1687
1685
  --tw-ring-color: var(--color-border-filled-primary);
1688
1686
  }
@@ -1701,9 +1699,6 @@
1701
1699
  .ring-\(--color-border-info\) {
1702
1700
  --tw-ring-color: var(--color-border-info);
1703
1701
  }
1704
- .ring-\(--color-border-link\) {
1705
- --tw-ring-color: var(--color-border-link);
1706
- }
1707
1702
  .ring-\(--color-border-primary\) {
1708
1703
  --tw-ring-color: var(--color-border-primary);
1709
1704
  }
@@ -1772,6 +1767,12 @@
1772
1767
  .\[--aspect-ratio\:2\] {
1773
1768
  --aspect-ratio: 2;
1774
1769
  }
1770
+ .\[--aspect-ratio\:3\] {
1771
+ --aspect-ratio: 3;
1772
+ }
1773
+ .\[--aspect-ratio\:4\] {
1774
+ --aspect-ratio: 4;
1775
+ }
1775
1776
  .\[--br-unit\:1\.5\] {
1776
1777
  --br-unit: 1.5;
1777
1778
  }
@@ -1974,14 +1975,14 @@
1974
1975
  background-color: var(--color-bg-accent);
1975
1976
  }
1976
1977
  }
1977
- .checked\:bg-\(--color-bg-danger\) {
1978
+ .checked\:bg-\(--color-bg-brand\) {
1978
1979
  &:checked {
1979
- background-color: var(--color-bg-danger);
1980
+ background-color: var(--color-bg-brand);
1980
1981
  }
1981
1982
  }
1982
- .checked\:bg-\(--color-bg-default\) {
1983
+ .checked\:bg-\(--color-bg-danger\) {
1983
1984
  &:checked {
1984
- background-color: var(--color-bg-default);
1985
+ background-color: var(--color-bg-danger);
1985
1986
  }
1986
1987
  }
1987
1988
  .checked\:bg-\(--color-bg-filled-accent\) {
@@ -1989,14 +1990,14 @@
1989
1990
  background-color: var(--color-bg-filled-accent);
1990
1991
  }
1991
1992
  }
1992
- .checked\:bg-\(--color-bg-filled-danger\) {
1993
+ .checked\:bg-\(--color-bg-filled-brand\) {
1993
1994
  &:checked {
1994
- background-color: var(--color-bg-filled-danger);
1995
+ background-color: var(--color-bg-filled-brand);
1995
1996
  }
1996
1997
  }
1997
- .checked\:bg-\(--color-bg-filled-default\) {
1998
+ .checked\:bg-\(--color-bg-filled-danger\) {
1998
1999
  &:checked {
1999
- background-color: var(--color-bg-filled-default);
2000
+ background-color: var(--color-bg-filled-danger);
2000
2001
  }
2001
2002
  }
2002
2003
  .checked\:bg-\(--color-bg-filled-info\) {
@@ -2004,11 +2005,6 @@
2004
2005
  background-color: var(--color-bg-filled-info);
2005
2006
  }
2006
2007
  }
2007
- .checked\:bg-\(--color-bg-filled-link\) {
2008
- &:checked {
2009
- background-color: var(--color-bg-filled-link);
2010
- }
2011
- }
2012
2008
  .checked\:bg-\(--color-bg-filled-primary\) {
2013
2009
  &:checked {
2014
2010
  background-color: var(--color-bg-filled-primary);
@@ -2039,11 +2035,6 @@
2039
2035
  background-color: var(--color-bg-info);
2040
2036
  }
2041
2037
  }
2042
- .checked\:bg-\(--color-bg-link\) {
2043
- &:checked {
2044
- background-color: var(--color-bg-link);
2045
- }
2046
- }
2047
2038
  .checked\:bg-\(--color-bg-primary\) {
2048
2039
  &:checked {
2049
2040
  background-color: var(--color-bg-primary);
@@ -2098,17 +2089,17 @@
2098
2089
  }
2099
2090
  }
2100
2091
  }
2101
- .hover\:bg-\(--color-bg-filled-hover-danger\) {
2092
+ .hover\:bg-\(--color-bg-filled-hover-brand\) {
2102
2093
  &:hover {
2103
2094
  @media (hover: hover) {
2104
- background-color: var(--color-bg-filled-hover-danger);
2095
+ background-color: var(--color-bg-filled-hover-brand);
2105
2096
  }
2106
2097
  }
2107
2098
  }
2108
- .hover\:bg-\(--color-bg-filled-hover-default\) {
2099
+ .hover\:bg-\(--color-bg-filled-hover-danger\) {
2109
2100
  &:hover {
2110
2101
  @media (hover: hover) {
2111
- background-color: var(--color-bg-filled-hover-default);
2102
+ background-color: var(--color-bg-filled-hover-danger);
2112
2103
  }
2113
2104
  }
2114
2105
  }
@@ -2119,13 +2110,6 @@
2119
2110
  }
2120
2111
  }
2121
2112
  }
2122
- .hover\:bg-\(--color-bg-filled-hover-link\) {
2123
- &:hover {
2124
- @media (hover: hover) {
2125
- background-color: var(--color-bg-filled-hover-link);
2126
- }
2127
- }
2128
- }
2129
2113
  .hover\:bg-\(--color-bg-filled-hover-primary\) {
2130
2114
  &:hover {
2131
2115
  @media (hover: hover) {
@@ -2168,17 +2152,17 @@
2168
2152
  }
2169
2153
  }
2170
2154
  }
2171
- .hover\:bg-\(--color-bg-hover-danger\) {
2155
+ .hover\:bg-\(--color-bg-hover-brand\) {
2172
2156
  &:hover {
2173
2157
  @media (hover: hover) {
2174
- background-color: var(--color-bg-hover-danger);
2158
+ background-color: var(--color-bg-hover-brand);
2175
2159
  }
2176
2160
  }
2177
2161
  }
2178
- .hover\:bg-\(--color-bg-hover-default\) {
2162
+ .hover\:bg-\(--color-bg-hover-danger\) {
2179
2163
  &:hover {
2180
2164
  @media (hover: hover) {
2181
- background-color: var(--color-bg-hover-default);
2165
+ background-color: var(--color-bg-hover-danger);
2182
2166
  }
2183
2167
  }
2184
2168
  }
@@ -2189,13 +2173,6 @@
2189
2173
  }
2190
2174
  }
2191
2175
  }
2192
- .hover\:bg-\(--color-bg-hover-link\) {
2193
- &:hover {
2194
- @media (hover: hover) {
2195
- background-color: var(--color-bg-hover-link);
2196
- }
2197
- }
2198
- }
2199
2176
  .hover\:bg-\(--color-bg-hover-primary\) {
2200
2177
  &:hover {
2201
2178
  @media (hover: hover) {
@@ -2351,14 +2328,14 @@
2351
2328
  outline-color: var(--color-border-accent);
2352
2329
  }
2353
2330
  }
2354
- .focus-visible\:outline-\(--color-border-danger\) {
2331
+ .focus-visible\:outline-\(--color-border-brand\) {
2355
2332
  &:focus-visible {
2356
- outline-color: var(--color-border-danger);
2333
+ outline-color: var(--color-border-brand);
2357
2334
  }
2358
2335
  }
2359
- .focus-visible\:outline-\(--color-border-default\) {
2336
+ .focus-visible\:outline-\(--color-border-danger\) {
2360
2337
  &:focus-visible {
2361
- outline-color: var(--color-border-default);
2338
+ outline-color: var(--color-border-danger);
2362
2339
  }
2363
2340
  }
2364
2341
  .focus-visible\:outline-\(--color-border-filled-accent\) {
@@ -2366,14 +2343,14 @@
2366
2343
  outline-color: var(--color-border-filled-accent);
2367
2344
  }
2368
2345
  }
2369
- .focus-visible\:outline-\(--color-border-filled-danger\) {
2346
+ .focus-visible\:outline-\(--color-border-filled-brand\) {
2370
2347
  &:focus-visible {
2371
- outline-color: var(--color-border-filled-danger);
2348
+ outline-color: var(--color-border-filled-brand);
2372
2349
  }
2373
2350
  }
2374
- .focus-visible\:outline-\(--color-border-filled-default\) {
2351
+ .focus-visible\:outline-\(--color-border-filled-danger\) {
2375
2352
  &:focus-visible {
2376
- outline-color: var(--color-border-filled-default);
2353
+ outline-color: var(--color-border-filled-danger);
2377
2354
  }
2378
2355
  }
2379
2356
  .focus-visible\:outline-\(--color-border-filled-info\) {
@@ -2381,11 +2358,6 @@
2381
2358
  outline-color: var(--color-border-filled-info);
2382
2359
  }
2383
2360
  }
2384
- .focus-visible\:outline-\(--color-border-filled-link\) {
2385
- &:focus-visible {
2386
- outline-color: var(--color-border-filled-link);
2387
- }
2388
- }
2389
2361
  .focus-visible\:outline-\(--color-border-filled-primary\) {
2390
2362
  &:focus-visible {
2391
2363
  outline-color: var(--color-border-filled-primary);
@@ -2416,11 +2388,6 @@
2416
2388
  outline-color: var(--color-border-info);
2417
2389
  }
2418
2390
  }
2419
- .focus-visible\:outline-\(--color-border-link\) {
2420
- &:focus-visible {
2421
- outline-color: var(--color-border-link);
2422
- }
2423
- }
2424
2391
  .focus-visible\:outline-\(--color-border-primary\) {
2425
2392
  &:focus-visible {
2426
2393
  outline-color: var(--color-border-primary);
@@ -2461,14 +2428,14 @@
2461
2428
  background-color: var(--color-bg-active-accent);
2462
2429
  }
2463
2430
  }
2464
- .active\:bg-\(--color-bg-active-danger\) {
2431
+ .active\:bg-\(--color-bg-active-brand\) {
2465
2432
  &:active {
2466
- background-color: var(--color-bg-active-danger);
2433
+ background-color: var(--color-bg-active-brand);
2467
2434
  }
2468
2435
  }
2469
- .active\:bg-\(--color-bg-active-default\) {
2436
+ .active\:bg-\(--color-bg-active-danger\) {
2470
2437
  &:active {
2471
- background-color: var(--color-bg-active-default);
2438
+ background-color: var(--color-bg-active-danger);
2472
2439
  }
2473
2440
  }
2474
2441
  .active\:bg-\(--color-bg-active-info\) {
@@ -2476,11 +2443,6 @@
2476
2443
  background-color: var(--color-bg-active-info);
2477
2444
  }
2478
2445
  }
2479
- .active\:bg-\(--color-bg-active-link\) {
2480
- &:active {
2481
- background-color: var(--color-bg-active-link);
2482
- }
2483
- }
2484
2446
  .active\:bg-\(--color-bg-active-primary\) {
2485
2447
  &:active {
2486
2448
  background-color: var(--color-bg-active-primary);
@@ -2511,14 +2473,14 @@
2511
2473
  background-color: var(--color-bg-filled-active-accent);
2512
2474
  }
2513
2475
  }
2514
- .active\:bg-\(--color-bg-filled-active-danger\) {
2476
+ .active\:bg-\(--color-bg-filled-active-brand\) {
2515
2477
  &:active {
2516
- background-color: var(--color-bg-filled-active-danger);
2478
+ background-color: var(--color-bg-filled-active-brand);
2517
2479
  }
2518
2480
  }
2519
- .active\:bg-\(--color-bg-filled-active-default\) {
2481
+ .active\:bg-\(--color-bg-filled-active-danger\) {
2520
2482
  &:active {
2521
- background-color: var(--color-bg-filled-active-default);
2483
+ background-color: var(--color-bg-filled-active-danger);
2522
2484
  }
2523
2485
  }
2524
2486
  .active\:bg-\(--color-bg-filled-active-info\) {
@@ -2526,11 +2488,6 @@
2526
2488
  background-color: var(--color-bg-filled-active-info);
2527
2489
  }
2528
2490
  }
2529
- .active\:bg-\(--color-bg-filled-active-link\) {
2530
- &:active {
2531
- background-color: var(--color-bg-filled-active-link);
2532
- }
2533
- }
2534
2491
  .active\:bg-\(--color-bg-filled-active-primary\) {
2535
2492
  &:active {
2536
2493
  background-color: var(--color-bg-filled-active-primary);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaneui/md",
3
- "version": "0.3.1-alpha.20251215154956.4cdf4bf",
3
+ "version": "0.3.1-alpha.20251226134656.e7f8e22",
4
4
  "description": "Markdown component for VaneUI - A React component that renders markdown using @vaneui/ui components",
5
5
  "author": "",
6
6
  "license": "ISC",
@@ -48,7 +48,7 @@
48
48
  "playground": "npm run playground:install && npm run playground:dev"
49
49
  },
50
50
  "peerDependencies": {
51
- "@vaneui/ui": "0.3.1-alpha.20251214142729.7385e1d",
51
+ "@vaneui/ui": "0.3.1-alpha.20251226133439.1de14bb",
52
52
  "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
53
53
  "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
54
54
  },
@@ -63,7 +63,7 @@
63
63
  "@types/jest": "^29.5.14",
64
64
  "@types/react": "^19.1.0",
65
65
  "@types/react-dom": "^19.1.0",
66
- "@vaneui/ui": "0.3.1-alpha.20251214142729.7385e1d",
66
+ "@vaneui/ui": "0.3.1-alpha.20251226133439.1de14bb",
67
67
  "jest": "^29.7.0",
68
68
  "jest-environment-jsdom": "^30.0.4",
69
69
  "jsdom": "^26.1.0",