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

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.
package/scss/global.scss CHANGED
@@ -1,15 +1,15 @@
1
1
  @import './_palette.scss';
2
2
 
3
3
  body, body[theme-mode="dark"] .semi-always-light, :host, :host .semi-always-light {
4
- --semi-color-app: rgba(var(--semi-neutral-0),1);
5
- --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
4
+ --semi-color-app: rgba(var(--semi-grey-1),1);
5
+ --semi-color-bg-0: rgba(var(--semi-grey-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(var(--semi-neutral-9), 1);
12
+ --semi-color-bg-anti: rgba(var(--semi-grey-9), 1);
13
13
  --semi-color-nav-bg: rgba(var(--semi-grey-0), 1);
14
14
  --semi-color-black: rgba(0,0,0,1);
15
15
  --semi-color-data-0: rgba(0,102,255,1);
@@ -22,16 +22,16 @@ body, body[theme-mode="dark"] .semi-always-light, :host, :host .semi-always-ligh
22
22
  --semi-color-data-7: rgba(0,179,178,1);
23
23
  --semi-color-data-8: rgba(0,135,83,1);
24
24
  --semi-color-data-9: rgba(230,155,255,1);
25
- --semi-color-fill-0: rgba(var(--semi-grey-5),0.08);
26
- --semi-color-fill-1: rgba(var(--semi-grey-5),0.12);
27
- --semi-color-fill-2: rgba(var(--semi-grey-5),0.16);
28
- --semi-color-fill-3: rgba(var(--semi-grey-5),0.32);
29
- --semi-color-text-0: rgba(var(--semi-neutral-9),1);
30
- --semi-color-text-1: rgba(var(--semi-neutral-9),0.75);
31
- --semi-color-text-2: rgba(var(--semi-neutral-9),0.5);
32
- --semi-color-text-3: rgba(var(--semi-neutral-9),0.25);
25
+ --semi-color-fill-0: rgba(var(--semi-grey-9),0.04);
26
+ --semi-color-fill-1: rgba(var(--semi-grey-9),0.06);
27
+ --semi-color-fill-2: rgba(var(--semi-grey-9),0.12);
28
+ --semi-color-fill-3: rgba(var(--semi-grey-9),0.2);
29
+ --semi-color-text-0: rgba(var(--semi-grey-9), 1);
30
+ --semi-color-text-1: rgba(var(--semi-grey-9),0.75);
31
+ --semi-color-text-2: rgba(var(--semi-grey-9),0.5);
32
+ --semi-color-text-3: rgba(var(--semi-grey-9),0.25);
33
33
  --semi-color-white: rgba(255,255,255,1);
34
- --semi-color-bg-avatar: rgba(var(--semi-grey-5),0.16);
34
+ --semi-color-bg-avatar: rgba(var(--semi-grey-5), 0.16);
35
35
  --semi-color-data-10: rgba(48,167,206,1);
36
36
  --semi-color-data-11: rgba(249, 192, 100, 1);
37
37
  --semi-color-data-12: rgba(177, 113, 249, 1);
@@ -43,11 +43,11 @@ body, body[theme-mode="dark"] .semi-always-light, :host, :host .semi-always-ligh
43
43
  --semi-color-data-18: rgba(212,88,212,1);
44
44
  --semi-color-data-19: rgba(188, 198, 255, 1);
45
45
  --semi-color-data-20: rgba(121,137,255, 1);
46
- --semi-color-border: rgba(var(--semi-grey-6),0.16);
46
+ --semi-color-border: rgba(var(--semi-grey-9),0.12);
47
47
  --semi-color-danger: rgba(var(--semi-red-5),1);
48
48
  --semi-color-shadow: rgba(var(--semi-grey-9), 0.05);
49
- --semi-color-text-nav: rgba(var(--semi-neutral-9), 0.75);
50
- --semi-color-app-header: rgba(var(--semi-neutral-0),0);
49
+ --semi-color-text-nav: rgba(var(--semi-grey-9),0.75);
50
+ --semi-color-app-header: rgba(var(--semi-grey-1),0);
51
51
  --semi-color-bg-dropdown: rgba(255,255,255,1);
52
52
  --semi-color-black-10: rgba(0,0,0,0.1);
53
53
  --semi-color-black-20: rgba(0,0,0,0.2);
@@ -72,99 +72,99 @@ body, body[theme-mode="dark"] .semi-always-light, :host, :host .semi-always-ligh
72
72
  --semi-color-info-hover: rgba(var(--semi-brand-6), 1);
73
73
  --semi-color-link-hover: rgba(var(--semi-brand-6), 1);
74
74
  --semi-color-primary: rgba(var(--semi-brand-5),1);
75
- --semi-color-success: rgba(var(--semi-green-4),1);
75
+ --semi-color-success: rgba(var(--semi-green-5), 1);
76
76
  --semi-color-tab-HoverBg: rgba(var(--semi-grey-5),0.16);
77
77
  --semi-color-warning: rgba(var(--semi-amber-5), 1);
78
- --semi-color-app-siderbar: rgba(var(--semi-neutral-0),0);
79
- --semi-color-card-border: rgba(var(--semi-grey-6),0.16);
78
+ --semi-color-app-siderbar: rgba(var(--semi-grey-1),0);
79
+ --semi-color-card-border: rgba(var(--semi-grey-9),0.12);
80
80
  --semi-color-info-active: rgba(var(--semi-brand-7), 1);
81
81
  --semi-color-link-active: rgba(var(--semi-brand-7),1);
82
82
  --semi-color-app-container: rgba(255,255,255,1);
83
83
  --semi-color-bg-transparent: rgba(255,255,255,0);
84
- --semi-color-card-HoverBg: rgba(var(--semi-grey-5),0.12);
85
- --semi-color-divider-0: rgba(var(--semi-grey-8),0.22);
86
- --semi-color-divider-1: rgba(var(--semi-grey-8),0.16);
87
- --semi-color-divider-2: rgba(var(--semi-grey-8),0.08);
84
+ --semi-color-card-HoverBg: rgba(var(--semi-grey-9),0.06);
85
+ --semi-color-divider-0: rgba(var(--semi-grey-9),0.2);
86
+ --semi-color-divider-1: rgba(var(--semi-grey-9),0.12);
87
+ --semi-color-divider-2: rgba(var(--semi-grey-9),0.06);
88
88
  --semi-color-link-visited: rgba(var(--semi-brand-7),1);
89
89
  --semi-color-photo-toast: rgba(0,0,0,0.9);
90
90
  --semi-color-tab-DefaultBg: rgba(var(--semi-grey-5),0.05);
91
- --semi-color-tertiary: rgba(var(--semi-neutral-6), 1);
91
+ --semi-color-tertiary: rgba(var(--semi-grey-6), 1);
92
92
  --semi-color-card-ActiveBg: rgba(var(--semi-brand-5),0.12);
93
93
  --semi-color-focus-border: rgba(var(--semi-brand-5),1);
94
- --semi-color-info-disabled: rgba(var(--semi-grey-5),0.16);
94
+ --semi-color-info-disabled: rgba(var(--semi-brand-1),0.16);
95
95
  --semi-color-overlay-bg: rgba(0,0,0,0.7);
96
96
  --semi-color-tab-DisabledBg: rgba(var(--semi-grey-5),0.16);
97
97
  --semi-color-tab-SelectedBg: rgba(var(--semi-grey-9),1);
98
98
  --semi-color-Scrollbar: rgba(var(--semi-grey-5),0.16);
99
- --semi-color-border-hover: rgba(var(--semi-grey-6),0.22);
100
- --semi-color-border-modal: rgba(var(--semi-grey-6),0.08);
101
- --semi-color-card-DefaultBg: rgba(var(--semi-grey-5),0.08);
99
+ --semi-color-border-hover: rgba(var(--semi-grey-9),0.2);
100
+ --semi-color-border-modal: rgba(var(--semi-grey-9),0.06);
101
+ --semi-color-card-DefaultBg: rgba(var(--semi-grey-9),0.04);
102
102
  --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
103
103
  --semi-color-highlight: rgba(var(--semi-grey-9), 1);
104
104
  --semi-color-input-HoverBg: rgba(255,255,255,1);
105
105
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
106
106
  --semi-color-table-FocusBg: rgba(var(--semi-brand-5),0.2);
107
107
  --semi-color-table-HoverBg: rgba(var(--semi-grey-5),0.08);
108
- --semi-color-border-active: rgba(var(--semi-grey-6),0.32);
109
- --semi-color-border-select: rgba(var(--semi-grey-6),0);
108
+ --semi-color-border-active: rgba(var(--semi-grey-9),0.24);
109
+ --semi-color-border-select: rgba(var(--semi-grey-9),0.06);
110
110
  --semi-color-danger-active: rgba(var(--semi-red-7), 1);
111
- --semi-color-disabled-bg: rgba(var(--semi-grey-5),0.16);
111
+ --semi-color-disabled-bg: rgba(var(--semi-grey-1),1);
112
112
  --semi-color-input-ActiveBg: rgba(255,255,255,1);
113
113
  --semi-color-table-ActiveBg: rgba(var(--semi-brand-5),0.12);
114
- --semi-color-card-borderHover: rgba(var(--semi-grey-8),0.22);
114
+ --semi-color-card-borderHover: rgba(var(--semi-grey-8),0.12);
115
115
  --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
116
116
  --semi-color-input-DefaultBg: rgba(255,255,255,1);
117
117
  --semi-color-photo-toastText: rgba(255,255,255,1);
118
118
  --semi-color-primary-hover: rgba(var(--semi-brand-6), 1);
119
- --semi-color-success-hover: rgba(var(--semi-green-5),1);
119
+ --semi-color-success-hover: rgba(var(--semi-green-6), 1);
120
120
  --semi-color-warning-hover: rgba(var(--semi-amber-6), 1);
121
121
  --semi-color-Component-bg: rgba(255,255,255,0.5);
122
122
  --semi-color-card-borderActive: rgba(var(--semi-brand-5),1);
123
123
  --semi-color-default-active: rgba(var(--semi-grey-2), 1);
124
- --semi-color-disabled-fill: rgba(var(--semi-grey-5), 0.16);
125
- --semi-color-disabled-text: rgba(var(--semi-grey-9), 0.25);
124
+ --semi-color-disabled-fill: rgba(var(--semi-grey-9),0.04);
125
+ --semi-color-disabled-text: rgba(var(--semi-grey-9),0.25);
126
126
  --semi-color-highlight-bg: rgba(var(--semi-yellow-5),1);
127
127
  --semi-color-input-DisabledBg: rgba(var(--semi-grey-5),0.16);
128
128
  --semi-color-primary-active: rgba(var(--semi-brand-7), 1);
129
- --semi-color-success-active: rgba(var(--semi-green-6),1);
129
+ --semi-color-success-active: rgba(var(--semi-green-7), 1);
130
130
  --semi-color-warning-active: rgba(var(--semi-amber-7), 1);
131
- --semi-color-tertiary-hover: rgba(var(--semi-neutral-7), 1);
131
+ --semi-color-tertiary-hover: rgba(var(--semi-grey-7), 1);
132
132
  --semi-color-Component-card: rgba(255,255,255,0.9);
133
- --semi-color-disabled-border: rgba(var(--semi-grey-8), 0.16);
133
+ --semi-color-disabled-border: rgba(var(--semi-grey-9),0.12);
134
134
  --semi-color-primary-disabled: rgba(var(--semi-grey-5),0.16);
135
- --semi-color-success-disabled: rgba(var(--semi-grey-5),0.16);
136
- --semi-color-tertiary-active: rgba(var(--semi-neutral-8), 1);
135
+ --semi-color-success-disabled: rgba(var(--semi-green-1),0.16);
136
+ --semi-color-tertiary-active: rgba(var(--semi-grey-8), 1);
137
137
  --semi-color-Scrollbar-hover: rgba(var(--semi-grey-5),0.32);
138
138
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
139
139
  --semi-color-overlay-CustomAnti: rgba(255,255,255,0.7);
140
140
  --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
141
- --semi-color-info-light-hover: rgba(var(--semi-brand-1),1);
141
+ --semi-color-info-light-hover: rgba(var(--semi-brand-2),0.3);
142
142
  --semi-color-progress-defaultBg: rgba(var(--semi-grey-5),0.16);
143
143
  --semi-color-fndesktop-navbarBg: rgba(134,164,179,0.05);
144
- --semi-color-info-light-active: rgba(var(--semi-brand-2),1);
144
+ --semi-color-info-light-active: rgba(var(--semi-brand-2),0.4);
145
145
  --semi-color-secondary-disabled: rgba(var(--semi-grey-5),0.16);
146
- --semi-color-info-light-default: rgba(var(--semi-brand-0),1);
146
+ --semi-color-info-light-default: rgba(var(--semi-brand-2),0.2);
147
147
  --semi-color-overlay-CustomPreview: rgba(0,0,0,0.9);
148
- --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
149
- --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
148
+ --semi-color-danger-light-hover: rgba(var(--semi-red-2),0.3);
149
+ --semi-color-danger-light-active: rgba(var(--semi-red-2),0.4);
150
150
  --semi-color-fndesktop-navbarBorder: rgba(255,255,255,0.2);
151
- --semi-color-danger-light-default: rgba(var(--semi-red-0),1);
152
- --semi-color-primary-light-hover: rgba(var(--semi-brand-1),1);
153
- --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
154
- --semi-color-warning-light-hover: rgba(var(--semi-amber-1), 1);
155
- --semi-color-primary-light-active: rgba(var(--semi-brand-2),1);
156
- --semi-color-success-light-active: rgba(var(--semi-green-2),1);
157
- --semi-color-warning-light-active: rgba(var(--semi-amber-2), 1);
158
- --semi-color-primary-light-default: rgba(var(--semi-brand-0),1);
159
- --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
160
- --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.16);
161
- --semi-color-warning-light-default: rgba(var(--semi-amber-0), 1);
162
- --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.32);
151
+ --semi-color-danger-light-default: rgba(var(--semi-red-2),0.2);
152
+ --semi-color-primary-light-hover: rgba(var(--semi-brand-2),0.3);
153
+ --semi-color-success-light-hover: rgba(var(--semi-green-3),0.3);
154
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-3),0.3);
155
+ --semi-color-primary-light-active: rgba(var(--semi-brand-2),0.4);
156
+ --semi-color-success-light-active: rgba(var(--semi-green-3),0.4);
157
+ --semi-color-warning-light-active: rgba(var(--semi-orange-3),0.4);
158
+ --semi-color-primary-light-default: rgba(var(--semi-brand-2),0.2);
159
+ --semi-color-success-light-default: rgba(var(--semi-green-3),0.2);
160
+ --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.3);
161
+ --semi-color-warning-light-default: rgba(var(--semi-orange-3),0.2);
162
+ --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.4);
163
163
  --semi-color-CheckboxPhoto-DefaultBg: rgba(255,255,255,0.2);
