@semi-bot/semi-theme-fnos 1.1.1 → 1.1.2

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 (8) hide show
  1. package/README.md +2 -2
  2. package/package.json +1 -1
  3. package/raw.json +281 -272
  4. package/scss/_palette.scss +83 -83
  5. package/scss/global.scss +130 -130
  6. package/scss/local.scss +59 -54
  7. package/semi.css +343 -343
  8. package/semi.min.css +1 -1
package/semi.css CHANGED
@@ -8,9 +8,9 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
8
8
  --semi-red-3: 244,113,113;
9
9
  --semi-red-4: 235,66,66;
10
10
  --semi-red-5: 230,0,35;
11
- --semi-red-6: 204,0,0;
12
- --semi-red-7: 182,0,0;
13
- --semi-red-8: 155,0,0;
11
+ --semi-red-6: 199,33,18;
12
+ --semi-red-7: 164,17,10;
13
+ --semi-red-8: 128,6,4;
14
14
  --semi-red-9: 51,0,0;
15
15
  --semi-white: 255,255,255;
16
16
  --semi-blue-0: 230,244,255;
@@ -33,16 +33,16 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
33
33
  --semi-cyan-7: 0,121,148;
34
34
  --semi-cyan-8: 0,89,111;
35
35
  --semi-cyan-9: 0,58,74;
36
- --semi-grey-0: 249,249,249;
37
- --semi-grey-1: 245,245,245;
38
- --semi-grey-2: 241,241,241;
39
- --semi-grey-3: 233,233,233;
40
- --semi-grey-4: 205,205,205;
41
- --semi-grey-5: 165,165,165;
42
- --semi-grey-6: 118,118,118;
43
- --semi-grey-7: 95,95,95;
44
- --semi-grey-8: 74,74,74;
45
- --semi-grey-9: 25,25,25;
36
+ --semi-grey-0: 248,248,248;
37
+ --semi-grey-1: 242,243,244;
38
+ --semi-grey-2: 194,195,196;
39
+ --semi-grey-3: 159,160,161;
40
+ --semi-grey-4: 124,125,127;
41
+ --semi-grey-5: 90,91,92;
42
+ --semi-grey-6: 68,70,72;
43
+ --semi-grey-7: 47,49,51;
44
+ --semi-grey-8: 27,29,31;
45
+ --semi-grey-9: 14,14,15;
46
46
  --semi-lime-0: 241,251,231;
47
47
  --semi-lime-1: 224,246,197;
48
48
  --semi-lime-2: 198,237,142;
@@ -103,16 +103,16 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
103
103
  --semi-brand-7: 0,67,184;
104
104
  --semi-brand-8: 0,60,150;
105
105
  --semi-brand-9: 0,31,77;
106
- --semi-green-0: 224,243,234;
107
- --semi-green-1: 185,231,210;
108
- --semi-green-2: 124,207,171;
109
- --semi-green-3: 73,183,137;
110
- --semi-green-4: 32,159,108;
111
- --semi-green-5: 0,135,83;
112
- --semi-green-6: 0,95,62;
113
- --semi-green-7: 0,66,44;
114
- --semi-green-8: 0,48,32;
115
- --semi-green-9: 0,38,26;
106
+ --semi-green-0: 226,245,236;
107
+ --semi-green-1: 188,236,214;
108
+ --semi-green-2: 130,216,178;
109
+ --semi-green-3: 79,197,147;
110
+ --semi-green-4: 35,177,120;
111
+ --semi-green-5: 0,158,97;
112
+ --semi-green-6: 0,132,83;
113
+ --semi-green-7: 0,105,68;
114
+ --semi-green-8: 0,79,52;
115
+ --semi-green-9: 0,53,36;
116
116
  --semi-white-0: 255,255,255;
117
117
  --semi-white-1: 255,255,255;
118
118
  --semi-white-2: 255,255,255;
@@ -133,16 +133,16 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
133
133
  --semi-indigo-7: 41,49,142;
134
134
  --semi-indigo-8: 32,37,122;
135
135
  --semi-indigo-9: 23,27,101;
136
- --semi-orange-0: 255,249,235;
137
- --semi-orange-1: 255,240,204;
138
- --semi-orange-2: 255,222,153;
139
- --semi-orange-3: 255,200,102;
140
- --semi-orange-4: 255,175,51;
141
- --semi-orange-5: 255,146,0;
142
- --semi-orange-6: 213,111,0;
143
- --semi-orange-7: 170,80,0;
144
- --semi-orange-8: 128,54,0;
145
- --semi-orange-9: 85,32,0;
136
+ --semi-orange-0: 255,250,235;
137
+ --semi-orange-1: 255,241,204;
138
+ --semi-orange-2: 255,223,153;
139
+ --semi-orange-3: 255,202,102;
140
+ --semi-orange-4: 255,178,51;
141
+ --semi-orange-5: 255,150,0;
142
+ --semi-orange-6: 213,114,0;
143
+ --semi-orange-7: 170,83,0;
144
+ --semi-orange-8: 128,56,0;
145
+ --semi-orange-9: 85,33,0;
146
146
  --semi-purple-0: 253,244,255;
147
147
  --semi-purple-1: 249,222,255;
148
148
  --semi-purple-2: 241,189,255;
@@ -173,16 +173,16 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
173
173
  --semi-yellow-7: 170,151,31;
174
174
  --semi-yellow-8: 128,115,22;
175
175
  --semi-yellow-9: 85,78,14;
176
- --semi-neutral-0: 242,243,244;
177
- --semi-neutral-1: 227,228,230;
178
- --semi-neutral-2: 201,203,207;
179
- --semi-neutral-3: 174,178,183;
180
- --semi-neutral-4: 146,151,158;
176
+ --semi-neutral-0: 243,243,243;
177
+ --semi-neutral-1: 226,228,231;
178
+ --semi-neutral-2: 198,202,207;
179
+ --semi-neutral-3: 171,176,183;
180
+ --semi-neutral-4: 145,151,159;
181
181
  --semi-neutral-5: 120,126,135;
182
- --semi-neutral-6: 84,88,95;
183
- --semi-neutral-7: 48,50,54;
184
- --semi-neutral-8: 34,35,38;
185
- --semi-neutral-9: 24,25,27;
182
+ --semi-neutral-6: 98,105,115;
183
+ --semi-neutral-7: 78,84,94;
184
+ --semi-neutral-8: 59,64,74;
185
+ --semi-neutral-9: 41,45,53;
186
186
  --semi-light-blue-0: 233,247,254;
187
187
  --semi-light-blue-1: 202,235,252;
188
188
  --semi-light-blue-2: 149,214,249;
@@ -207,8 +207,8 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
207
207
 
208
208
  body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
209
209
  --semi-black: 0, 0, 0;
210
- --semi-red-0: 51,0,0;
211
- --semi-red-1: 155,0,0;
210
+ --semi-red-0: 95,7,8;
211
+ --semi-red-1: 131,15,13;
212
212
  --semi-red-2: 182,0,0;
213
213
  --semi-red-3: 204,0,0;
214
214
  --semi-red-4: 230,0,35;
@@ -238,16 +238,16 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
238
238
  --semi-cyan-7: 154,234,243;
239
239
  --semi-cyan-8: 203,245,249;
240
240
  --semi-cyan-9: 234,251,252;
241
- --semi-grey-0: 25,25,25;
242
- --semi-grey-1: 34,34,34;
243
- --semi-grey-2: 74,74,74;
244
- --semi-grey-3: 95,95,95;
245
- --semi-grey-4: 118,118,118;
246
- --semi-grey-5: 165,165,165;
247
- --semi-grey-6: 205,205,205;
248
- --semi-grey-7: 233,233,233;
249
- --semi-grey-8: 241,241,241;
250
- --semi-grey-9: 245,245,245;
241
+ --semi-grey-0: 12,12,13;
242
+ --semi-grey-1: 31,32,33;
243
+ --semi-grey-2: 46,47,48;
244
+ --semi-grey-3: 65,66,69;
245
+ --semi-grey-4: 90,91,92;
246
+ --semi-grey-5: 127,128,129;
247
+ --semi-grey-6: 161,162,163;
248
+ --semi-grey-7: 195,196,197;
249
+ --semi-grey-8: 230,230,231;
250
+ --semi-grey-9: 248,248,248;
251
251
  --semi-lime-0: 44,70,0;
252
252
  --semi-lime-1: 67,105,0;
253
253
  --semi-lime-2: 92,141,0;
@@ -298,26 +298,26 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
298
298
  --semi-black-7: 135,136,155;
299
299
  --semi-black-8: 192,192,205;
300
300
  --semi-black-9: 227,227,230;
301
- --semi-brand-0: 0,31,77;
302
- --semi-brand-1: 0,61,153;
301
+ --semi-brand-0: 0,37,112;
302
+ --semi-brand-1: 0,52,148;
303
303
  --semi-brand-2: 0,67,184;
304
- --semi-brand-3: 0,94,235;
304
+ --semi-brand-3: 0,84,219;
305
305
  --semi-brand-4: 0,102,255;
306
306
  --semi-brand-5: 51,136,255;
