@semi-bot/semi-theme-fnos 1.0.1 → 1.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +2 -2
  2. package/package.json +1 -1
  3. package/raw.json +352 -304
  4. package/scss/_palette.scss +200 -200
  5. package/scss/global.scss +91 -83
  6. package/scss/local.scss +33 -13
  7. package/semi.css +352 -337
  8. package/semi.min.css +1 -1
package/scss/global.scss CHANGED
@@ -2,14 +2,14 @@
2
2
 
3
3
  body, body[theme-mode="dark"] .semi-always-light {
4
4
  --semi-color-app: rgba(var(--semi-neutral-0),1);
5
- --semi-color-bg-0: rgba(255,255,255, 1);
5
+ --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
6
6
  --semi-color-bg-1: rgba(255,255,255,1);
7
7
  --semi-color-bg-2: rgba(255,255,255,1);
8
8
  --semi-color-bg-3: rgba(255,255,255,1);
9
9
  --semi-color-bg-4: rgba(255,255,255,1);
10
- --semi-color-info: rgba(var(--semi-brand-5), 1);
10
+ --semi-color-info: rgba(var(--semi-brand-5),1);
11
11
  --semi-color-link: rgba(var(--semi-brand-5),1);
12
- --semi-color-bg-anti: rgba(28,28,28,1);
12
+ --semi-color-bg-anti: rgba(var(--semi-neutral-8),1);
13
13
  --semi-color-nav-bg: rgba(var(--semi-neutral-0),1);
14
14
  --semi-color-black: rgba(0,0,0,1);
15
15
  --semi-color-data-0: rgba(var(--semi-brand-5),1);
@@ -22,15 +22,16 @@ body, body[theme-mode="dark"] .semi-always-light {
22
22
  --semi-color-data-7: rgba(139, 215, 210, 1);
23
23
  --semi-color-data-8: rgba(131, 176, 35, 1);
24
24
  --semi-color-data-9: rgba(233, 165, 229, 1);
25
- --semi-color-fill-0: rgba(var(--semi-neutral-5), 0.05);
26
- --semi-color-fill-1: rgba(var(--semi-neutral-5), 0.08);
27
- --semi-color-fill-2: rgba(var(--semi-neutral-5), 0.16);
25
+ --semi-color-fill-0: rgba(var(--semi-neutral-5),0.05);
26
+ --semi-color-fill-1: rgba(var(--semi-neutral-5),0.08);
27
+ --semi-color-fill-2: rgba(var(--semi-neutral-5),0.16);
28
28
  --semi-color-fill-3: rgba(var(--semi-neutral-5),0.32);
29
29
  --semi-color-text-0: rgba(var(--semi-neutral-9),1);
30
30
  --semi-color-text-1: rgba(var(--semi-neutral-9),0.8);
31
31
  --semi-color-text-2: rgba(var(--semi-neutral-9),0.6);
32
32
  --semi-color-text-3: rgba(var(--semi-neutral-9),0.4);
33
33
  --semi-color-white: rgba(255,255,255,1);
34
+ --semi-color-app-name: rgba(var(--semi-blue-5),1);
34
35
  --semi-color-bg-avatar: rgba(var(--semi-neutral-5),0.08);
35
36
  --semi-color-data-10: rgba(48, 167, 206, 1);
36
37
  --semi-color-data-11: rgba(249, 192, 100, 1);
@@ -43,7 +44,7 @@ body, body[theme-mode="dark"] .semi-always-light {
43
44
  --semi-color-data-18: rgba(212, 88, 212, 1);
44
45
  --semi-color-data-19: rgba(188, 198, 255, 1);
45
46
  --semi-color-data-20: rgba(121,137,255, 1);
46
- --semi-color-border: rgba(var(--semi-neutral-3),1);
47
+ --semi-color-border: rgba(var(--semi-neutral-5),0.16);
47
48
  --semi-color-danger: rgba(var(--semi-red-5), 1);
48
49
  --semi-color-shadow: rgba(var(--semi-neutral-9),0.05);
49
50
  --semi-color-text-nav: rgba(var(--semi-neutral-9),0.8);
@@ -83,8 +84,8 @@ body, body[theme-mode="dark"] .semi-always-light {
83
84
  --semi-color-bg-transparent: rgba(255,255,255,0);
84
85
  --semi-color-card-HoverBg: rgba(var(--semi-neutral-5),0.08);
85
86
  --semi-color-divider-0: rgba(var(--semi-neutral-5),0.08);
86
- --semi-color-divider-1: rgba(var(--semi-neutral-2),0.16);
87
- --semi-color-divider-2: rgba(var(--semi-neutral-2),0.2);
87
+ --semi-color-divider-1: rgba(var(--semi-neutral-5),0.16);
88
+ --semi-color-divider-2: rgba(var(--semi-neutral-5),0.22);
88
89
  --semi-color-link-visited: rgba(var(--semi-brand-3),1);
89
90
  --semi-color-photo-toast: rgba(0,0,0,0.9);
90
91
  --semi-color-tab-DefaultBg: rgba(var(--semi-neutral-0),1);
@@ -96,40 +97,44 @@ body, body[theme-mode="dark"] .semi-always-light {
96
97
  --semi-color-tab-DisabledBg: rgba(var(--semi-neutral-2),1);
97
98
  --semi-color-tab-SelectedBg: rgba(var(--semi-neutral-9),1);
98
99
  --semi-color-Scrollbar: rgba(var(--semi-neutral-5),0.16);
99
- --semi-color-border-hover: rgba(var(--semi-neutral-4),1);
100
- --semi-color-border-modal: rgba(var(--semi-neutral-8),0.15);
100
+ --semi-color-border-hover: rgba(var(--semi-neutral-5),0.22);
101
+ --semi-color-border-modal: rgba(var(--semi-neutral-5),0.16);
101
102
  --semi-color-card-DefaultBg: rgba(var(--semi-neutral-5),0.05);
102
103
  --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
103
104
  --semi-color-highlight: rgba(var(--semi-black),1);
105
+ --semi-color-input-HoverBg: rgba(255,255,255,1);
104
106
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
105
107
  --semi-color-table-FocusBg: rgba(var(--semi-brand-5),0.2);
106
108
  --semi-color-table-HoverBg: rgba(var(--semi-neutral-5),0.08);
107
- --semi-color-border-active: rgba(var(--semi-neutral-5),1);
109
+ --semi-color-border-active: rgba(var(--semi-neutral-5),0.32);
108
110
  --semi-color-border-select: rgba(var(--semi-neutral-0),0);
109
111
  --semi-color-danger-active: rgba(var(--semi-red-7), 1);
110
112
  --semi-color-disabled-bg: rgba(var(--semi-neutral-5),0.08);
113
+ --semi-color-input-ActiveBg: rgba(255,255,255,1);
111
114
  --semi-color-table-ActiveBg: rgba(var(--semi-brand-5),0.12);
112
- --semi-color-card-borderHover: rgba(var(--semi-neutral-5),0.2);
115
+ --semi-color-card-borderHover: rgba(var(--semi-neutral-6),0.2);
113
116
  --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
117
+ --semi-color-input-DefaultBg: rgba(255,255,255,1);
114
118
  --semi-color-photo-toastText: rgba(255,255,255,1);
115
119
  --semi-color-primary-hover: rgba(var(--semi-brand-6), 1);
116
120
  --semi-color-success-hover: rgba(var(--semi-green-6), 1);
117
121
  --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
118
122
  --semi-color-Component-bg: rgba(255,255,255,0.5);
119
- --semi-color-card-borderActive: rgba(var(--semi-blue-5),1);
123
+ --semi-color-card-borderActive: rgba(var(--semi-brand-5),1);
120
124
  --semi-color-default-active: rgba(var(--semi-grey-2), 1);
121
125
  --semi-color-disabled-fill: rgba(var(--semi-neutral-5),0.08);
122
126
  --semi-color-disabled-text: rgba(var(--semi-neutral-5),0.4);
123
127
  --semi-color-highlight-bg: rgba(var(--semi-yellow-4),1);
128
+ --semi-color-input-DisabledBg: rgba(var(--semi-neutral-5),0.08);
124
129
  --semi-color-primary-active: rgba(var(--semi-brand-7), 1);
125
130
  --semi-color-success-active: rgba(var(--semi-green-7), 1);
126
131
  --semi-color-warning-active: rgba(var(--semi-orange-7),1);
127
- --semi-color-tertiary-hover: rgba(var(--semi-neutral-6), 1);
132
+ --semi-color-tertiary-hover: rgba(var(--semi-neutral-6),0.8);
128
133
  --semi-color-Component-card: rgba(255,255,255,0.9);
129
134
  --semi-color-disabled-border: rgba(var(--semi-neutral-5),0.2);
130
135
  --semi-color-primary-disabled: rgba(var(--semi-neutral-5),0.08);
131
136
  --semi-color-success-disabled: rgba(var(--semi-neutral-5),0.08);
132
- --semi-color-tertiary-active: rgba(var(--semi-neutral-7), 1);
137
+ --semi-color-tertiary-active: rgba(var(--semi-neutral-6),1);
133
138
  --semi-color-Scrollbar-hover: rgba(var(--semi-neutral-5),0.32);
134
139
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
135
140
  --semi-color-overlay-CustomAnti: rgba(255,255,255,0.7);
@@ -187,17 +192,17 @@ font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI','PingFang SC
187
192
  }
188
193
  body[theme-mode="dark"], body .semi-always-dark {
189
194
  --semi-color-app: rgba(var(--semi-neutral-0),1);
190
- --semi-color-bg-0: rgba(var(--semi-neutral-0), 1);
195
+ --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
191
196
  --semi-color-bg-1: rgba(var(--semi-neutral-1), 1);
192
197
  --semi-color-bg-2: rgba(var(--semi-neutral-1),1);
193
- --semi-color-bg-3: rgba(var(--semi-neutral-3),1);
194
- --semi-color-bg-4: rgba(var(--semi-neutral-4),1);
195
- --semi-color-info: rgba(var(--semi-brand-4),1);
196
- --semi-color-link: rgba(var(--semi-brand-4),1);
197
- --semi-color-bg-anti: rgba(var(--semi-neutral-9), 1);
198
+ --semi-color-bg-3: rgba(var(--semi-neutral-2),1);
199
+ --semi-color-bg-4: rgba(var(--semi-neutral-2),1);
200
+ --semi-color-info: rgba(var(--semi-brand-5),1);
201
+ --semi-color-link: rgba(var(--semi-brand-5),1);
202
+ --semi-color-bg-anti: rgba(255,255,255,1);
198
203
  --semi-color-nav-bg: rgba(var(--semi-neutral-2),1);
199
204
  --semi-color-black: rgba(0,0,0,1);
200
- --semi-color-data-0: rgba(var(--semi-brand-4),1);
205
+ --semi-color-data-0: rgba(var(--semi-brand-5),1);
201
206
  --semi-color-data-1: rgba(102,204,255,1);
202
207
  --semi-color-data-2: rgba(245,135,0,1);
203
208
  --semi-color-data-3: rgba(220,183,252,1);
@@ -207,15 +212,16 @@ body[theme-mode="dark"], body .semi-always-dark {
207
212
  --semi-color-data-7: rgba(139,215,210,1);
208
213
  --semi-color-data-8: rgba(140,176,35,1);
209
214
  --semi-color-data-9: rgba(233,165,229,1);
210
- --semi-color-fill-0: rgba(var(--semi-neutral-9),0.05);
211
- --semi-color-fill-1: rgba(var(--semi-neutral-9),0.09);
212
- --semi-color-fill-2: rgba(var(--semi-neutral-9),0.13);
213
- --semi-color-text-0: rgba(var(--semi-neutral-9), 1);
214
- --semi-color-text-1: rgba(var(--semi-neutral-8), 1);
215
- --semi-color-text-2: rgba(var(--semi-neutral-6), 1);
216
- --semi-color-text-3: rgba(var(--semi-neutral-5), 1);
215
+ --semi-color-fill-0: rgba(var(--semi-neutral-5), 0.05);
216
+ --semi-color-fill-1: rgba(var(--semi-neutral-5), 0.08);
217
+ --semi-color-fill-2: rgba(var(--semi-neutral-5), 0.16);
218
+ --semi-color-fill-3: rgba(var(--semi-neutral-5),0.32);
219
+ --semi-color-text-0: rgba(255,255,255,1);
220
+ --semi-color-text-1: rgba(var(--semi-neutral-9),0.8);
221
+ --semi-color-text-2: rgba(var(--semi-neutral-9),0.6);
222
+ --semi-color-text-3: rgba(var(--semi-neutral-9),0.4);
217
223
  --semi-color-white: rgba(255,255,255,1);
218
- --semi-color-bg-avatar: rgba(var(--semi-neutral-9), 0.08);
224
+ --semi-color-bg-avatar: rgba(var(--semi-neutral-5),0.08);
219
225
  --semi-color-data-10: rgba(48,167,206,1);
220
226
  --semi-color-data-11: rgba(249,192,100,1);
221
227
  --semi-color-data-12: rgba(177,113,249,1);
@@ -227,13 +233,12 @@ body[theme-mode="dark"], body .semi-always-dark {
227
233
  --semi-color-data-18: rgba(212,88,212,1);
228
234
  --semi-color-data-19: rgba(188,198,255,1);
229
235
  --semi-color-data-20: rgba(var(--semi-brand-4), 1);
230
- --semi-color-bg-custom5: rgba(170,170,170,1);
231
- --semi-color-border: rgba(var(--semi-neutral-4),1);
232
- --semi-color-danger: rgba(var(--semi-red-4),1);
236
+ --semi-color-border: rgba(var(--semi-neutral-5),0.16);
237
+ --semi-color-danger: rgba(var(--semi-red-5),1);
233
238
  --semi-color-shadow: rgba(var(--semi-neutral-0),0.8);
234
- --semi-color-text-nav: rgba(var(--semi-neutral-8),1);
239
+ --semi-color-text-nav: rgba(var(--semi-neutral-9),0.8);
235
240
  --semi-color-app-header: rgba(var(--semi-neutral-0),0);
236
- --semi-color-bg-dropdown: rgba(var(--semi-neutral-3), 1);
241
+ --semi-color-bg-dropdown: rgba(var(--semi-neutral-2),1);
237
242
  --semi-color-black-10: rgba(0,0,0,0.1);
238
243
  --semi-color-black-20: rgba(0,0,0,0.2);
239
244
  --semi-color-black-30: rgba(0,0,0,0.3);
@@ -243,7 +248,7 @@ body[theme-mode="dark"], body .semi-always-dark {
243
248
  --semi-color-black-70: rgba(0,0,0,0.7);
244
249
  --semi-color-black-80: rgba(0,0,0,0.8);
245
250
  --semi-color-black-90: rgba(0,0,0,0.9);
246
- --semi-color-text-anti: rgba(var(--semi-neutral-0), 1);
251
+ --semi-color-text-anti: rgba(var(--semi-neutral-0),1);
247
252
  --semi-color-white-10: rgba(255,255,255,0.1);
248
253
  --semi-color-white-20: rgba(255,255,255,0.2);
249
254
  --semi-color-white-30: rgba(255,255,255,0.3);
@@ -254,90 +259,93 @@ body[theme-mode="dark"], body .semi-always-dark {
254
259
  --semi-color-white-80: rgba(255,255,255,0.8);
255
260
  --semi-color-white-90: rgba(255,255,255,0.9);
256
261
  --semi-color-default: rgba(var(--semi-neutral-0), 1);
257
- --semi-color-info-hover: rgba(var(--semi-brand-5),1);
258
- --semi-color-link-hover: rgba(var(--semi-brand-5),1);
259
- --semi-color-primary: rgba(var(--semi-brand-4),1);
260
- --semi-color-success: rgba(var(--semi-green-4),1);
262
+ --semi-color-info-hover: rgba(var(--semi-brand-4),1);
263
+ --semi-color-link-hover: rgba(var(--semi-brand-4),1);
264
+ --semi-color-primary: rgba(var(--semi-brand-5),1);
265
+ --semi-color-success: rgba(var(--semi-green-5),1);
261
266
  --semi-color-tab-HoverBg: rgba(var(--semi-neutral-2),1);
262
- --semi-color-warning: rgba(var(--semi-orange-4),1);
267
+ --semi-color-warning: rgba(var(--semi-orange-5),1);
263
268
  --semi-color-app-siderbar: rgba(var(--semi-neutral-0),0);
264
- --semi-color-card-border: rgba(var(--semi-neutral-3), 1);
269
+ --semi-color-card-border: rgba(var(--semi-neutral-5),0.16);
265
270
  --semi-color-info-active: rgba(var(--semi-brand-3),1);
266
271
  --semi-color-link-active: rgba(var(--semi-brand-3),1);
267
272
  --semi-color-app-container: rgba(var(--semi-neutral-1),1);
268
- --semi-color-bg-transparent: rgba(var(--semi-neutral-1),0);
269
- --semi-color-card-HoverBg: rgba(var(--semi-neutral-3), 1);
270
- --semi-color-divider-0: rgba(var(--semi-neutral-9),0.2);
271
- --semi-color-divider-1: rgba(var(--semi-neutral-8),0.1);
272
- --semi-color-divider-2: rgba(var(--semi-neutral-8),0.05);
273
+ --semi-color-bg-transparent: rgba(var(--semi-neutral-0),0);
274
+ --semi-color-card-HoverBg: rgba(var(--semi-neutral-5),0.08);
275
+ --semi-color-divider-0: rgba(var(--semi-neutral-5),0.08);
276
+ --semi-color-divider-1: rgba(var(--semi-neutral-5),0.16);
277
+ --semi-color-divider-2: rgba(var(--semi-neutral-5),0.22);
273
278
  --semi-color-link-visited: rgba(var(--semi-brand-2),1);
274
279
  --semi-color-photo-toast: rgba(0,0,0,0.9);
275
280
  --semi-color-tab-DefaultBg: rgba(var(--semi-neutral-1),1);
276
- --semi-color-tertiary: rgba(var(--semi-neutral-6),1);
277
- --semi-color-card-ActiveBg: rgba(var(--semi-brand-1),0.5);
278
- --semi-color-data-custom21: rgba(var(--semi-brand-3), 1);
281
+ --semi-color-tertiary: rgba(var(--semi-neutral-5),0.16);
282
+ --semi-color-card-ActiveBg: rgba(var(--semi-brand-5),0.12);
279
283
  --semi-color-focus-border: rgba(var(--semi-brand-5), 1);
280
- --semi-color-info-disabled: rgba(var(--semi-brand-2), 1);
281
- --semi-color-overlay-bg: rgba(0,0,0,0.7);
284
+ --semi-color-info-disabled: rgba(var(--semi-neutral-5),0.08);
285
+ --semi-color-overlay-bg: rgba(0,0,0,0.6);
282
286
  --semi-color-shadow-anti: rgba(0,0,0,0.7);
283
287
  --semi-color-tab-DisabledBg: rgba(var(--semi-neutral-2),1);
284
288
  --semi-color-tab-SelectedBg: rgba(var(--semi-neutral-9),1);
285
- --semi-color-Scrollbar: rgba(var(--semi-neutral-4),1);
286
- --semi-color-border-hover: rgba(var(--semi-neutral-5),1);
287
- --semi-color-border-modal: rgba(var(--semi-neutral-6),0.6);
288
- --semi-color-card-DefaultBg: rgba(var(--semi-neutral-2),1);
289
- --semi-color-danger-hover: rgba(var(--semi-red-5),1);
289
+ --semi-color-Scrollbar: rgba(var(--semi-neutral-5),0.08);
290
+ --semi-color-border-hover: rgba(var(--semi-neutral-5),0.22);
291
+ --semi-color-border-modal: rgba(var(--semi-neutral-5),0.22);
292
+ --semi-color-card-DefaultBg: rgba(var(--semi-neutral-5),0.05);
293
+ --semi-color-danger-hover: rgba(var(--semi-red-4),1);
290
294
  --semi-color-highlight: rgba(var(--semi-white),1);
295
+ --semi-color-input-HoverBg: rgba(var(--semi-neutral-5),0.08);
291
296
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
292
- --semi-color-table-FocusBg: rgba(var(--semi-brand-2),0.85);
293
- --semi-color-table-HoverBg: rgba(255,255,255,0.05);
294
- --semi-color-border-actvie: rgba(var(--semi-blue-4),1);
295
- --semi-color-border-select: rgba(var(--semi-neutral-4),1);
297
+ --semi-color-table-FocusBg: rgba(var(--semi-brand-5),0.12);
298
+ --semi-color-table-HoverBg: rgba(var(--semi-neutral-5),0.08);
299
+ --semi-color-border-actvie: rgba(var(--semi-neutral-5),0.32);
300
+ --semi-color-border-select: rgba(var(--semi-neutral-5),0.22);
296
301
  --semi-color-danger-active: rgba(var(--semi-red-3),1);
297
- --semi-color-disabled-bg: rgba(var(--semi-neutral-2),1);
298
- --semi-color-table-ActiveBg: rgba(var(--semi-brand-2),0.55);
299
- --semi-color-card-borderHover: rgba(var(--semi-neutral-4),1);
302
+ --semi-color-disabled-bg: rgba(var(--semi-neutral-5),0.08);
303
+ --semi-color-input-ActiveBg: rgba(var(--semi-neutral-5),0.05);
304
+ --semi-color-table-ActiveBg: rgba(var(--semi-brand-5),0.2);
305
+ --semi-color-card-borderHover: rgba(var(--semi-neutral-5),0.22);
300
306
  --semi-color-default-hover: rgba(var(--semi-neutral-1), 1);
307
+ --semi-color-input-DefaultBg: rgba(var(--semi-neutral-5),0.05);
301
308
  --semi-color-photo-toastText: rgba(255,255,255,1);
302
- --semi-color-primary-hover: rgba(var(--semi-brand-5),1);
303
- --semi-color-success-hover: rgba(var(--semi-green-5),1);
304
- --semi-color-warning-hover: rgba(var(--semi-orange-5),1);
309
+ --semi-color-primary-hover: rgba(var(--semi-brand-4),1);
310
+ --semi-color-success-hover: rgba(var(--semi-green-4),1);
311
+ --semi-color-warning-hover: rgba(var(--semi-orange-4),1);
305
312
  --semi-color-Component-bg: rgba(0,0,0,0.6);
306
- --semi-color-card-borderActive: rgba(var(--semi-brand-3),1);
313
+ --semi-color-card-borderActive: rgba(var(--semi-brand-5),1);
307
314
  --semi-color-default-active: rgba(var(--semi-neutral-2), 1);
308
- --semi-color-disabled-fill: rgba(var(--semi-neutral-8),0.04);
309
- --semi-color-disabled-text: rgba(var(--semi-neutral-5),1);
315
+ --semi-color-disabled-fill: rgba(var(--semi-neutral-5),0.08);
316
+ --semi-color-disabled-text: rgba(var(--semi-neutral-5),0.4);
310
317
  --semi-color-highlight-bg: rgba(var(--semi-yellow-4),1);
318
+ --semi-color-input-DisabledBg: rgba(var(--semi-neutral-5),0.08);
311
319
  --semi-color-primary-active: rgba(var(--semi-brand-3),1);
312
- --semi-color-success-active: rgba(var(--semi-green-6),1);
320
+ --semi-color-success-active: rgba(var(--semi-green-3),1);
313
321
  --semi-color-warning-active: rgba(var(--semi-orange-3),1);
314
- --semi-color-tertiary-hover: rgba(var(--semi-neutral-7),1);
322
+ --semi-color-tertiary-hover: rgba(var(--semi-neutral-5),0.32);
315
323
  --semi-color-Component-card: rgba(12,13,13,0.6);
316
- --semi-color-disabled-border: rgba(var(--semi-neutral-3),1);
317
- --semi-color-primary-disabled: rgba(var(--semi-brand-2),0.9);
318
- --semi-color-success-disabled: rgba(var(--semi-green-0),1);
319
- --semi-color-tertiary-active: rgba(var(--semi-neutral-7),1);
320
- --semi-color-Scrollbar-hover: rgba(var(--semi-neutral-5),1);
324
+ --semi-color-disabled-border: rgba(var(--semi-neutral-5),0.2);
325
+ --semi-color-primary-disabled: rgba(var(--semi-neutral-5),0.08);
326
+ --semi-color-success-disabled: rgba(var(--semi-neutral-5),0.08);
327
+ --semi-color-tertiary-active: rgba(var(--semi-neutral-5),0.34);
328
+ --semi-color-Scrollbar-hover: rgba(var(--semi-neutral-5),0.16);
321
329
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
322
- --semi-color-overlay-CustomAnti: rgba(0,0,0,0.7);
330
+ --semi-color-overlay-CustomAnti: rgba(0,0,0,0.6);
323
331
  --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
324
332
  --semi-color-info-light-hover: rgba(var(--semi-brand-1),0.5);
325
333
  --semi-color-fndesktop-navbarBg: rgba(12,13,13,0.6);
326
334
  --semi-color-info-light-active: rgba(var(--semi-brand-2),1);
327
- --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
328
- --semi-color-info-light-default: rgba(var(--semi-brand-1),0.8);
335
+ --semi-color-secondary-disabled: rgba(var(--semi-neutral-5),0.08);
336
+ --semi-color-info-light-default: rgba(var(--semi-brand-0),0.8);
329
337
  --semi-color-overlay-CustomPreview: rgba(0,0,0,0.9);
330
338
  --semi-color-danger-light-hover: rgba(var(--semi-red-1),1);
331
339
  --semi-color-danger-light-active: rgba(var(--semi-red-2),1);
332
340
  --semi-color-fndesktop-navbarBorder: rgba(255,255,255,0.05);
333
341
  --semi-color-danger-light-default: rgba(var(--semi-red-0),1);
334
- --semi-color-primary-light-hover: rgba(var(--semi-brand-2),0.55);
342
+ --semi-color-primary-light-hover: rgba(var(--semi-brand-1),0.55);
335
343
  --semi-color-success-light-hover: rgba(var(--semi-green-1),1);
336
344
  --semi-color-warning-light-hover: rgba(var(--semi-orange-1),1);
337
345
  --semi-color-primary-light-active: rgba(var(--semi-brand-2),1);
338
346
  --semi-color-success-light-active: rgba(var(--semi-green-2),1);
339
347
  --semi-color-warning-light-active: rgba(var(--semi-orange-2),1);
340
- --semi-color-primary-light-default: rgba(var(--semi-brand-2),0.3);
348
+ --semi-color-primary-light-default: rgba(var(--semi-brand-0),0.3);
341
349
  --semi-color-success-light-default: rgba(var(--semi-green-0),1);
342
350
  --semi-color-tertiary-light-hover: rgba(var(--semi-neutral-5), 0.3);
343
351
  --semi-color-warning-light-default: rgba(var(--semi-orange-0),1);
package/scss/local.scss CHANGED
@@ -1,5 +1,8 @@
1
1
  $radius-tag: 4px;
2
2
  $spacing-tag_large-paddingX: 8px;
3
+ $color-card-border: var(--semi-color-card-border);
4
+ $color-card-bg-default: var(--semi-color-card-DefaultBg);
5
+ $color-form_label_optional-text-default: var(--semi-color-text-3);
3
6
  $radius-tabs_tab_card: 4px;
4
7
  $radius-tabs_tab_button: 4px;
5
8
  $color-badge_default-text-default: var(--semi-color-white);
@@ -8,27 +11,29 @@ $color-badge_primary_solid-bg-default: var(--semi-color-danger);
8
11
  $color-input_danger-bg-focus: var(--semi-color-bg-1);
9
12
  $color-input_danger-bg-hover: var(--semi-color-bg-1);
10
13
  $color-input_danger-bg-active: var(--semi-color-bg-1);
11
- $color-input_default-bg-focus: var(--semi-color-bg-1);
12
- $color-input_default-bg-hover: var(--semi-color-bg-1);
14
+ $color-input_default-bg-focus: var(--semi-color-input-ActiveBg);
15
+ $color-input_default-bg-hover: var(--semi-color-input-HoverBg);
13
16
  $color-input_warning-bg-focus: var(--semi-color-bg-1);
14
17
  $color-input_warning-bg-hover: var(--semi-color-bg-1);
15
18
  $color-input_danger-bg-default: var(--semi-color-bg-1);
16
- $color-input_default-bg-active: var(--semi-color-bg-1);
19
+ $color-input_default-bg-active: var(--semi-color-input-ActiveBg);
17
20
  $color-input_warning-bg-active: var(--semi-color-bg-1);
18
- $color-input_default-bg-default: var(--semi-color-bg-1);
21
+ $color-input_default-bg-default: var(--semi-color-input-DefaultBg);
19
22
  $color-input_warning-bg-default: var(--semi-color-bg-1);
20
23
  $color-input_danger-border-focus: var(--semi-color-danger-active);
21
24
  $color-input_danger-border-hover: var(--semi-color-danger-hover);
22
25
  $color-input_disabled-bg-default: var(--semi-color-disabled-bg);
26
+ $color-input_counter-text-default: var(--semi-color-text-3);
23
27
  $color-input_default-border-focus: var(--semi-color-focus-border);
24
28
  $color-input_default-border-hover: var(--semi-color-border-hover);
25
29
  $color-input_warning-border-focus: var(--semi-color-warning-active);
26
30
  $color-input_warning-border-hover: var(--semi-color-warning-hover);
27
31
  $color-input_danger-border-default: var(--semi-color-danger);
28
- $color-input_default-bg-focus-hover: var(--semi-color-bg-1);
32
+ $color-input_default-bg-focus-hover: var(--semi-color-input-HoverBg);
29
33
  $color-input_default-border-default: var(--semi-color-border);
30
34
  $color-input_warning-border-default: var(--semi-color-warning);
31
35
  $color-inputNumber_button-bg-disabled: var(--semi-color-disabled-bg);
36
+ $color-input_placeholder-text-default: var(--semi-color-text-3);
32
37
  $height-input_large: 40px;
33
38
  $height-input_small: 24px;
34
39
  $height-input_default: 34px;
@@ -40,16 +45,22 @@ $color-modal_content-border: var(--semi-color-border-modal);
40
45
  $color-radio_default-bg-default: var(--semi-color-bg-1);
41
46
  $color-radio_checked-bg-disabled: var(--semi-color-disabled-bg);
42
47
  $color-radio_disabled-bg-default: var(--semi-color-disabled-bg);
48
+ $color-radio_default-border-default: var(--semi-color-border);
43
49
  $color-radio_checked-border-disabled: var(--semi-color-disabled-border);
44
50
  $color-radio_default-border-disabled: var(--semi-color-disabled-border);
45
51
  $color-table-border-default: var(--semi-color-divider-1);
46
52
  $color-table_th-border-default: var(--semi-color-divider-1);
47
53
  $color-table_shadow-border-default: var(--semi-color-divider-1);
48
54
  $width-table_header_border: 1px;
55
+ $color-button_light-bg-hover: var(--semi-color-fill-2);
56
+ $color-button_light-bg-active: var(--semi-color-fill-3);
57
+ $color-button_light-bg-default: var(--semi-color-fill-1);
49
58
  $color-button_primary-bg-hover: var(--semi-color-primary-hover);
50
59
  $color-button_tertiary-bg-hover: var(--semi-color-tertiary-hover);
60
+ $color-button_light-border-hover: var(--semi-color-bg-transparent);
51
61
  $color-button_primary-bg-default: var(--semi-color-primary);
52
62
  $color-button_secondary-bg-hover: var(--semi-color-secondary-hover);
63
+ $color-button_light-border-active: var(--semi-color-bg-transparent);
53
64
  $color-button_secondary-bg-active: var(--semi-color-fill-1);
54
65
  $color-button_tertiary-bg-default: var(--semi-color-tertiary);
55
66
  $color-button_secondary-bg-default: var(--semi-color-secondary);
@@ -57,6 +68,7 @@ $color-button_tertiary-text-default: var(--semi-color-white);
57
68
  $color-button_primary-border-default: var(--semi-color-bg-transparent);
58
69
  $color-button_secondary-text-default: var(--semi-color-white);
59
70
  $color-button_secondary-border-default: var(--semi-color-bg-transparent);
71
+ $color-button_tertiary_solid-text-default: var(--semi-color-text-0);
60
72
  $width-button-border: 0px;
61
73
  $width-button-outline: 1px;
62
74
  $width-button_light-border: 1px;
@@ -87,19 +99,20 @@ $spacing-button_default-paddingLeft: 16px;
87
99
  $spacing-button_large-paddingBottom: 14px;
88
100
  $spacing-button_small-paddingBottom: 0px;
89
101
  $spacing-button_default-paddingRight: 16px;
90
- $color-select-bg-focus: var(--semi-color-bg-1);
91
- $color-select-bg-hover: var(--semi-color-bg-1);
92
- $color-select-bg-active: var(--semi-color-bg-1);
93
- $color-select-bg-default: var(--semi-color-bg-1);
102
+ $color-rating-bg-default: var(--semi-color-fill-2);
103
+ $color-select-bg-focus: var(--semi-color-input-ActiveBg);
104
+ $color-select-bg-hover: var(--semi-color-fill-1);
105
+ $color-select-bg-active: var(--semi-color-input-ActiveBg);
106
+ $color-select-bg-default: var(--semi-color-input-DefaultBg);
94
107
  $color-select-border-focus: var(--semi-color-border);
95
108
  $color-select-border-hover: var(--semi-color-border-hover);
96
109
  $color-select-border-active: var(--semi-color-info-active);
97
110
  $color-select-border-default: var(--semi-color-border);
98
111
  $color-select_danger-bg-focus: var(--semi-color-bg-1);
99
112
  $color-select_danger-bg-hover: var(--semi-color-bg-1);
100
- $color-select_option-bg-hover: var(--semi-color-fill-0);
113
+ $color-select_option-bg-hover: var(--semi-color-input-HoverBg);
101
114
  $color-select_danger-bg-active: var(--semi-color-bg-1);
102
- $color-select_option-bg-active: var(--semi-color-fill-1);
115
+ $color-select_option-bg-active: var(--semi-color-input-ActiveBg);
103
116
  $color-select_warning-bg-focus: var(--semi-color-bg-1);
104
117
  $color-select_warning-bg-hover: var(--semi-color-bg-1);
105
118
  $color-select_danger-bg-default: var(--semi-color-bg-1);
@@ -111,18 +124,22 @@ $color-select_danger-border-active: var(--semi-color-danger-active);
111
124
  $color-select_warning-border-hover: var(--semi-color-warning-hover);
112
125
  $color-select_danger-border-default: var(--semi-color-danger);
113
126
  $color-select_warning-border-active: var(--semi-color-warning-active);
127
+ $color-select_input_placeholder-text: var(--semi-color-text-2);
114
128
  $color-select_warning-border-default: var(--semi-color-warning);
115
129
  $color-select_input_disabled-border-focus: var(--semi-color-disabled-border);
116
130
  $height-select_small: 28px;
117
131
  $height-select_default: 36px;
118
132
  $radius-select: 6px;
119
133
  $radius-select_option: 4px;
134
+ $color-slider_rail-bg-default: var(--semi-color-fill-1);
120
135
  $color-switch_checked-bg-hover: var(--semi-color-primary-hover);
121
136
  $color-switch_checked-bg-active: var(--semi-color-primary-active);
122
137
  $color-switch_checked-bg-default: var(--semi-color-primary);
123
138
  $color-switch_default-bg-default: var(--semi-color-fill-2);
124
139
  $color-switch_spin_checked-bg-default: var(--semi-color-primary-hover);
125
140
  $color-switch_checked_disabled-bg-default: var(--semi-color-primary-disabled);
141
+ $color-upload_drag_area-bg: var(--semi-color-fill-0);
142
+ $color-upload_drag_area-bg-hover: var(--semi-color-primary-light-default);
126
143
  $color-cascader_default-bg-hover: var(--semi-color-bg-transparent);
127
144
  $color-cascader_default-bg-default: var(--semi-color-bg-transparent);
128
145
  $color-cascader_default-border-hover: var(--semi-color-border-hover);
@@ -142,14 +159,15 @@ $color-checkbox_disabled-border-default: var(--semi-color-disabled-border);
142
159
  $color-checkbox_cardType_inner-bg-active: var(--semi-color-bg-1);
143
160
  $radius-checkbox_inner: 4px;
144
161
  $color-dropdown-bg-default: var(--semi-color-bg-dropdown);
162
+ $color-dropdown_seperator-bg-default: var(--semi-color-divider-1);
145
163
  $color-dropdown_item_disabled-text-default: var(--semi-color-disabled-text);
146
164
  $radius-dropdown: 8px;
147
165
  $spacing-dropdown_menu-paddingX: 0px;
148
166
  $spacing-dropdown_seperator-marginX: 0px;
149
167
  $color-progress_default-bg: rgba(204,214,224,0.3);
150
168
  $color-progress_track_inner-bg: var(--semi-color-primary);
151
- $color-tagInput-border-hover: var(--semi-color-danger);
152
- $color-tagInput-border-default: var(--semi-color-border-hover);
169
+ $color-tagInput-border-hover: var(--semi-color-border-hover);
170
+ $color-tagInput-border-default: var(--semi-color-border);
153
171
  $color-tagInput_danger-bg-focus: var(--semi-color-bg-transparent);
154
172
  $color-tagInput_danger-bg-hover: var(--semi-color-bg-transparent);
155
173
  $color-tagInput_default-bg-focus: var(--semi-color-bg-transparent);
@@ -182,10 +200,12 @@ $width-datepicker_range_trigger-border: 1px;
182
200
  $height-datepicker_range_input-default: 36px;
183
201
  $radius-datepicker_range_input: 8px;
184
202
  $radius-datepicker_range_input_inputWrapper: 8px;
203
+ $color-navigation-bg-default: var(--semi-color-bg-0);
185
204
  $color-navigation_itemL1-text-default: var(--semi-color-text-1);
186
205
  $color-pagination_item-bg-hover: var(--semi-color-fill-0);
187
206
  $color-pagination_item-bg-active: var(--semi-color-primary-hover);
188
207
  $color-pagination_item-bg-selected: var(--semi-color-primary);
208
+ $color-pagination_item-text-active: rgba(255,255,255,1);
189
209
  $color-pagination_item-border-active: var(--semi-color-border-hover);
190
210
  $color-pagination_item-text-selected: var(--semi-color-white);
191
211
  $color-pagination_item-border-default: var(--semi-color-border);