164
- --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
165
- --semi-color-tertiary-light-default: rgba(var(--semi-grey-5),0.12);
166
- --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
167
- --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
164
+ --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5),0.3);
165
+ --semi-color-tertiary-light-default: rgba(var(--semi-grey-5),0.2);
166
+ --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5),0.4);
167
+ --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5),0.2);
168
168
  --semi-color-CheckboxPhoto-DefaultBorder: rgba(255,255,255,1);
169
169
  --semi-color-CheckboxPhoto-DefaultBgHover: rgba(255,255,255,0.7);
170
170
  --semi-color-CheckboxPhoto-DefaultBorderHover: rgba(255,255,255,0);
@@ -195,12 +195,12 @@ font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI','PingFang SC
195
195
  }
196
196
  body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :host .semi-always-dark {
197
197
  --semi-color-app: rgba(var(--semi-grey-0),1);
198
- --semi-color-bg-0: rgba(var(--semi-neutral-0),1);
199
- --semi-color-bg-1: rgba(var(--semi-neutral-1), 1);
200
- --semi-color-bg-2: rgba(var(--semi-neutral-1), 1);
201
- --semi-color-bg-3: rgba(var(--semi-neutral-2), 1);
202
- --semi-color-bg-4: rgba(var(--semi-neutral-2), 1);
203
- --semi-color-info: rgba(var(--semi-brand-4),1);
198
+ --semi-color-bg-0: rgba(var(--semi-grey-0), 1);
199
+ --semi-color-bg-1: rgba(var(--semi-grey-1), 1);
200
+ --semi-color-bg-2: rgba(var(--semi-grey-1),1);
201
+ --semi-color-bg-3: rgba(var(--semi-grey-2),1);
202
+ --semi-color-bg-4: rgba(var(--semi-grey-3),1);
203
+ --semi-color-info: rgba(var(--semi-brand-4), 1);
204
204
  --semi-color-link: rgba(var(--semi-brand-4),1);
205
205
  --semi-color-bg-anti: rgba(255,255,255,1);
206
206
  --semi-color-nav-bg: rgba(var(--semi-grey-2), 1);
@@ -215,16 +215,16 @@ body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :ho
215
215
  --semi-color-data-7: rgba(0,179,178,1);
216
216
  --semi-color-data-8: rgba(0,135,83,1);
217
217
  --semi-color-data-9: rgba(233,165,229,1);
218
- --semi-color-fill-0: rgba(var(--semi-grey-5),0.05);
219
- --semi-color-fill-1: rgba(var(--semi-grey-5),0.08);
220
- --semi-color-fill-2: rgba(var(--semi-grey-5),0.16);
221
- --semi-color-fill-3: rgba(var(--semi-grey-5),0.32);
218
+ --semi-color-fill-0: rgba(255,255,255,0.04);
219
+ --semi-color-fill-1: rgba(255,255,255,0.06);
220
+ --semi-color-fill-2: rgba(255,255,255,0.12);
221
+ --semi-color-fill-3: rgba(255,255,255,0.2);
222
222
  --semi-color-text-0: rgba(255,255,255,1);
223
- --semi-color-text-1: rgba(var(--semi-neutral-9),0.75);
224
- --semi-color-text-2: rgba(var(--semi-neutral-9),0.5);
225
- --semi-color-text-3: rgba(var(--semi-neutral-9),0.25);
223
+ --semi-color-text-1: rgba(var(--semi-neutral-9),0.8);
224
+ --semi-color-text-2: rgba(var(--semi-neutral-9),0.6);
225
+ --semi-color-text-3: rgba(var(--semi-neutral-9),0.35);
226
226
  --semi-color-white: rgba(255,255,255,1);
227
- --semi-color-bg-avatar: rgba(var(--semi-neutral-5),0.16);
227
+ --semi-color-bg-avatar: rgba(255,255,255,0.06);
228
228
  --semi-color-data-10: rgba(48,167,206,1);
229
229
  --semi-color-data-11: rgba(249,192,100,1);
230
230
  --semi-color-data-12: rgba(177,113,249,1);
@@ -236,12 +236,12 @@ body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :ho
236
236
  --semi-color-data-18: rgba(212,88,212,1);
237
237
  --semi-color-data-19: rgba(188,198,255,1);
238
238
  --semi-color-data-20: rgba(121,137,255,1);
239
- --semi-color-border: rgba(var(--semi-grey-5),0.16);
239
+ --semi-color-border: rgba(255,255,255,0.12);
240
240
  --semi-color-danger: rgba(var(--semi-red-4),1);
241
241
  --semi-color-shadow: rgba(var(--semi-grey-0), 0.8);
242
- --semi-color-text-nav: rgba(var(--semi-neutral-9),0.75);
242
+ --semi-color-text-nav: rgba(var(--semi-neutral-9),0.8);
243
243
  --semi-color-app-header: rgba(var(--semi-grey-0),0);
244
- --semi-color-bg-dropdown: rgba(var(--semi-neutral-2), 1);
244
+ --semi-color-bg-dropdown: rgba(var(--semi-grey-2),1);
245
245
  --semi-color-black-10: rgba(0,0,0,0.1);
246
246
  --semi-color-black-20: rgba(0,0,0,0.2);
247
247
  --semi-color-black-30: rgba(0,0,0,0.3);
@@ -251,7 +251,7 @@ body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :ho
251
251
  --semi-color-black-70: rgba(0,0,0,0.7);
252
252
  --semi-color-black-80: rgba(0,0,0,0.8);
253
253
  --semi-color-black-90: rgba(0,0,0,0.9);
254
- --semi-color-text-anti: rgba(var(--semi-neutral-0),1);
254
+ --semi-color-text-anti: rgba(var(--semi-grey-0),1);
255
255
  --semi-color-white-10: rgba(255,255,255,0.1);
256
256
  --semi-color-white-20: rgba(255,255,255,0.2);
257
257
  --semi-color-white-30: rgba(255,255,255,0.3);
@@ -262,97 +262,97 @@ body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :ho
262
262
  --semi-color-white-80: rgba(255,255,255,0.8);
263
263
  --semi-color-white-90: rgba(255,255,255,0.9);
264
264
  --semi-color-default: rgba(var(--semi-grey-0), 1);
265
- --semi-color-info-hover: rgba(var(--semi-brand-3),1);
265
+ --semi-color-info-hover: rgba(var(--semi-brand-3), 1);
266
266
  --semi-color-link-hover: rgba(var(--semi-brand-3),1);
267
267
  --semi-color-primary: rgba(var(--semi-brand-4),1);
268
- --semi-color-success: rgba(var(--semi-green-5),1);
268
+ --semi-color-success: rgba(var(--semi-green-4),1);
269
269
  --semi-color-tab-HoverBg: rgba(var(--semi-grey-2), 1);
270
- --semi-color-warning: rgba(var(--semi-amber-4),1);
271
- --semi-color-app-siderbar: rgba(var(--semi-grey-0), 0);
272
- --semi-color-card-border: rgba(var(--semi-grey-5),0.16);
273
- --semi-color-info-active: rgba(var(--semi-brand-2),1);
270
+ --semi-color-warning: rgba(var(--semi-orange-4),1);
271
+ --semi-color-app-siderbar: rgba(var(--semi-grey-0),0);
272
+ --semi-color-card-border: rgba(255,255,255,0.12);
273
+ --semi-color-info-active: rgba(var(--semi-brand-2), 1);
274
274
  --semi-color-link-active: rgba(var(--semi-brand-2),1);
275
- --semi-color-app-container: rgba(var(--semi-grey-1), 1);
276
- --semi-color-bg-transparent: rgba(var(--semi-neutral-0), 0);
277
- --semi-color-card-HoverBg: rgba(var(--semi-grey-5),0.08);
278
- --semi-color-divider-0: rgba(var(--semi-grey-5),0.22);
279
- --semi-color-divider-1: rgba(var(--semi-grey-5),0.16);
280
- --semi-color-divider-2: rgba(var(--semi-grey-5),0.08);
275
+ --semi-color-app-container: rgba(var(--semi-grey-1),1);
276
+ --semi-color-bg-transparent: rgba(var(--semi-grey-0),0);
277
+ --semi-color-card-HoverBg: rgba(255,255,255,0.06);
278
+ --semi-color-divider-0: rgba(255,255,255,0.2);
279
+ --semi-color-divider-1: rgba(255,255,255,0.12);
280
+ --semi-color-divider-2: rgba(255,255,255,0.08);
281
281
  --semi-color-link-visited: rgba(var(--semi-brand-2),1);
282
282
  --semi-color-photo-toast: rgba(0,0,0,0.9);
283
283
  --semi-color-tab-DefaultBg: rgba(var(--semi-grey-1),1);
284
- --semi-color-tertiary: rgba(var(--semi-grey-5),0.08);
285
- --semi-color-card-ActiveBg: rgba(var(--semi-brand-4),0.12);
284
+ --semi-color-tertiary: rgba(255,255,255,0.08);
285
+ --semi-color-card-ActiveBg: rgba(var(--semi-brand-4),0.2);
286
286
  --semi-color-focus-border: rgba(var(--semi-brand-4),1);
287
- --semi-color-info-disabled: rgba(var(--semi-grey-5),0.16);
287
+ --semi-color-info-disabled: rgba(var(--semi-brand-1),0.16);
288
288
  --semi-color-overlay-bg: rgba(0,0,0,0.6);
289
289
  --semi-color-shadow-anti: rgba(0,0,0,0.7);
290
290
  --semi-color-tab-DisabledBg: rgba(var(--semi-grey-2), 1);
291
291
  --semi-color-tab-SelectedBg: rgba(var(--semi-grey-9), 1);
292
- --semi-color-Scrollbar: rgba(var(--semi-grey-5),0.16);
293
- --semi-color-border-hover: rgba(var(--semi-grey-5),0.22);
294
- --semi-color-border-modal: rgba(var(--semi-grey-5),0.16);
295
- --semi-color-card-DefaultBg: rgba(var(--semi-grey-5),0.05);
292
+ --semi-color-Scrollbar: rgba(255,255,255,0.12);
293
+ --semi-color-border-hover: rgba(255,255,255,0.2);
294
+ --semi-color-border-modal: rgba(255,255,255,0.12);
295
+ --semi-color-card-DefaultBg: rgba(255,255,255,0.05);
296
296
  --semi-color-danger-hover: rgba(var(--semi-red-3),1);
297
297
  --semi-color-highlight: rgba(var(--semi-white),1);
298
- --semi-color-input-HoverBg: rgba(var(--semi-neutral-1),1);
298
+ --semi-color-input-HoverBg: rgba(var(--semi-grey-1), 1);
299
299
  --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
300
300
  --semi-color-table-FocusBg: rgba(var(--semi-brand-4),0.2);
301
301
  --semi-color-table-HoverBg: rgba(var(--semi-grey-5),0.08);
302
- --semi-color-border-active: rgba(var(--semi-grey-5),0.32);
303
- --semi-color-border-select: rgba(var(--semi-grey-5),0.16);
302
+ --semi-color-border-active: rgba(255,255,255,0.24);
303
+ --semi-color-border-select: rgba(255,255,255,0.12);
304
304
  --semi-color-danger-active: rgba(var(--semi-red-2),1);
305
- --semi-color-disabled-bg: rgba(var(--semi-grey-5),0.16);
306
- --semi-color-input-ActiveBg: rgba(var(--semi-neutral-1),1);
305
+ --semi-color-disabled-bg: rgba(var(--semi-grey-2), 1);
306
+ --semi-color-input-ActiveBg: rgba(var(--semi-grey-0),1);
307
307
  --semi-color-table-ActiveBg: rgba(var(--semi-brand-4),0.12);
308
- --semi-color-card-borderHover: rgba(var(--semi-grey-5),0.22);
308
+ --semi-color-card-borderHover: rgba(255,255,255,0.22);
309
309
  --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
310
- --semi-color-input-DefaultBg: rgba(var(--semi-neutral-1),1);
310
+ --semi-color-input-DefaultBg: rgba(var(--semi-grey-1), 1);
311
311
  --semi-color-photo-toastText: rgba(255,255,255,1);
312
312
  --semi-color-primary-hover: rgba(var(--semi-brand-3),1);
313
- --semi-color-success-hover: rgba(var(--semi-green-4),1);
314
- --semi-color-warning-hover: rgba(var(--semi-amber-3),1);
313
+ --semi-color-success-hover: rgba(var(--semi-green-3),1);
314
+ --semi-color-warning-hover: rgba(var(--semi-orange-3),1);
315
315
  --semi-color-Component-bg: rgba(0,0,0,0.6);
316
316
  --semi-color-card-borderActive: rgba(var(--semi-brand-4),1);
317
317
  --semi-color-default-active: rgba(var(--semi-grey-2), 1);
318
- --semi-color-disabled-fill: rgba(var(--semi-neutral-5), 0.16);
319
- --semi-color-disabled-text: rgba(var(--semi-neutral-9),0.25);
318
+ --semi-color-disabled-fill: rgba(var(--semi-grey-8),0.04);
319
+ --semi-color-disabled-text: rgba(255,255,255,0.35);
320
320
  --semi-color-highlight-bg: rgba(var(--semi-yellow-4),1);
321
- --semi-color-input-DisabledBg: rgba(var(--semi-neutral-5),0.16);
321
+ --semi-color-input-DisabledBg: rgba(var(--semi-grey-2),1);
322
322
  --semi-color-primary-active: rgba(var(--semi-brand-2),1);
323
- --semi-color-success-active: rgba(var(--semi-green-3),1);
324
- --semi-color-warning-active: rgba(var(--semi-amber-2),1);
325
- --semi-color-tertiary-hover: rgba(var(--semi-grey-7),0.16);
323
+ --semi-color-success-active: rgba(var(--semi-green-2),1);
324
+ --semi-color-warning-active: rgba(var(--semi-orange-2),1);
325
+ --semi-color-tertiary-hover: rgba(255,255,255,0.16);
326
326
  --semi-color-Component-card: rgba(12,13,13,0.6);
327
- --semi-color-disabled-border: rgba(var(--semi-grey-5),0.16);
327
+ --semi-color-disabled-border: rgba(255,255,255,0.12);
328
328
  --semi-color-primary-disabled: rgba(var(--semi-grey-5),0.16);
329
- --semi-color-success-disabled: rgba(var(--semi-grey-5),0.16);
330
- --semi-color-tertiary-active: rgba(var(--semi-grey-8),0.22);
331
- --semi-color-Scrollbar-hover: rgba(var(--semi-grey-5),0.32);
329
+ --semi-color-success-disabled: rgba(var(--semi-green-1),0.16);
330
+ --semi-color-tertiary-active: rgba(255,255,255,0.24);
331
+ --semi-color-Scrollbar-hover: rgba(255,255,255,0.2);
332
332
  --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
333
333
  --semi-color-overlay-CustomAnti: rgba(0,0,0,0.6);
334
334
  --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
335
335
  --semi-color-info-light-hover: rgba(var(--semi-brand-1),1);
336
- --semi-color-progress-defaultBg: rgba(var(--semi-grey-5),0.16);
336
+ --semi-color-progress-defaultBg: rgba(255,255,255,0.12);
337
337
  --semi-color-fndesktop-navbarBg: rgba(12,13,13,0.6);
338
338
  --semi-color-info-light-active: rgba(var(--semi-brand-2),1);
339
339
  --semi-color-secondary-disabled: rgba(var(--semi-grey-5),0.16);
340
340
  --semi-color-info-light-default: rgba(var(--semi-brand-0),1);
341
341
  --semi-color-overlay-CustomPreview: rgba(0,0,0,0.9);
342
- --semi-color-danger-light-hover: rgba(var(--semi-red-1),1);
343
- --semi-color-danger-light-active: rgba(var(--semi-red-2),1);
342
+ --semi-color-danger-light-hover: rgba(var(--semi-red-0),0.3);
343
+ --semi-color-danger-light-active: rgba(var(--semi-red-0),0.4);
344
344
  --semi-color-fndesktop-navbarBorder: rgba(255,255,255,0.05);
345
- --semi-color-danger-light-default: rgba(var(--semi-red-0),1);
346
- --semi-color-primary-light-hover: rgba(var(--semi-brand-1),1);
347
- --semi-color-success-light-hover: rgba(var(--semi-green-1),1);
348
- --semi-color-warning-light-hover: rgba(var(--semi-amber-1), 1);
349
- --semi-color-primary-light-active: rgba(var(--semi-brand-2),1);
350
- --semi-color-success-light-active: rgba(var(--semi-green-2),1);
351
- --semi-color-warning-light-active: rgba(var(--semi-amber-2), 1);
352
- --semi-color-primary-light-default: rgba(var(--semi-brand-0),1);
353
- --semi-color-success-light-default: rgba(var(--semi-green-0),1);
345
+ --semi-color-danger-light-default: rgba(var(--semi-red-0),0.2);
346
+ --semi-color-primary-light-hover: rgba(var(--semi-brand-1),0.3);
347
+ --semi-color-success-light-hover: rgba(var(--semi-green-1),0.3);
348
+ --semi-color-warning-light-hover: rgba(var(--semi-orange-5),0.3);
349
+ --semi-color-primary-light-active: rgba(var(--semi-brand-5),0.4);
350
+ --semi-color-success-light-active: rgba(var(--semi-green-5),0.4);
351
+ --semi-color-warning-light-active: rgba(var(--semi-orange-5),0.4);
352
+ --semi-color-primary-light-default: rgba(var(--semi-brand-5),0.2);
353
+ --semi-color-success-light-default: rgba(var(--semi-green-5),0.2);
354
354
  --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5),0.16);