307
- --semi-brand-6: 102,163,255;
308
- --semi-brand-7: 153,194,255;
309
- --semi-brand-8: 204,224,255;
310
- --semi-brand-9: 229,240,255;
311
- --semi-green-0: 0,38,26;
312
- --semi-green-1: 0,48,32;
313
- --semi-green-2: 0,66,44;
314
- --semi-green-3: 0,95,62;
315
- --semi-green-4: 0,135,83;
316
- --semi-green-5: 32,159,108;
317
- --semi-green-6: 73,183,137;
318
- --semi-green-7: 124,207,171;
319
- --semi-green-8: 185,231,210;
320
- --semi-green-9: 224,243,234;
307
+ --semi-brand-6: 102,168,255;
308
+ --semi-brand-7: 153,199,255;
309
+ --semi-brand-8: 204,228,255;
310
+ --semi-brand-9: 235,244,255;
311
+ --semi-green-0: 2,54,37;
312
+ --semi-green-1: 4,81,55;
313
+ --semi-green-2: 7,107,72;
314
+ --semi-green-3: 9,134,88;
315
+ --semi-green-4: 0,158,97;
316
+ --semi-green-5: 48,180,127;
317
+ --semi-green-6: 89,199,153;
318
+ --semi-green-7: 137,217,183;
319
+ --semi-green-8: 193,236,217;
320
+ --semi-green-9: 228,246,237;
321
321
  --semi-indigo-0: 23,27,101;
322
322
  --semi-indigo-1: 32,37,122;
323
323
  --semi-indigo-2: 41,49,142;
@@ -328,16 +328,16 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
328
328
  --semi-indigo-7: 167,177,226;
329
329
  --semi-indigo-8: 209,215,241;
330
330
  --semi-indigo-9: 237,239,248;
331
- --semi-orange-0: 77,43,0;
332
- --semi-orange-1: 128,73,0;
333
- --semi-orange-2: 178,101,0;
334
- --semi-orange-3: 229,130,0;
335
- --semi-orange-4: 255,146,0;
336
- --semi-orange-5: 255,167,51;
337
- --semi-orange-6: 255,189,102;
338
- --semi-orange-7: 255,211,153;
339
- --semi-orange-8: 255,233,204;
340
- --semi-orange-9: 255,244,229;
331
+ --semi-orange-0: 85,35,3;
332
+ --semi-orange-1: 128,59,6;
333
+ --semi-orange-2: 170,88,10;
334
+ --semi-orange-3: 213,121,15;
335
+ --semi-orange-4: 255,150,0;
336
+ --semi-orange-5: 255,184,67;
337
+ --semi-orange-6: 255,206,114;
338
+ --semi-orange-7: 255,226,161;
339
+ --semi-orange-8: 255,242,208;
340
+ --semi-orange-9: 255,250,237;
341
341
  --semi-purple-0: 76,31,112;
342
342
  --semi-purple-1: 106,46,148;
343
343
  --semi-purple-2: 138,62,184;
@@ -368,9 +368,9 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
368
368
  --semi-yellow-7: 255,250,180;
369
369
  --semi-yellow-8: 255,254,217;
370
370
  --semi-yellow-9: 255,255,241;
371
- --semi-neutral-0: 24,25,27;
371
+ --semi-neutral-0: 26,28,30;
372
372
  --semi-neutral-1: 34,35,38;
373
- --semi-neutral-2: 48,50,54;
373
+ --semi-neutral-2: 48,51,54;
374
374
  --semi-neutral-3: 84,88,95;
375
375
  --semi-neutral-4: 120,126,135;
376
376
  --semi-neutral-5: 146,151,158;
@@ -401,15 +401,15 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
401
401
  }
402
402
 