355
- --semi-color-warning-light-default: rgba(var(--semi-amber-0), 1);
355
+ --semi-color-warning-light-default: rgba(var(--semi-orange-5),0.2);
356
356
  --semi-color-tertiary-light-active: rgba(var(--semi-grey-5),0.32);
357
357
  --semi-color-CheckboxPhoto-DefaultBg: rgba(255,255,255,0.2);
358
358
  --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1),1);
package/scss/local.scss CHANGED
@@ -8,30 +8,30 @@ $radius-tabs_tab_button: 4px;
8
8
  $color-badge_default-text-default: var(--semi-color-white);
9
9
  $color-badge_primary_light-bg-default: var(--semi-color-primary-light-hover);
10
10
  $color-badge_primary_solid-bg-default: var(--semi-color-danger);
11
- $color-input_danger-bg-focus: var(--semi-color-bg-1);
12
- $color-input_danger-bg-hover: var(--semi-color-bg-1);
13
- $color-input_danger-bg-active: var(--semi-color-bg-1);
14
- $color-input_default-bg-focus: var(--semi-color-bg-1);
15
- $color-input_default-bg-hover: var(--semi-color-bg-1);
16
- $color-input_warning-bg-focus: var(--semi-color-bg-1);
17
- $color-input_warning-bg-hover: var(--semi-color-bg-1);
18
- $color-input_danger-bg-default: var(--semi-color-bg-1);
19
- $color-input_default-bg-active: var(--semi-color-bg-1);
20
- $color-input_warning-bg-active: var(--semi-color-bg-1);
21
- $color-input_default-bg-default: var(--semi-color-bg-1);
22
- $color-input_warning-bg-default: var(--semi-color-bg-1);
23
- $color-input_danger-border-focus: var(--semi-color-danger-active);
24
- $color-input_danger-border-hover: var(--semi-color-danger-hover);
11
+ $color-input_danger-bg-focus: var(--semi-color-danger-light-default);
12
+ $color-input_danger-bg-hover: var(--semi-color-danger-light-hover);
13
+ $color-input_danger-bg-active: var(--semi-color-danger-light-active);
14
+ $color-input_default-bg-focus: var(--semi-color-input-ActiveBg);
15
+ $color-input_default-bg-hover: var(--semi-color-input-HoverBg);
16
+ $color-input_warning-bg-focus: var(--semi-color-warning-light-default);
17
+ $color-input_warning-bg-hover: var(--semi-color-warning-light-hover);
18
+ $color-input_danger-bg-default: var(--semi-color-danger-light-default);
19
+ $color-input_default-bg-active: var(--semi-color-input-ActiveBg);
20
+ $color-input_warning-bg-active: var(--semi-color-warning-light-active);
21
+ $color-input_default-bg-default: var(--semi-color-input-DefaultBg);
22
+ $color-input_warning-bg-default: var(--semi-color-warning-light-default);
23
+ $color-input_danger-border-focus: var(--semi-color-danger);
24
+ $color-input_danger-border-hover: var(--semi-color-danger-light-hover);
25
25
  $color-input_disabled-bg-default: var(--semi-color-disabled-bg);
26
26
  $color-input_counter-text-default: var(--semi-color-text-3);
27
27
  $color-input_default-border-focus: var(--semi-color-focus-border);
28
28
  $color-input_default-border-hover: var(--semi-color-border-hover);
29
- $color-input_warning-border-focus: var(--semi-color-warning-active);
30
- $color-input_warning-border-hover: var(--semi-color-warning-hover);
31
- $color-input_danger-border-default: var(--semi-color-danger);
32
- $color-input_default-bg-focus-hover: var(--semi-color-bg-1);
29
+ $color-input_warning-border-focus: var(--semi-color-warning);
30
+ $color-input_warning-border-hover: var(--semi-color-warning-light-hover);
31
+ $color-input_danger-border-default: var(--semi-color-danger-light-default);
32
+ $color-input_default-bg-focus-hover: var(--semi-color-input-HoverBg);
33
33
  $color-input_default-border-default: var(--semi-color-border);
34
- $color-input_warning-border-default: var(--semi-color-warning);
34
+ $color-input_warning-border-default: var(--semi-color-warning-light-default);
35
35
  $color-inputNumber_button-bg-disabled: var(--semi-color-disabled-bg);
36
36
  $color-input_placeholder-text-default: var(--semi-color-text-3);
37
37
  $height-input_large: 40px;