403
403
  body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light {
404
- --semi-color-app: rgba(var(--semi-neutral-0),1);
405
- --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
404
+ --semi-color-app: rgba(var(--semi-grey-1),1);
405
+ --semi-color-bg-0: rgba(var(--semi-grey-0),1);
406
406
  --semi-color-bg-1: rgba(255,255,255,1);
407
407
  --semi-color-bg-2: rgba(255,255,255,1);
408
408
  --semi-color-bg-3: rgba(255,255,255,1);
409
409
  --semi-color-bg-4: rgba(255,255,255,1);
410
- --semi-color-info: rgba(var(--semi-brand-5),1);
410
+ --semi-color-info: rgba(var(--semi-brand-5), 1);
411
411
  --semi-color-link: rgba(var(--semi-brand-5),1);
412
- --semi-color-bg-anti: rgba(var(--semi-neutral-9), 1);
412
+ --semi-color-bg-anti: rgba(var(--semi-grey-9), 1);
413
413
  --semi-color-nav-bg: rgba(var(--semi-grey-0), 1);
414
414
  --semi-color-black: rgba(0,0,0,1);
415
415
  --semi-color-data-0: rgba(0,102,255,1);
@@ -422,16 +422,16 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
422
422
  --semi-color-data-7: rgba(0,179,178,1);
423
423
  --semi-color-data-8: rgba(0,135,83,1);
424
424
  --semi-color-data-9: rgba(230,155,255,1);
425
- --semi-color-fill-0: rgba(var(--semi-grey-5),0.08);
426
- --semi-color-fill-1: rgba(var(--semi-grey-5),0.12);
427
- --semi-color-fill-2: rgba(var(--semi-grey-5),0.16);
428
- --semi-color-fill-3: rgba(var(--semi-grey-5),0.32);
429
- --semi-color-text-0: rgba(var(--semi-neutral-9),1);
430
- --semi-color-text-1: rgba(var(--semi-neutral-9),0.75);
431
- --semi-color-text-2: rgba(var(--semi-neutral-9),0.5);
432
- --semi-color-text-3: rgba(var(--semi-neutral-9),0.25);
425
+ --semi-color-fill-0: rgba(var(--semi-grey-9),0.04);
426
+ --semi-color-fill-1: rgba(var(--semi-grey-9),0.06);
427
+ --semi-color-fill-2: rgba(var(--semi-grey-9),0.12);
428
+ --semi-color-fill-3: rgba(var(--semi-grey-9),0.2);
429
+ --semi-color-text-0: rgba(var(--semi-grey-9), 1);
430
+ --semi-color-text-1: rgba(var(--semi-grey-9),0.75);
431
+ --semi-color-text-2: rgba(var(--semi-grey-9),0.5);
432
+ --semi-color-text-3: rgba(var(--semi-grey-9),0.25);
433
433
  --semi-color-white: rgba(255,255,255,1);
434
- --semi-color-bg-avatar: rgba(var(--semi-grey-5),0.16);
434
+ --semi-color-bg-avatar: rgba(var(--semi-grey-5), 0.16);
435
435
  --semi-color-data-10: rgba(48,167,206,1);
436
436
  --semi-color-data-11: rgba(249, 192, 100, 1);
437
437
  --semi-color-data-12: rgba(177, 113, 249, 1);
@@ -443,11 +443,11 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
443
443
  --semi-color-data-18: rgba(212,88,212,1);
444
444
  --semi-color-data-19: rgba(188, 198, 255, 1);
445
445
  --semi-color-data-20: rgba(121,137,255, 1);
446
- --semi-color-border: rgba(var(--semi-grey-6),0.16);
446
+ --semi-color-border: rgba(var(--semi-grey-9),0.12);
447
447
  --semi-color-danger: rgba(var(--semi-red-5),1);
448
448
  --semi-color-shadow: rgba(var(--semi-grey-9), 0.05);
449
- --semi-color-text-nav: rgba(var(--semi-neutral-9), 0.75);
450
- --semi-color-app-header: rgba(var(--semi-neutral-0),0);
449
+ --semi-color-text-nav: rgba(var(--semi-grey-9),0.75);
450
+ --semi-color-app-header: rgba(var(--semi-grey-1),0);
451
451
  --semi-color-bg-dropdown: rgba(255,255,255,1);
452
452
  --semi-color-black-10: rgba(0,0,0,0.1);
453
453
  --semi-color-black-20: rgba(0,0,0,0.2);
@@ -472,99 +472,99 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
472
472
  --semi-color-info-hover: rgba(var(--semi-brand-6), 1);
473
473
  --semi-color-link-hover: rgba(var(--semi-brand-6), 1);
474
474
  --semi-color-primary: rgba(var(--semi-brand-5),1);
475
- --semi-color-success: rgba(var(--semi-green-4),1);
475
+ --semi-color-success: rgba(var(--semi-green-5), 1);
476
476
  --semi-color-tab-HoverBg: rgba(var(--semi-grey-5),0.16);
477
477
  --semi-color-warning: rgba(var(--semi-amber-5), 1);
478
- --semi-color-app-siderbar: rgba(var(--semi-neutral-0),0);
479
- --semi-color-card-border: rgba(var(--semi-grey-6),0.16);
478
+ --semi-color-app-siderbar: rgba(var(--semi-grey-1),0);
479
+ --semi-color-card-border: rgba(var(--semi-grey-9),0.12);
480
480
  --semi-color-info-active: rgba(var(--semi-brand-7), 1);
481
481
  --semi-color-link-active: rgba(var(--semi-brand-7),1);
482
482
  --semi-color-app-container: rgba(255,255,255,1);
483
483
  --semi-color-bg-transparent: rgba(255,255,255,0);
484
- --semi-color-card-HoverBg: rgba(var(--semi-grey-5),0.12);
485
- --semi-color-divider-0: rgba(var(--semi-grey-8),0.22);
486
- --semi-color-divider-1: rgba(var(--semi-grey-8),0.16);
487
- --semi-color-divider-2: rgba(var(--semi-grey-8),0.08);
484
+ --semi-color-card-HoverBg: rgba(var(--semi-grey-9),0.06);
485
+ --semi-color-divider-0: rgba(var(--semi-grey-9),0.2);
486
+ --semi-color-divider-1: rgba(var(--semi-grey-9),0.12);
487
+ --semi-color-divider-2: rgba(var(--semi-grey-9),0.06);
488
488
  --semi-color-link-visited: rgba(var(--semi-brand-7),1);
489
489
  --semi-color-photo-toast: rgba(0,0,0,0.9);
490
490
  --semi-color-tab-DefaultBg: rgba(var(--semi-grey-5),0.05);
491
- --semi-color-tertiary: rgba(var(--semi-neutral-6), 1);
491
+ --semi-color-tertiary: rgba(var(--semi-grey-6), 1);
492
492
  --semi-color-card-ActiveBg: rgba(var(--semi-brand-5),0.12);
493
493
  --semi-color-focus-border: rgba(var(--semi-brand-5),1);
494
- --semi-color-info-disabled: rgba(var(--semi-grey-5),0.16);
494
+ --semi-color-info-disabled: rgba(var(--semi-brand-1),0.16);
495
495
  --semi-color-overlay-bg: rgba(0,0,0,0.7);
496
496
  --semi-color-tab-DisabledBg: rgba(var(--semi-grey-5),0.16);
497
497
  --semi-color-tab-SelectedBg: rgba(var(--semi-grey-9),1);
498
498
  --semi-color-Scrollbar: rgba(var(--semi-grey-5),0.16);
499
- --semi-color-border-hover: rgba(var(--semi-grey-6),0.22);
500
- --semi-color-border-modal: rgba(var(--semi-grey-6),0.08);
501
- --semi-color-card-DefaultBg: rgba(var(--semi-grey-5),0.08);
499
+ --semi-color-border-hover: rgba(var(--semi-grey-9),0.2);
500
+ --semi-color-border-modal: rgba(var(--semi-grey-9),0.06);
501
+ --semi-color-card-DefaultBg: rgba(var(--semi-grey-9),0.04);
502
502
  --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
503
503
  --semi-color-highlight: rgba(var(--semi-grey-9), 1);
504
504
  --semi-color-input-HoverBg: rgba(255,255,255,1);
505
505
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
506
506
  --semi-color-table-FocusBg: rgba(var(--semi-brand-5),0.2);
507
507
  --semi-color-table-HoverBg: rgba(var(--semi-grey-5),0.08);
508
- --semi-color-border-active: rgba(var(--semi-grey-6),0.32);
509
- --semi-color-border-select: rgba(var(--semi-grey-6),0);
508
+ --semi-color-border-active: rgba(var(--semi-grey-9),0.24);
509
+ --semi-color-border-select: rgba(var(--semi-grey-9),0.06);
510
510
  --semi-color-danger-active: rgba(var(--semi-red-7), 1);
511
- --semi-color-disabled-bg: rgba(var(--semi-grey-5),0.16);
511
+ --semi-color-disabled-bg: rgba(var(--semi-grey-1),1);
512
512
  --semi-color-input-ActiveBg: rgba(255,255,255,1);
513
513
  --semi-color-table-ActiveBg: rgba(var(--semi-brand-5),0.12);
514
- --semi-color-card-borderHover: rgba(var(--semi-grey-8),0.22);
514
+ --semi-color-card-borderHover: rgba(var(--semi-grey-8),0.12);
515
515
  --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
516
516
  --semi-color-input-DefaultBg: rgba(255,255,255,1);
517
517
  --semi-color-photo-toastText: rgba(255,255,255,1);
518
518
  --semi-color-primary-hover: rgba(var(--semi-brand-6), 1);
519
- --semi-color-success-hover: rgba(var(--semi-green-5),1);
519
+ --semi-color-success-hover: rgba(var(--semi-green-6), 1);
520
520
  --semi-color-warning-hover: rgba(var(--semi-amber-6), 1);
521
521
  --semi-color-Component-bg: rgba(255,255,255,0.5);
522
522
  --semi-color-card-borderActive: rgba(var(--semi-brand-5),1);
523
523
  --semi-color-default-active: rgba(var(--semi-grey-2), 1);
524
- --semi-color-disabled-fill: rgba(var(--semi-grey-5), 0.16);
525
- --semi-color-disabled-text: rgba(var(--semi-grey-9), 0.25);
524
+ --semi-color-disabled-fill: rgba(var(--semi-grey-9),0.04);
525
+ --semi-color-disabled-text: rgba(var(--semi-grey-9),0.25);
526
526
  --semi-color-highlight-bg: rgba(var(--semi-yellow-5),1);
527
527
  --semi-color-input-DisabledBg: rgba(var(--semi-grey-5),0.16);
528
528
  --semi-color-primary-active: rgba(var(--semi-brand-7), 1);
529
- --semi-color-success-active: rgba(var(--semi-green-6),1);
529
+ --semi-color-success-active: rgba(var(--semi-green-7), 1);
530
530
  --semi-color-warning-active: rgba(var(--semi-amber-7), 1);
531
- --semi-color-tertiary-hover: rgba(var(--semi-neutral-7), 1);
531
+ --semi-color-tertiary-hover: rgba(var(--semi-grey-7), 1);
532
532
  --semi-color-Component-card: rgba(255,255,255,0.9);
533
- --semi-color-disabled-border: rgba(var(--semi-grey-8), 0.16);
533
+ --semi-color-disabled-border: rgba(var(--semi-grey-9),0.12);
534
534
  --semi-color-primary-disabled: rgba(var(--semi-grey-5),0.16);
535
- --semi-color-success-disabled: rgba(var(--semi-grey-5),0.16);
536
- --semi-color-tertiary-active: rgba(var(--semi-neutral-8), 1);
535
+ --semi-color-success-disabled: rgba(var(--semi-green-1),0.16);
536
+ --semi-color-tertiary-active: rgba(var(--semi-grey-8), 1);
537
537
  --semi-color-Scrollbar-hover: rgba(var(--semi-grey-5),0.32);
538
538
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
539
539
  --semi-color-overlay-CustomAnti: rgba(255,255,255,0.7);
540
540
  --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
541
- --semi-color-info-light-hover: rgba(var(--semi-brand-1),1);
541
+ --semi-color-info-light-hover: rgba(var(--semi-brand-2),0.3);
542
542
  --semi-color-progress-defaultBg: rgba(var(--semi-grey-5),0.16);
543
543
  --semi-color-fndesktop-navbarBg: rgba(134,164,179,0.05);
544
- --semi-color-info-light-active: rgba(var(--semi-brand-2),1);
544
+ --semi-color-info-light-active: rgba(var(--semi-brand-2),0.4);
545
545
  --semi-color-secondary-disabled: rgba(var(--semi-grey-5),0.16);
546
- --semi-color-info-light-default: rgba(var(--semi-brand-0),1);
546
+ --semi-color-info-light-default: rgba(var(--semi-brand-2),0.2);
547
547
  --semi-color-overlay-CustomPreview: rgba(0,0,0,0.9);
548
- --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
549
- --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
548
+ --semi-color-danger-light-hover: rgba(var(--semi-red-2),0.3);
549
+ --semi-color-danger-light-active: rgba(var(--semi-red-2),0.4);
550
550
  --semi-color-fndesktop-navbarBorder: rgba(255,255,255,0.2);
551
- --semi-color-danger-light-default: rgba(var(--semi-red-0),1);
552
- --semi-color-primary-light-hover: rgba(var(--semi-brand-1),1);
553
- --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
554
- --semi-color-warning-light-hover: rgba(var(--semi-amber-1), 1);
555
- --semi-color-primary-light-active: rgba(var(--semi-brand-2),1);
556
- --semi-color-success-light-active: rgba(var(--semi-green-2),1);
557
- --semi-color-warning-light-active: rgba(var(--semi-amber-2), 1);
558
- --semi-color-primary-light-default: rgba(var(--semi-brand-0),1);
559
- --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
560
- --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.16);
561
- --semi-color-warning-light-default: rgba(var(--semi-amber-0), 1);
562
- --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.32);
551
+ --semi-color-danger-light-default: rgba(var(--semi-red-2),0.2);
552
+ --semi-color-primary-light-hover: rgba(var(--semi-brand-2),0.3);
553
+ --semi-color-success-light-hover: rgba(var(--semi-green-3),0.3);
554
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-3),0.3);
555
+ --semi-color-primary-light-active: rgba(var(--semi-brand-2),0.4);
556
+ --semi-color-success-light-active: rgba(var(--semi-green-3),0.4);
557
+ --semi-color-warning-light-active: rgba(var(--semi-orange-3),0.4);
558
+ --semi-color-primary-light-default: rgba(var(--semi-brand-2),0.2);
559
+ --semi-color-success-light-default: rgba(var(--semi-green-3),0.2);
560
+ --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.3);
561
+ --semi-color-warning-light-default: rgba(var(--semi-orange-3),0.2);
562
+ --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.4);
563
563
  --semi-color-CheckboxPhoto-DefaultBg: rgba(255,255,255,0.2);
564
- --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
565
- --semi-color-tertiary-light-default: rgba(var(--semi-grey-5),0.12);
566
- --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
567
- --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
564
+ --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5),0.3);
565
+ --semi-color-tertiary-light-default: rgba(var(--semi-grey-5),0.2);
566
+ --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5),0.4);
567
+ --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5),0.2);
568
568
  --semi-color-CheckboxPhoto-DefaultBorder: rgba(255,255,255,1);
569
569
  --semi-color-CheckboxPhoto-DefaultBgHover: rgba(255,255,255,0.7);
570
570
  --semi-color-CheckboxPhoto-DefaultBorderHover: rgba(255,255,255,0);
@@ -594,12 +594,12 @@ body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light
594
594
 
595
595
  body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
596
596
  --semi-color-app: rgba(var(--semi-grey-0),1);