@@ -45,16 +45,19 @@ $color-modal_content-border: var(--semi-color-border-modal);
45
45
  $color-radio_default-bg-default: var(--semi-color-bg-1);
46
46
  $color-radio_checked-bg-disabled: var(--semi-color-disabled-bg);
47
47
  $color-radio_disabled-bg-default: var(--semi-color-disabled-bg);
48
- $color-radio_default-border-default: var(--semi-color-border);
48
+ $color-radio_default-border-default: var(--semi-color-text-3);
49
49
  $color-radio_checked-border-disabled: var(--semi-color-disabled-border);
50
50
  $color-radio_default-border-disabled: var(--semi-color-disabled-border);
51
+ $color-radio_addon_buttonRadio-bg-checked: var(--semi-color-primary);
52
+ $color-radio_addon_buttonRadio-text-checked: var(--semi-color-text-0);
51
53
  $color-table-border-default: var(--semi-color-divider-2);
52
54
  $color-table_th-border-default: var(--semi-color-divider-1);
53
55
  $color-table_shadow-border-default: var(--semi-color-divider-1);
54
56
  $width-table_header_border: 1px;
55
- $color-button_light-bg-hover: var(--semi-color-tertiary-light-hover);
56
- $color-button_light-bg-active: var(--semi-color-tertiary-light-active);
57
- $color-button_light-bg-default: var(--semi-color-tertiary-light-default);
57
+ $color-banner_warning-border-default: var(--semi-color-warning);
58
+ $color-button_light-bg-hover: var(--semi-color-fill-2);
59
+ $color-button_light-bg-active: var(--semi-color-fill-3);
60
+ $color-button_light-bg-default: var(--semi-color-fill-1);
58
61
  $color-button_primary-bg-hover: var(--semi-color-primary-hover);