597
- --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
598
- --semi-color-bg-1: rgba(var(--semi-neutral-1), 1);
599
- --semi-color-bg-2: rgba(var(--semi-neutral-1), 1);
600
- --semi-color-bg-3: rgba(var(--semi-neutral-2), 1);
601
- --semi-color-bg-4: rgba(var(--semi-neutral-2), 1);
602
- --semi-color-info: rgba(var(--semi-brand-4),1);
597
+ --semi-color-bg-0: rgba(var(--semi-grey-0), 1);
598
+ --semi-color-bg-1: rgba(var(--semi-grey-1), 1);
599
+ --semi-color-bg-2: rgba(var(--semi-grey-1),1);
600
+ --semi-color-bg-3: rgba(var(--semi-grey-2),1);
601
+ --semi-color-bg-4: rgba(var(--semi-grey-3),1);
602
+ --semi-color-info: rgba(var(--semi-brand-4), 1);
603
603
  --semi-color-link: rgba(var(--semi-brand-4),1);
604
604
  --semi-color-bg-anti: rgba(255,255,255,1);
605
605
  --semi-color-nav-bg: rgba(var(--semi-grey-2), 1);
@@ -614,16 +614,16 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
614
614
  --semi-color-data-7: rgba(0,179,178,1);
615
615
  --semi-color-data-8: rgba(0,135,83,1);
616
616
  --semi-color-data-9: rgba(233,165,229,1);
617
- --semi-color-fill-0: rgba(var(--semi-grey-5),0.05);
618
- --semi-color-fill-1: rgba(var(--semi-grey-5),0.08);
619
- --semi-color-fill-2: rgba(var(--semi-grey-5),0.16);
620
- --semi-color-fill-3: rgba(var(--semi-grey-5),0.32);
617
+ --semi-color-fill-0: rgba(255,255,255,0.04);
618
+ --semi-color-fill-1: rgba(255,255,255,0.06);
619
+ --semi-color-fill-2: rgba(255,255,255,0.12);
620
+ --semi-color-fill-3: rgba(255,255,255,0.2);
621
621
  --semi-color-text-0: rgba(255,255,255,1);
622
- --semi-color-text-1: rgba(var(--semi-neutral-9),0.75);
623
- --semi-color-text-2: rgba(var(--semi-neutral-9),0.5);
624
- --semi-color-text-3: rgba(var(--semi-neutral-9),0.25);
622
+ --semi-color-text-1: rgba(var(--semi-neutral-9),0.8);
623
+ --semi-color-text-2: rgba(var(--semi-neutral-9),0.6);
624
+ --semi-color-text-3: rgba(var(--semi-neutral-9),0.35);
625
625
  --semi-color-white: rgba(255,255,255,1);
626
- --semi-color-bg-avatar: rgba(var(--semi-neutral-5),0.16);
626
+ --semi-color-bg-avatar: rgba(255,255,255,0.06);
627
627
  --semi-color-data-10: rgba(48,167,206,1);
628
628
  --semi-color-data-11: rgba(249,192,100,1);
629
629
  --semi-color-data-12: rgba(177,113,249,1);
@@ -635,12 +635,12 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
635
635
  --semi-color-data-18: rgba(212,88,212,1);
636
636
  --semi-color-data-19: rgba(188,198,255,1);
637
637
  --semi-color-data-20: rgba(121,137,255,1);
638
- --semi-color-border: rgba(var(--semi-grey-5),0.16);
638
+ --semi-color-border: rgba(255,255,255,0.12);
639
639
  --semi-color-danger: rgba(var(--semi-red-4),1);
640
640
  --semi-color-shadow: rgba(var(--semi-grey-0), 0.8);
641
- --semi-color-text-nav: rgba(var(--semi-neutral-9),0.75);
641
+ --semi-color-text-nav: rgba(var(--semi-neutral-9),0.8);
642
642
  --semi-color-app-header: rgba(var(--semi-grey-0),0);
643
- --semi-color-bg-dropdown: rgba(var(--semi-neutral-2), 1);
643
+ --semi-color-bg-dropdown: rgba(var(--semi-grey-2),1);
644
644
  --semi-color-black-10: rgba(0,0,0,0.1);
645
645
  --semi-color-black-20: rgba(0,0,0,0.2);
646
646
  --semi-color-black-30: rgba(0,0,0,0.3);
@@ -650,7 +650,7 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
650
650
  --semi-color-black-70: rgba(0,0,0,0.7);
651
651
  --semi-color-black-80: rgba(0,0,0,0.8);
652
652
  --semi-color-black-90: rgba(0,0,0,0.9);
653
- --semi-color-text-anti: rgba(var(--semi-neutral-0),1);
653
+ --semi-color-text-anti: rgba(var(--semi-grey-0),1);
654
654
  --semi-color-white-10: rgba(255,255,255,0.1);
655
655
  --semi-color-white-20: rgba(255,255,255,0.2);
656
656
  --semi-color-white-30: rgba(255,255,255,0.3);
@@ -661,97 +661,97 @@ body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .
661
661
  --semi-color-white-80: rgba(255,255,255,0.8);
662
662
  --semi-color-white-90: rgba(255,255,255,0.9);
663
663
  --semi-color-default: rgba(var(--semi-grey-0), 1);
664
- --semi-color-info-hover: rgba(var(--semi-brand-3),1);
664
+ --semi-color-info-hover: rgba(var(--semi-brand-3), 1);
665
665
  --semi-color-link-hover: rgba(var(--semi-brand-3),1);
666
666
  --semi-color-primary: rgba(var(--semi-brand-4),1);
667
- --semi-color-success: rgba(var(--semi-green-5),1);
667
+ --semi-color-success: rgba(var(--semi-green-4),1);
668
668
  --semi-color-tab-HoverBg: rgba(var(--semi-grey-2), 1);
669
- --semi-color-warning: rgba(var(--semi-amber-4),1);
670
- --semi-color-app-siderbar: rgba(var(--semi-grey-0), 0);
671
- --semi-color-card-border: rgba(var(--semi-grey-5),0.16);
672
- --semi-color-info-active: rgba(var(--semi-brand-2),1);
669
+ --semi-color-warning: rgba(var(--semi-orange-4),1);
670
+ --semi-color-app-siderbar: rgba(var(--semi-grey-0),0);
671
+ --semi-color-card-border: rgba(255,255,255,0.12);
672
+ --semi-color-info-active: rgba(var(--semi-brand-2), 1);
673
673
  --semi-color-link-active: rgba(var(--semi-brand-2),1);
674
- --semi-color-app-container: rgba(var(--semi-grey-1), 1);
675
- --semi-color-bg-transparent: rgba(var(--semi-neutral-0), 0);
676
- --semi-color-card-HoverBg: rgba(var(--semi-grey-5),0.08);
677
- --semi-color-divider-0: rgba(var(--semi-grey-5),0.22);
678
- --semi-color-divider-1: rgba(var(--semi-grey-5),0.16);
679
- --semi-color-divider-2: rgba(var(--semi-grey-5),0.08);
674
+ --semi-color-app-container: rgba(var(--semi-grey-1),1);
675
+ --semi-color-bg-transparent: rgba(var(--semi-grey-0),0);
676
+ --semi-color-card-HoverBg: rgba(255,255,255,0.06);
677
+ --semi-color-divider-0: rgba(255,255,255,0.2);
678
+ --semi-color-divider-1: rgba(255,255,255,0.12);
679
+ --semi-color-divider-2: rgba(255,255,255,0.08);
680
680
  --semi-color-link-visited: rgba(var(--semi-brand-2),1);
681
681
  --semi-color-photo-toast: rgba(0,0,0,0.9);
682
682
  --semi-color-tab-DefaultBg: rgba(var(--semi-grey-1),1);
683
- --semi-color-tertiary: rgba(var(--semi-grey-5),0.08);
684
- --semi-color-card-ActiveBg: rgba(var(--semi-brand-4),0.12);
683
+ --semi-color-tertiary: rgba(255,255,255,0.08);
684
+ --semi-color-card-ActiveBg: rgba(var(--semi-brand-4),0.2);
685
685
  --semi-color-focus-border: rgba(var(--semi-brand-4),1);
686
- --semi-color-info-disabled: rgba(var(--semi-grey-5),0.16);
686
+ --semi-color-info-disabled: rgba(var(--semi-brand-1),0.16);
687
687
  --semi-color-overlay-bg: rgba(0,0,0,0.6);
688
688
  --semi-color-shadow-anti: rgba(0,0,0,0.7);
689
689
  --semi-color-tab-DisabledBg: rgba(var(--semi-grey-2), 1);
690
690
  --semi-color-tab-SelectedBg: rgba(var(--semi-grey-9), 1);
691
- --semi-color-Scrollbar: rgba(var(--semi-grey-5),0.16);
692
- --semi-color-border-hover: rgba(var(--semi-grey-5),0.22);
693
- --semi-color-border-modal: rgba(var(--semi-grey-5),0.16);
694
- --semi-color-card-DefaultBg: rgba(var(--semi-grey-5),0.05);
691
+ --semi-color-Scrollbar: rgba(255,255,255,0.12);
692
+ --semi-color-border-hover: rgba(255,255,255,0.2);
693
+ --semi-color-border-modal: rgba(255,255,255,0.12);
694
+ --semi-color-card-DefaultBg: rgba(255,255,255,0.05);
695
695
  --semi-color-danger-hover: rgba(var(--semi-red-3),1);
696
696
  --semi-color-highlight: rgba(var(--semi-white),1);
697
- --semi-color-input-HoverBg: rgba(var(--semi-neutral-1),1);
697
+ --semi-color-input-HoverBg: rgba(var(--semi-grey-1), 1);
698
698
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
699
699
  --semi-color-table-FocusBg: rgba(var(--semi-brand-4),0.2);
700
700
  --semi-color-table-HoverBg: rgba(var(--semi-grey-5),0.08);
701
- --semi-color-border-active: rgba(var(--semi-grey-5),0.32);
702
- --semi-color-border-select: rgba(var(--semi-grey-5),0.16);
701
+ --semi-color-border-active: rgba(255,255,255,0.24);
702
+ --semi-color-border-select: rgba(255,255,255,0.12);
703
703
  --semi-color-danger-active: rgba(var(--semi-red-2),1);
704
- --semi-color-disabled-bg: rgba(var(--semi-grey-5),0.16);
705
- --semi-color-input-ActiveBg: rgba(var(--semi-neutral-1),1);
704
+ --semi-color-disabled-bg: rgba(var(--semi-grey-2), 1);
705
+ --semi-color-input-ActiveBg: rgba(var(--semi-grey-0),1);
706
706
  --semi-color-table-ActiveBg: rgba(var(--semi-brand-4),0.12);
707
- --semi-color-card-borderHover: rgba(var(--semi-grey-5),0.22);
707
+ --semi-color-card-borderHover: rgba(255,255,255,0.22);
708
708
  --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
709
- --semi-color-input-DefaultBg: rgba(var(--semi-neutral-1),1);
709
+ --semi-color-input-DefaultBg: rgba(var(--semi-grey-1), 1);
710
710
  --semi-color-photo-toastText: rgba(255,255,255,1);
711
711
  --semi-color-primary-hover: rgba(var(--semi-brand-3),1);
712
- --semi-color-success-hover: rgba(var(--semi-green-4),1);
713
- --semi-color-warning-hover: rgba(var(--semi-amber-3),1);
712
+ --semi-color-success-hover: rgba(var(--semi-green-3),1);
713
+ --semi-color-warning-hover: rgba(var(--semi-orange-3),1);
714
714
  --semi-color-Component-bg: rgba(0,0,0,0.6);
715
715
  --semi-color-card-borderActive: rgba(var(--semi-brand-4),1);
716
716
  --semi-color-default-active: rgba(var(--semi-grey-2), 1);
717
- --semi-color-disabled-fill: rgba(var(--semi-neutral-5), 0.16);
718
- --semi-color-disabled-text: rgba(var(--semi-neutral-9),0.25);
717
+ --semi-color-disabled-fill: rgba(var(--semi-grey-8),0.04);
718
+ --semi-color-disabled-text: rgba(255,255,255,0.35);
719
719
  --semi-color-highlight-bg: rgba(var(--semi-yellow-4),1);
720
- --semi-color-input-DisabledBg: rgba(var(--semi-neutral-5),0.16);
720
+ --semi-color-input-DisabledBg: rgba(var(--semi-grey-2),1);
721
721
  --semi-color-primary-active: rgba(var(--semi-brand-2),1);
722
- --semi-color-success-active: rgba(var(--semi-green-3),1);
723
- --semi-color-warning-active: rgba(var(--semi-amber-2),1);
724
- --semi-color-tertiary-hover: rgba(var(--semi-grey-7),0.16);
722
+ --semi-color-success-active: rgba(var(--semi-green-2),1);
723
+ --semi-color-warning-active: rgba(var(--semi-orange-2),1);
724
+ --semi-color-tertiary-hover: rgba(255,255,255,0.16);
725
725
  --semi-color-Component-card: rgba(12,13,13,0.6);
726
- --semi-color-disabled-border: rgba(var(--semi-grey-5),0.16);
726
+ --semi-color-disabled-border: rgba(255,255,255,0.12);
727
727
  --semi-color-primary-disabled: rgba(var(--semi-grey-5),0.16);
728
- --semi-color-success-disabled: rgba(var(--semi-grey-5),0.16);
729
- --semi-color-tertiary-active: rgba(var(--semi-grey-8),0.22);
730
- --semi-color-Scrollbar-hover: rgba(var(--semi-grey-5),0.32);
728
+ --semi-color-success-disabled: rgba(var(--semi-green-1),0.16);
729
+ --semi-color-tertiary-active: rgba(255,255,255,0.24);
730
+ --semi-color-Scrollbar-hover: rgba(255,255,255,0.2);
731
731
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
732
732
  --semi-color-overlay-CustomAnti: rgba(0,0,0,0.6);
733
733
  --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
734
734
  --semi-color-info-light-hover: rgba(var(--semi-brand-1),1);
735
- --semi-color-progress-defaultBg: rgba(var(--semi-grey-5),0.16);
735
+ --semi-color-progress-defaultBg: rgba(255,255,255,0.12);
736
736
  --semi-color-fndesktop-navbarBg: rgba(12,13,13,0.6);
737
737
  --semi-color-info-light-active: rgba(var(--semi-brand-2),1);
738
738
  --semi-color-secondary-disabled: rgba(var(--semi-grey-5),0.16);
739
739
  --semi-color-info-light-default: rgba(var(--semi-brand-0),1);
740
740
  --semi-color-overlay-CustomPreview: rgba(0,0,0,0.9);
741
- --semi-color-danger-light-hover: rgba(var(--semi-red-1),1);
742
- --semi-color-danger-light-active: rgba(var(--semi-red-2),1);
741
+ --semi-color-danger-light-hover: rgba(var(--semi-red-0),0.3);
742
+ --semi-color-danger-light-active: rgba(var(--semi-red-0),0.4);
743
743
  --semi-color-fndesktop-navbarBorder: rgba(255,255,255,0.05);
744
- --semi-color-danger-light-default: rgba(var(--semi-red-0),1);
745
- --semi-color-primary-light-hover: rgba(var(--semi-brand-1),1);
746
- --semi-color-success-light-hover: rgba(var(--semi-green-1),1);
747
- --semi-color-warning-light-hover: rgba(var(--semi-amber-1), 1);
748
- --semi-color-primary-light-active: rgba(var(--semi-brand-2),1);
749
- --semi-color-success-light-active: rgba(var(--semi-green-2),1);
750
- --semi-color-warning-light-active: rgba(var(--semi-amber-2), 1);
751
- --semi-color-primary-light-default: rgba(var(--semi-brand-0),1);
752
- --semi-color-success-light-default: rgba(var(--semi-green-0),1);
744
+ --semi-color-danger-light-default: rgba(var(--semi-red-0),0.2);
745
+ --semi-color-primary-light-hover: rgba(var(--semi-brand-1),0.3);
746
+ --semi-color-success-light-hover: rgba(var(--semi-green-1),0.3);
747
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-5),0.3);
748
+ --semi-color-primary-light-active: rgba(var(--semi-brand-5),0.4);
749
+ --semi-color-success-light-active: rgba(var(--semi-green-5),0.4);
750
+ --semi-color-warning-light-active: rgba(var(--semi-orange-5),0.4);
751
+ --semi-color-primary-light-default: rgba(var(--semi-brand-5),0.2);
752
+ --semi-color-success-light-default: rgba(var(--semi-green-5),0.2);
753
753
  --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.16);
754
- --semi-color-warning-light-default: rgba(var(--semi-amber-0), 1);
754
+ --semi-color-warning-light-default: rgba(var(--semi-orange-5),0.2);
755
755
  --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.32);
756
756
  --semi-color-CheckboxPhoto-DefaultBg: rgba(255,255,255,0.2);
757
757
  --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1),1);
@@ -3752,17 +3752,17 @@ body, :host {
3752
3752
  background-color: var(--semi-color-fill-1);
3753
3753
  }
3754
3754
  .semi-button-light {
3755
- background-color: var(--semi-color-tertiary-light-default);
3755
+ background-color: var(--semi-color-fill-1);
3756
3756
  border: 1px transparent solid;
3757
3757
  transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
3758
3758
  transform: scale(var(--semi-transform_scale-none));
3759
3759
  }
3760
3760
  .semi-button-light:not(.semi-button-disabled):hover {
3761
- background-color: var(--semi-color-tertiary-light-hover);
3761
+ background-color: var(--semi-color-fill-2);
3762
3762
  border: 1px var(--semi-color-bg-transparent) solid;
3763
3763
  }
3764
3764
  .semi-button-light:not(.semi-button-disabled):active {
3765
- background-color: var(--semi-color-tertiary-light-active);
3765
+ background-color: var(--semi-color-fill-3);
3766
3766
  border: 1px var(--semi-color-bg-transparent) solid;
3767
3767
  }