59
62
  $color-button_tertiary-bg-hover: var(--semi-color-tertiary-hover);
60
63
  $color-button_light-border-hover: var(--semi-color-bg-transparent);
@@ -100,32 +103,34 @@ $spacing-button_large-paddingBottom: 14px;
100
103
  $spacing-button_small-paddingBottom: 0px;
101
104
  $spacing-button_default-paddingRight: 16px;
102
105
  $color-rating-bg-default: var(--semi-color-fill-2);
103
- $color-select-bg-focus: var(--semi-color-input-ActiveBg);
106
+ $color-rating-icon-default: var(--semi-color-highlight-bg);
107
+ $color-select-bg-focus: var(--semi-color-fill-0);
104
108
  $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);
107
- $color-select-border-focus: var(--semi-color-border);
109
+ $color-select-bg-active: var(--semi-color-fill-2);
110
+ $color-select-bg-default: var(--semi-color-fill-0);
111
+ $color-select-border-focus: var(--semi-color-focus-border);
108
112
  $color-select-border-hover: var(--semi-color-border-hover);
109
- $color-select-border-active: var(--semi-color-info-active);
113
+ $color-select-border-active: var(--semi-color-focus-border);
110
114
  $color-select-border-default: var(--semi-color-border);
111
- $color-select_danger-bg-focus: var(--semi-color-bg-1);
112
- $color-select_danger-bg-hover: var(--semi-color-bg-1);
113
- $color-select_option-bg-hover: var(--semi-color-input-HoverBg);
114
- $color-select_danger-bg-active: var(--semi-color-bg-1);
115
- $color-select_option-bg-active: var(--semi-color-input-ActiveBg);
116
- $color-select_warning-bg-focus: var(--semi-color-bg-1);
117
- $color-select_warning-bg-hover: var(--semi-color-bg-1);
118
- $color-select_danger-bg-default: var(--semi-color-bg-1);
115
+ $color-select_danger-bg-focus: var(--semi-color-danger-light-default);
116
+ $color-select_danger-bg-hover: var(--semi-color-danger-light-hover);
117
+ $color-select_option-bg-hover: var(--semi-color-fill-0);
118
+ $color-select_danger-bg-active: var(--semi-color-danger-light-active);
119
+ $color-select_option-bg-active: var(--semi-color-fill-1);
120
+ $color-select_warning-bg-focus: var(--semi-color-warning-light-default);
121
+ $color-select_warning-bg-hover: var(--semi-color-warning-light-hover);
122
+ $color-select_danger-bg-default: var(--semi-color-danger-light-default);
119
123
  $color-select_input_disabled-bg: var(--semi-color-disabled-bg);