3768
3768
  .semi-button-size-small {
@@ -3862,7 +3862,7 @@ body, :host {
3862
3862
  background-color: var(--semi-color-disabled-bg);
3863
3863
  }
3864
3864
  .semi-button-group-line-light {
3865
- background-color: var(--semi-color-tertiary-light-default);
3865
+ background-color: var(--semi-color-fill-1);
3866
3866
  }
3867
3867
  .semi-button-group-line-borderless {
3868
3868
  background-color: transparent;
@@ -6173,9 +6173,9 @@ body, :host {
6173
6173
  width: 16px;
6174
6174
  height: 16px;
6175
6175
  margin: 0;
6176
- background: var(--semi-color-bg-1);
6176
+ background: var(--semi-color-bg-transparent);
6177
6177
  transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
6178
- box-shadow: inset 0 0 0 1px var(--semi-color-border);
6178
+ box-shadow: inset 0 0 0 1px var(--semi-color-text-3);
6179
6179
  border-radius: 4px;
6180
6180
  }
6181
6181
  .semi-checkbox-inner-display .semi-icon {
@@ -6183,7 +6183,7 @@ body, :host {
6183
6183
  }
6184
6184
  .semi-checkbox-inner-checked .semi-checkbox-inner-display {
6185
6185
  background: var(--semi-color-primary);
6186
- color: var(--semi-color-bg-1);
6186
+ color: var(--semi-color-white);
6187
6187
  box-shadow: inset 0 0 0 1px var(--semi-color-primary);
6188
6188
  border-radius: 4px;
6189
6189
  }
@@ -6196,15 +6196,15 @@ body, :host {
6196
6196
  .semi-checkbox:hover.semi-checkbox-indeterminate .semi-checkbox-inner-display {
6197
6197
  background: var(--semi-color-primary-hover);
6198
6198
  box-shadow: none;
6199
- color: var(--semi-color-bg-1);
6199
+ color: var(--semi-color-white);
6200
6200
  }
6201
6201
  .semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
6202
6202
  background: var(--semi-color-primary-hover);
6203
6203
  border-color: var(--semi-color-primary-hover);
6204
- color: var(--semi-color-bg-1);
6204
+ color: var(--semi-color-white);
6205
6205
  }
6206
6206
  .semi-checkbox:hover.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
6207
- background: var(--semi-color-bg-1);
6207
+ background: var(--semi-color-white);
6208
6208
  }
6209
6209
  .semi-checkbox:active .semi-checkbox-inner-display {
6210
6210
  background: var(--semi-color-fill-1);
@@ -6212,16 +6212,16 @@ body, :host {
6212
6212
  .semi-checkbox:active.semi-checkbox-indeterminate .semi-checkbox-inner-display {
6213
6213
  background: var(--semi-color-primary-active);
6214
6214
  border-color: var(--semi-color-primary-active);
6215
- color: var(--semi-color-bg-1);
6215
+ color: var(--semi-color-white);
6216
6216
  box-shadow: none;
6217
6217
  }
6218
6218
  .semi-checkbox:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
6219
6219
  background: var(--semi-color-primary-active);
6220
6220
  border-color: var(--semi-color-primary-active);
6221
- color: var(--semi-color-bg-1);
6221
+ color: var(--semi-color-white);
6222
6222
  }
6223
6223
  .semi-checkbox:active.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
6224
- background: var(--semi-color-bg-1);
6224
+ background: var(--semi-color-white);
6225
6225
  }
6226
6226
  .semi-checkbox-cardType {
6227
6227
  flex-wrap: nowrap;
@@ -6293,19 +6293,19 @@ body, :host {
6293
6293
  }
6294
6294
  .semi-checkbox-indeterminate .semi-checkbox-inner-display, .semi-checkbox-checked .semi-checkbox-inner-display {
6295
6295
  background: var(--semi-color-primary);
6296
- color: var(--semi-color-bg-1);
6296
+ color: var(--semi-color-white);
6297
6297
  box-shadow: inset 0 0 0 1px var(--semi-color-primary);
6298
6298
  border-radius: 4px;
6299
6299
  }
6300
6300
  .semi-checkbox-indeterminate .semi-checkbox-inner-display:hover, .semi-checkbox-checked .semi-checkbox-inner-display:hover {
6301
6301
  background: var(--semi-color-primary-hover);
6302
6302
  border-color: var(--semi-color-primary-hover);
6303
- color: var(--semi-color-bg-1);
6303
+ color: var(--semi-color-white);
6304
6304
  }
6305
6305
  .semi-checkbox-indeterminate .semi-checkbox-inner-display:active, .semi-checkbox-checked .semi-checkbox-inner-display:active {
6306
6306
  background: var(--semi-color-primary-active);
6307
6307
  border-color: var(--semi-color-primary-active);
6308
- color: var(--semi-color-bg-1);
6308
+ color: var(--semi-color-white);
6309
6309
  }
6310
6310
  .semi-checkbox-indeterminate .semi-checkbox-inner-addon, .semi-checkbox-checked .semi-checkbox-inner-addon {
6311
6311
  color: var(--semi-color-text-0);
@@ -14706,7 +14706,7 @@ img[src=""], img:not([src]) {
14706
14706
  font-size: 14px;
14707
14707
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
14708
14708
  line-height: 20px;
14709
- background-color: var(--semi-color-bg-1);
14709
+ background-color: var(--semi-color-input-DefaultBg);
14710
14710
  border: 1px var(--semi-color-border) solid;
14711
14711
  border-radius: 6px;
14712
14712
  width: 100%;
@@ -14739,55 +14739,55 @@ img[src=""], img:not([src]) {
14739
14739
  line-height: 40px;
14740
14740
  }
14741
14741
  .semi-input-wrapper:hover {
14742
- background-color: var(--semi-color-bg-1);
14742
+ background-color: var(--semi-color-input-HoverBg);
14743
14743
  border-color: var(--semi-color-border-hover);
14744
14744
  }
14745
14745
  .semi-input-wrapper-focus {
14746
- background-color: var(--semi-color-bg-1);
14746
+ background-color: var(--semi-color-input-ActiveBg);
14747
14747
  border: var(--semi-color-focus-border) solid 1px;
14748
14748
  }
14749
14749
  .semi-input-wrapper-focus:hover {
14750
- background-color: var(--semi-color-bg-1);
14750
+ background-color: var(--semi-color-input-HoverBg);
14751
14751
  border-color: var(--semi-color-focus-border);
14752
14752
  }
14753
14753
  .semi-input-wrapper-focus:active {
14754
- background-color: var(--semi-color-bg-1);
14754
+ background-color: var(--semi-color-input-ActiveBg);
14755
14755
  border-color: var(--semi-color-focus-border);
14756
14756
  }
14757
14757
  .semi-input-wrapper.semi-input-readonly {
14758
14758
  cursor: default;
14759
14759
  }
14760
14760
  .semi-input-wrapper-error {
14761
- background-color: var(--semi-color-bg-1);
14762
- border-color: var(--semi-color-danger);
14761
+ background-color: var(--semi-color-danger-light-default);
14762
+ border-color: var(--semi-color-danger-light-default);
14763
14763
  }
14764
14764
  .semi-input-wrapper-error:hover {
14765
- background-color: var(--semi-color-bg-1);
14766
- border-color: var(--semi-color-danger-hover);
14765
+ background-color: var(--semi-color-danger-light-hover);
14766
+ border-color: var(--semi-color-danger-light-hover);
14767
14767
  }
14768
14768
  .semi-input-wrapper-error.semi-input-wrapper-focus {
14769
- background-color: var(--semi-color-bg-1);
14770
- border-color: var(--semi-color-danger-active);
14769
+ background-color: var(--semi-color-danger-light-default);
14770
+ border-color: var(--semi-color-danger);
14771
14771
  }
14772
14772
  .semi-input-wrapper-error:active {
14773
- background-color: var(--semi-color-bg-1);
14774
- border-color: var(--semi-color-danger-active);
14773
+ background-color: var(--semi-color-danger-light-active);
14774
+ border-color: var(--semi-color-danger);
14775
14775
  }
14776
14776
  .semi-input-wrapper-warning {
14777
- background-color: var(--semi-color-bg-1);
14778
- border-color: var(--semi-color-warning);
14777
+ background-color: var(--semi-color-warning-light-default);
14778
+ border-color: var(--semi-color-warning-light-default);
14779
14779
  }
14780
14780
  .semi-input-wrapper-warning:hover {
14781
- background-color: var(--semi-color-bg-1);
14782
- border-color: var(--semi-color-warning-hover);
14781
+ background-color: var(--semi-color-warning-light-hover);
14782
+ border-color: var(--semi-color-warning-light-hover);
14783
14783
  }
14784
14784
  .semi-input-wrapper-warning.semi-input-wrapper-focus {
14785
- background-color: var(--semi-color-bg-1);
14786
- border-color: var(--semi-color-warning-active);
14785
+ background-color: var(--semi-color-warning-light-default);
14786
+ border-color: var(--semi-color-warning);
14787
14787
  }
14788
14788
  .semi-input-wrapper-warning:active {
14789
- background-color: var(--semi-color-bg-1);
14790
- border-color: var(--semi-color-warning-active);
14789
+ background-color: var(--semi-color-warning-light-active);
14790
+ border-color: var(--semi-color-warning);
14791
14791
  }
14792
14792
  .semi-input-wrapper__with-prefix {
14793
14793
  display: inline-flex;
@@ -14869,18 +14869,18 @@ img[src=""], img:not([src]) {
14869
14869
  background-color: transparent;
14870
14870
  }
14871
14871
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input {
14872
- background-color: var(--semi-color-bg-1);
14872
+ background-color: var(--semi-color-input-DefaultBg);
14873
14873
  border: 1px transparent solid;
14874
14874
  }
14875
14875
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover {
14876
- background-color: var(--semi-color-bg-1);
14876
+ background-color: var(--semi-color-input-HoverBg);
14877
14877
  }
14878
14878
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover ~ .semi-input-modebtn {
14879
- background-color: var(--semi-color-bg-1);
14879
+ background-color: var(--semi-color-input-HoverBg);
14880
14880
  }
14881
14881
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus {
14882
14882
  border: 1px var(--semi-color-focus-border) solid;
14883
- background-color: var(--semi-color-bg-1);
14883
+ background-color: var(--semi-color-input-ActiveBg);
14884
14884
  }
14885
14885
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn {
14886
14886
  border-right-style: none;
@@ -14890,7 +14890,7 @@ img[src=""], img:not([src]) {
14890
14890
  }
14891
14891
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn {
14892
14892
  box-sizing: border-box;
14893
- background-color: var(--semi-color-bg-1);
14893
+ background-color: var(--semi-color-input-ActiveBg);
14894
14894
  }
14895
14895
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn {
14896
14896
  border: 1px var(--semi-color-focus-border) solid;
@@ -14909,13 +14909,13 @@ img[src=""], img:not([src]) {
14909
14909
  border-radius: 0;
14910
14910
  }
14911
14911
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active {
14912
- background-color: var(--semi-color-bg-1);
14912
+ background-color: var(--semi-color-input-ActiveBg);
14913
14913
  }
14914
14914
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active ~ .semi-input-modebtn {
14915
- background-color: var(--semi-color-bg-1);
14915
+ background-color: var(--semi-color-input-ActiveBg);
14916
14916
  }
14917
14917
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover {
14918
- background-color: var(--semi-color-bg-1);
14918
+ background-color: var(--semi-color-input-DefaultBg);
14919
14919
  }
14920
14920
  .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover:last-child {
14921
14921
  border-radius: 0 6px 6px 0;
@@ -14924,33 +14924,33 @@ img[src=""], img:not([src]) {
14924
14924
  border-color: transparent;
14925
14925
  }
14926
14926
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input {
14927
- background-color: var(--semi-color-bg-1);
14928
- border-color: var(--semi-color-danger);
14927
+ background-color: var(--semi-color-danger-light-default);
14928
+ border-color: var(--semi-color-danger-light-default);
14929
14929
  }
14930
14930
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover {
14931
- background-color: var(--semi-color-bg-1);
14932
- border-color: var(--semi-color-danger-hover);
14931
+ background-color: var(--semi-color-danger-light-hover);
14932
+ border-color: var(--semi-color-danger-light-hover);
14933
14933
  }
14934
14934
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn {
14935
- background-color: var(--semi-color-bg-1);
14935
+ background-color: var(--semi-color-danger-light-hover);
14936
14936
  }
14937
14937
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus {
14938
- background-color: var(--semi-color-bg-1);
14939
- border-color: var(--semi-color-danger-active);
14938
+ background-color: var(--semi-color-danger-light-default);
14939
+ border-color: var(--semi-color-danger);
14940
14940
  }
14941
14941
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn {
14942
- background-color: var(--semi-color-bg-1);
14943
- border-color: var(--semi-color-danger-active);
14942
+ background-color: var(--semi-color-danger-light-default);
14943
+ border-color: var(--semi-color-danger);
14944
14944
  }
14945
14945
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active {
14946
- background-color: var(--semi-color-bg-1);
14946
+ background-color: var(--semi-color-danger-light-active);
14947
14947
  }
14948
14948
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn {
14949
- background-color: var(--semi-color-bg-1);
14950
- border-color: var(--semi-color-danger-active);
14949
+ background-color: var(--semi-color-danger-light-active);
14950
+ border-color: var(--semi-color-danger);
14951
14951
  }
14952
14952
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover {
14953
- background-color: var(--semi-color-bg-1);
14953
+ background-color: var(--semi-color-danger-light-default);
14954
14954
  }
14955
14955
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover:last-child {
14956
14956
  border-radius: 0 6px 6px 0;
@@ -14959,33 +14959,33 @@ img[src=""], img:not([src]) {
14959
14959
  border-color: transparent;
14960
14960
  }
14961
14961
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input {
14962
- background-color: var(--semi-color-bg-1);
14963
- border-color: var(--semi-color-warning);
14962
+ background-color: var(--semi-color-warning-light-default);
14963
+ border-color: var(--semi-color-warning-light-default);
14964
14964
  }
14965
14965
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover {
14966
- background-color: var(--semi-color-bg-1);
14967
- border-color: var(--semi-color-warning-hover);
14966
+ background-color: var(--semi-color-warning-light-hover);
14967
+ border-color: var(--semi-color-warning-light-hover);
14968
14968
  }
14969
14969
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn {
14970
- background-color: var(--semi-color-bg-1);
14970
+ background-color: var(--semi-color-warning-light-hover);
14971
14971
  }
14972
14972
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus {
14973
- background-color: var(--semi-color-bg-1);
14974
- border-color: var(--semi-color-warning-active);
14973
+ background-color: var(--semi-color-warning-light-default);
14974
+ border-color: var(--semi-color-warning);
14975
14975
  }
14976
14976
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn {
14977
- background-color: var(--semi-color-bg-1);
14978
- border-color: var(--semi-color-warning-active);
14977
+ background-color: var(--semi-color-warning-light-default);
14978
+ border-color: var(--semi-color-warning);
14979
14979
  }
14980
14980
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active {
14981
- background-color: var(--semi-color-bg-1);
14981
+ background-color: var(--semi-color-warning-light-active);
14982
14982
  }
14983
14983
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn {
14984
- background-color: var(--semi-color-bg-1);
14985
- border-color: var(--semi-color-warning-active);
14984
+ background-color: var(--semi-color-warning-light-active);
14985
+ border-color: var(--semi-color-warning);
14986
14986
  }
14987
14987
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover {
14988
- background-color: var(--semi-color-bg-1);
14988
+ background-color: var(--semi-color-warning-light-default);
14989
14989
  }
14990
14990
  .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child {
14991
14991
  border-radius: 0 6px 6px 0;
@@ -15101,7 +15101,7 @@ img[src=""], img:not([src]) {
15101
15101
  height: 100%;
15102
15102
  display: flex;
15103
15103
  align-items: center;
15104
- background-color: var(--semi-color-bg-1);
15104
+ background-color: var(--semi-color-input-DefaultBg);
15105
15105
  color: var(--semi-color-text-2);
15106
15106
  font-size: 14px;
15107
15107
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
@@ -15247,10 +15247,10 @@ img[src=""], img:not([src]) {
15247
15247
  background-color: transparent;
15248
15248
  }
15249
15249
  .semi-input-borderless.semi-input-wrapper-error:not(:focus-within) {
15250
- border-color: var(--semi-color-danger-active);
15250
+ border-color: var(--semi-color-danger);
15251
15251
  }
15252
15252
  .semi-input-borderless.semi-input-wrapper-warning:not(:focus-within) {
15253
- border-color: var(--semi-color-warning-active);
15253
+ border-color: var(--semi-color-warning);
15254
15254
  }
15255
15255
 
15256
15256
  .semi-rtl .semi-input-wrapper,
@@ -17995,7 +17995,7 @@ img[src=""], img:not([src]) {
17995
17995
  box-sizing: border-box;
17996
17996
  width: 16px;
17997
17997
  height: 16px;
17998
- border: solid 1px var(--semi-color-border);
17998
+ border: solid 1px var(--semi-color-text-3);
17999
17999
  border-radius: 16px;
18000
18000
  background: var(--semi-color-bg-1);
18001
18001
  transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
@@ -18037,8 +18037,8 @@ img[src=""], img:not([src]) {
18037
18037
  }
18038
18038
  .semi-radio-addon-buttonRadio-checked {
18039
18039
  font-weight: 600;
18040
- background: var(--semi-color-bg-3);
18041
- color: var(--semi-color-primary);
18040
+ background: var(--semi-color-primary);
18041
+ color: var(--semi-color-text-0);
18042
18042
  }
18043
18043
  .semi-radio-addon-buttonRadio-disabled {
18044
18044
  cursor: not-allowed;
@@ -18172,7 +18172,7 @@ img[src=""], img:not([src]) {
18172
18172
  display: inline-block;
18173
18173
  margin: 0px;
18174
18174
  padding: 0px;
18175
- color: rgba(var(--semi-yellow-5), 1);
18175
+ color: var(--semi-color-highlight-bg);
18176
18176
  list-style: none;
18177
18177
  outline: none;
18178
18178
  border-radius: 3px;
@@ -18606,7 +18606,7 @@ img[src=""], img:not([src]) {
18606
18606
  font-weight: 600;
18607
18607
  }
18608
18608
  .semi-select-option:active {
18609
- background-color: var(--semi-color-input-ActiveBg);
18609
+ background-color: var(--semi-color-fill-1);
18610
18610
  }
18611
18611
  .semi-select-option-empty {
18612
18612
  cursor: not-allowed;
@@ -18624,7 +18624,7 @@ img[src=""], img:not([src]) {
18624
18624
  cursor: not-allowed;
18625
18625
  }
18626
18626
  .semi-select-option-disabled:hover {
18627
- background-color: var(--semi-color-input-HoverBg);
18627
+ background-color: var(--semi-color-fill-0);
18628
18628
  }
18629
18629
  .semi-select-option-selected {
18630
18630
  font-weight: 600;
@@ -18634,7 +18634,7 @@ img[src=""], img:not([src]) {
18634
18634
  color: var(--semi-color-text-2);
18635
18635
  }
18636
18636
  .semi-select-option-focused {
18637
- background-color: var(--semi-color-input-HoverBg);
18637
+ background-color: var(--semi-color-fill-0);
18638
18638
  }
18639
18639
 
18640
18640
  .semi-select {
@@ -18643,7 +18643,7 @@ img[src=""], img:not([src]) {
18643
18643
  border: 1px solid var(--semi-color-border);
18644
18644
  height: 36px;
18645
18645
  font-weight: 400;
18646
- background-color: var(--semi-color-input-DefaultBg);
18646
+ background-color: var(--semi-color-fill-0);
18647
18647
  display: inline-flex;
18648
18648
  vertical-align: middle;
18649
18649
  position: relative;
@@ -18659,12 +18659,12 @@ img[src=""], img:not([src]) {
18659
18659
  border: 1px solid var(--semi-color-border-hover);
18660
18660
  }
18661
18661
  .semi-select:focus {
18662
- border: 1px solid var(--semi-color-border);
18663
- background-color: var(--semi-color-input-ActiveBg);
18662
+ border: 1px solid var(--semi-color-focus-border);
18663
+ background-color: var(--semi-color-fill-0);
18664
18664
  outline: 0;
18665
18665
  }
18666
18666
  .semi-select:active {
18667
- background-color: var(--semi-color-input-ActiveBg);
18667
+ background-color: var(--semi-color-fill-2);
18668
18668
  }
18669
18669
  .semi-select-small {
18670
18670
  height: 28px;
@@ -18684,44 +18684,44 @@ img[src=""], img:not([src]) {
18684
18684
  outline: 0;
18685
18685
  }
18686
18686
  .semi-select-open:hover, .semi-select-focus:hover {
18687
- background-color: var(--semi-color-input-DefaultBg);
18687
+ background-color: var(--semi-color-fill-0);
18688
18688
  border: 1px solid var(--semi-color-focus-border);
18689
18689
  }
18690
18690
  .semi-select-open:active, .semi-select-focus:active {
18691
- background-color: var(--semi-color-input-ActiveBg);
18692
- border: 1px solid var(--semi-color-info-active);
18691
+ background-color: var(--semi-color-fill-2);
18692
+ border: 1px solid var(--semi-color-focus-border);
18693
18693
  }
18694
18694
  .semi-select-warning {
18695
- background-color: var(--semi-color-bg-1);
18696
- border-color: var(--semi-color-warning);
18695
+ background-color: var(--semi-color-warning-light-default);
18696
+ border-color: var(--semi-color-warning-light-default);
18697
18697
  }
18698
18698
  .semi-select-warning:hover {
18699
- background-color: var(--semi-color-bg-1);
18700
- border-color: var(--semi-color-warning-hover);
18699
+ background-color: var(--semi-color-warning-light-hover);
18700
+ border-color: var(--semi-color-warning-light-hover);
18701
18701
  }
18702
18702
  .semi-select-warning:focus {
18703
- background-color: var(--semi-color-bg-1);
18703
+ background-color: var(--semi-color-warning-light-default);
18704
18704
  border-color: var(--semi-color-warning);
18705
18705
  }
18706
18706
  .semi-select-warning:active {
18707
- background-color: var(--semi-color-bg-1);
18708
- border-color: var(--semi-color-warning-active);
18707
+ background-color: var(--semi-color-warning-light-active);
18708
+ border-color: var(--semi-color-warning-light-active);
18709
18709
  }
18710
18710
  .semi-select-error {
18711
- background-color: var(--semi-color-bg-1);
18712
- border-color: var(--semi-color-danger);
18711
+ background-color: var(--semi-color-danger-light-default);
18712
+ border-color: var(--semi-color-danger-light-default);
18713
18713
  }
18714
18714
  .semi-select-error:hover {
18715
- background-color: var(--semi-color-bg-1);
18716
- border-color: var(--semi-color-danger-hover);
18715
+ background-color: var(--semi-color-danger-light-hover);
18716
+ border-color: var(--semi-color-danger-light-hover);
18717
18717
  }
18718
18718
  .semi-select-error:focus {
18719
- background-color: var(--semi-color-bg-1);
18719
+ background-color: var(--semi-color-danger-light-default);
18720
18720
  border-color: var(--semi-color-danger);
18721
18721
  }
18722
18722
  .semi-select-error:active {
18723
- background-color: var(--semi-color-bg-1);
18724
- border-color: var(--semi-color-danger-active);
18723
+ background-color: var(--semi-color-danger-light-active);
18724
+ border-color: var(--semi-color-danger-light-active);
18725
18725
  }
18726
18726
  .semi-select-disabled {
18727
18727
  cursor: not-allowed;
@@ -22547,7 +22547,7 @@ img[src=""], img:not([src]) {
22547
22547
  }
22548
22548
 
22549
22549
  .semi-tagInput {
22550
- background-color: var(--semi-color-bg-transparent);
22550
+ background-color: var(--semi-color-input-DefaultBg);
22551
22551
  border: 1px var(--semi-color-border) solid;
22552
22552
  border-radius: 8px;
22553
22553
  display: inline-flex;
@@ -22596,11 +22596,11 @@ img[src=""], img:not([src]) {
22596
22596
  opacity: 0.5;
22597
22597
  }
22598
22598
  .semi-tagInput-hover {
22599
- background-color: var(--semi-color-bg-transparent);
22599
+ background-color: var(--semi-color-fill-1);
22600
22600
  border: 1px var(--semi-color-border-hover) solid;
22601
22601
  }
22602
22602
  .semi-tagInput-focus {
22603
- background-color: var(--semi-color-bg-transparent);
22603
+ background-color: var(--semi-color-input-ActiveBg);
22604
22604
  border: 1px var(--semi-color-focus-border) solid;
22605
22605
  }
22606
22606
  .semi-tagInput-warning {
@@ -26104,21 +26104,21 @@ p.semi-typography-extended,
26104
26104
  border: 1px var(--semi-color-border) solid;
26105
26105
  border-radius: 6px;
26106
26106
  vertical-align: bottom;
26107
- background-color: var(--semi-color-bg-1);
26107
+ background-color: var(--semi-color-input-DefaultBg);
26108
26108
  transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
26109
26109
  }
26110
26110
  .semi-input-textarea-wrapper:hover {
26111
- background-color: var(--semi-color-bg-1);
26111
+ background-color: var(--semi-color-input-HoverBg);
26112
26112
  }
26113
26113
  .semi-input-textarea-wrapper-focus {
26114
- background-color: var(--semi-color-bg-1);
26114
+ background-color: var(--semi-color-input-ActiveBg);
26115
26115
  border: 1px var(--semi-color-focus-border) solid;
26116
26116
  }
26117
26117
  .semi-input-textarea-wrapper-focus:hover, .semi-input-textarea-wrapper-focus:active {
26118
- background-color: var(--semi-color-bg-1);
26118
+ background-color: var(--semi-color-input-ActiveBg);
26119
26119
  }
26120
26120
  .semi-input-textarea-wrapper:active {
26121
- background-color: var(--semi-color-bg-1);
26121
+ background-color: var(--semi-color-input-ActiveBg);
26122
26122
  }
26123
26123
  .semi-input-textarea-wrapper .semi-input-clearbtn {
26124
26124
  position: absolute;
@@ -26155,36 +26155,36 @@ p.semi-typography-extended,
26155
26155
  cursor: text;
26156
26156
  }
26157
26157
  .semi-input-textarea-wrapper-error {
26158
- background-color: var(--semi-color-bg-1);
26159
- border-color: var(--semi-color-danger);
26158
+ background-color: var(--semi-color-danger-light-default);
26159
+ border-color: var(--semi-color-danger-light-default);
26160
26160
  }
26161
26161
  .semi-input-textarea-wrapper-error:hover {
26162
- background-color: var(--semi-color-bg-1);
26163
- border-color: var(--semi-color-danger-hover);
26162
+ background-color: var(--semi-color-danger-light-hover);
26163
+ border-color: var(--semi-color-danger-light-hover);
26164
26164
  }
26165
26165
  .semi-input-textarea-wrapper-error.semi-input-textarea-wrapper-focus {
26166
- background-color: var(--semi-color-bg-1);
26167
- border-color: var(--semi-color-danger-active);
26166
+ background-color: var(--semi-color-danger-light-default);
26167
+ border-color: var(--semi-color-danger);
26168
26168
  }
26169
26169
  .semi-input-textarea-wrapper-error:active {
26170
- background-color: var(--semi-color-bg-1);
26171
- border-color: var(--semi-color-danger-active);
26170
+ background-color: var(--semi-color-danger-light-active);
26171
+ border-color: var(--semi-color-danger);
26172
26172
  }
26173
26173
  .semi-input-textarea-wrapper-warning {
26174
- background-color: var(--semi-color-bg-1);
26175
- border-color: var(--semi-color-warning);
26174
+ background-color: var(--semi-color-warning-light-default);
26175
+ border-color: var(--semi-color-warning-light-default);
26176
26176
  }
26177
26177
  .semi-input-textarea-wrapper-warning:hover {
26178
- background-color: var(--semi-color-bg-1);
26179
- border-color: var(--semi-color-warning-hover);
26178
+ background-color: var(--semi-color-warning-light-hover);
26179
+ border-color: var(--semi-color-warning-light-hover);
26180
26180
  }
26181
26181
  .semi-input-textarea-wrapper-warning.semi-input-textarea-wrapper-focus {
26182
- background-color: var(--semi-color-bg-1);
26183
- border-color: var(--semi-color-warning-active);
26182
+ background-color: var(--semi-color-warning-light-default);
26183
+ border-color: var(--semi-color-warning);
26184
26184
  }
26185
26185
  .semi-input-textarea-wrapper-warning:active {
26186
- background-color: var(--semi-color-bg-1);
26187
- border-color: var(--semi-color-warning-active);
26186
+ background-color: var(--semi-color-warning-light-active);
26187
+ border-color: var(--semi-color-warning);
26188
26188
  }
26189
26189
 
26190
26190
  .semi-input-textarea {
@@ -26254,16 +26254,16 @@ p.semi-typography-extended,
26254
26254
  background-color: transparent;
26255
26255
  }
26256
26256
  .semi-input-textarea-borderless.semi-input-textarea-wrapper-error:not(:focus-within) {
26257
- border-color: var(--semi-color-danger-active);
26257
+ border-color: var(--semi-color-danger);
26258
26258
  }
26259
26259
  .semi-input-textarea-borderless.semi-input-textarea-wrapper-warning:not(:focus-within) {
26260
- border-color: var(--semi-color-warning-active);
26260
+ border-color: var(--semi-color-warning);
26261
26261
  }
26262
26262
  .semi-input-textarea-borderless.semi-input-textarea-wrapper-error .semi-input-textarea-counter {
26263
- color: var(--semi-color-danger-active);
26263
+ color: var(--semi-color-danger);
26264
26264
  }
26265
26265
  .semi-input-textarea-borderless.semi-input-textarea-wrapper-warning .semi-input-textarea-counter {
26266
- color: var(--semi-color-warning-active);
26266
+ color: var(--semi-color-warning);
26267
26267
  }
26268
26268
 
26269
26269
  .semi-rtl .semi-input-wrapper,