120
- $color-select_warning-bg-active: var(--semi-color-bg-1);
121
- $color-select_warning-bg-default: var(--semi-color-bg-1);
122
- $color-select_danger-border-hover: var(--semi-color-danger-hover);
123
- $color-select_danger-border-active: var(--semi-color-danger-active);
124
- $color-select_warning-border-hover: var(--semi-color-warning-hover);
125
- $color-select_danger-border-default: var(--semi-color-danger);
126
- $color-select_warning-border-active: var(--semi-color-warning-active);
124
+ $color-select_warning-bg-active: var(--semi-color-warning-light-active);
125
+ $color-select_warning-bg-default: var(--semi-color-warning-light-default);
126
+ $color-select_danger-border-focus: var(--semi-color-danger);
127
+ $color-select_danger-border-hover: var(--semi-color-danger-light-hover);
128
+ $color-select_danger-border-active: var(--semi-color-danger-light-active);
129
+ $color-select_warning-border-hover: var(--semi-color-warning-light-hover);
130
+ $color-select_danger-border-default: var(--semi-color-danger-light-default);
131
+ $color-select_warning-border-active: var(--semi-color-warning-light-active);
127
132
  $color-select_input_placeholder-text: var(--semi-color-text-2);
128
- $color-select_warning-border-default: var(--semi-color-warning);
133
+ $color-select_warning-border-default: var(--semi-color-warning-light-default);
129
134
  $color-select_input_disabled-border-focus: var(--semi-color-disabled-border);
130
135
  $height-select_small: 28px;
131
136
  $height-select_default: 36px;
@@ -146,17 +151,17 @@ $color-cascader_default-border-hover: var(--semi-color-border-hover);
146
151
  $color-cascader_default-border-default: var(--semi-color-border);
147
152
  $height-cascader_default: 36px;
148
153
  $radius-cascader: 8px;
149
- $color-checkbox_checked-icon-hover: var(--semi-color-bg-1);
150
- $color-checkbox_default-bg-default: var(--semi-color-bg-1);
154
+ $color-checkbox_checked-icon-hover: var(--semi-color-white);
155
+ $color-checkbox_default-bg-default: var(--semi-color-bg-transparent);
151
156
  $color-checkbox_extra-text-default: var(--semi-color-text-1);
152
157
  $color-checkbox_checked-bg-disabled: var(--semi-color-disabled-bg);
153
- $color-checkbox_checked-icon-active: var(--semi-color-bg-1);
154
- $color-checkbox_checked-icon-default: var(--semi-color-bg-1);
158
+ $color-checkbox_checked-icon-active: var(--semi-color-white);
159
+ $color-checkbox_checked-icon-default: var(--semi-color-white);
155
160
  $color-checkbox_checked-icon-disabled: var(--semi-color-disabled-text);
156
- $color-checkbox_default-border-default: var(--semi-color-border);
157
- $color-checkbox_cardType_inner-bg-hover: var(--semi-color-bg-1);
161
+ $color-checkbox_default-border-default: var(--semi-color-text-3);
162
+ $color-checkbox_cardType_inner-bg-hover: var(--semi-color-white);
158
163
  $color-checkbox_disabled-border-default: var(--semi-color-disabled-border);
159
- $color-checkbox_cardType_inner-bg-active: var(--semi-color-bg-1);
164
+ $color-checkbox_cardType_inner-bg-active: var(--semi-color-white);
160
165
  $radius-checkbox_inner: 4px;
161
166
  $color-dropdown-bg-default: var(--semi-color-bg-dropdown);
162
167
  $color-dropdown_seperator-bg-default: var(--semi-color-divider-1);
@@ -170,12 +175,12 @@ $color-tagInput-border-hover: var(--semi-color-border-hover);
170
175
  $color-tagInput-border-default: var(--semi-color-border);
171
176
  $color-tagInput_danger-bg-focus: var(--semi-color-bg-transparent);
172
177
  $color-tagInput_danger-bg-hover: var(--semi-color-bg-transparent);
173
- $color-tagInput_default-bg-focus: var(--semi-color-bg-transparent);
174
- $color-tagInput_default-bg-hover: var(--semi-color-bg-transparent);
178
+ $color-tagInput_default-bg-focus: var(--semi-color-input-ActiveBg);
179
+ $color-tagInput_default-bg-hover: var(--semi-color-fill-1);
175
180
  $color-tagInput_warning-bg-focus: var(--semi-color-border-hover);
176
181
  $color-tagInput_warning-bg-hover: var(--semi-color-bg-transparent);
177
182
  $color-tagInput_danger-bg-default: var(--semi-color-bg-transparent);
178
- $color-tagInput_default-bg-default: var(--semi-color-bg-transparent);
183
+ $color-tagInput_default-bg-default: var(--semi-color-input-DefaultBg);
179
184
  $color-tagInput_warning-bg-default: var(--semi-color-bg-transparent);
180
185
  $color-tagInput_danger-border-hover: var(--semi-color-danger-hover);
181
186
  $color-tagInput_warning-border-focus: var(--semi-color-warning);