@aifuxi/semi-theme-default 1.1.2 → 2.0.0

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 (92) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/README.md +11 -2
  3. package/dist/SBOM.spdx.json +4 -4
  4. package/dist/ai-chat-dialogue.css +2 -4911
  5. package/dist/ai-chat-input.css +1 -3363
  6. package/dist/anchor.css +1 -1517
  7. package/dist/audio-player.css +1 -699
  8. package/dist/auto-complete.css +1 -1913
  9. package/dist/avatar.css +1 -780
  10. package/dist/back-top.css +1 -1462
  11. package/dist/badge.css +1 -699
  12. package/dist/banner.css +1 -1775
  13. package/dist/base.css +737 -0
  14. package/dist/breadcrumb.css +1 -1554
  15. package/dist/button.css +1 -949
  16. package/dist/calendar.css +1 -1669
  17. package/dist/card.css +1 -1644
  18. package/dist/carousel.css +1 -780
  19. package/dist/cascader.css +1 -3154
  20. package/dist/chat.css +1 -4510
  21. package/dist/checkbox.css +1 -743
  22. package/dist/code-highlight.css +1 -699
  23. package/dist/collapse.css +1 -740
  24. package/dist/collapsible.css +1 -736
  25. package/dist/color-picker.css +1 -3739
  26. package/dist/config-provider.css +1 -698
  27. package/dist/cropper.css +1 -699
  28. package/dist/date-picker.css +2 -2824
  29. package/dist/descriptions.css +1 -736
  30. package/dist/divider.css +1 -699
  31. package/dist/drag-move.css +1 -698
  32. package/dist/dropdown.css +1 -1008
  33. package/dist/empty.css +1 -1050
  34. package/dist/feedback.css +1 -3957
  35. package/dist/float-button.css +2 -873
  36. package/dist/form.css +212 -15984
  37. package/dist/grid.css +1 -699
  38. package/dist/highlight.css +1 -699
  39. package/dist/hot-keys.css +1 -699
  40. package/dist/icon-button.css +1 -1293
  41. package/dist/icon.css +1 -736
  42. package/dist/image.css +1 -1512
  43. package/dist/index.css +2 -1
  44. package/dist/input-number.css +1 -1391
  45. package/dist/input.css +1 -1331
  46. package/dist/json-viewer.css +2 -1904
  47. package/dist/layout.css +1 -699
  48. package/dist/list.css +1 -6143
  49. package/dist/locale.css +1 -698
  50. package/dist/lottie.css +1 -698
  51. package/dist/markdown-render.css +1 -2331
  52. package/dist/modal.css +1 -1825
  53. package/dist/navigation.css +2 -1826
  54. package/dist/notification.css +1 -1424
  55. package/dist/overflow-list.css +1 -699
  56. package/dist/pagination.css +1 -3226
  57. package/dist/pin-code.css +1 -1347
  58. package/dist/popconfirm.css +1 -1669
  59. package/dist/popover.css +1 -964
  60. package/dist/progress.css +1 -736
  61. package/dist/radio.css +1 -743
  62. package/dist/rating.css +1 -743
  63. package/dist/resizable.css +1 -743
  64. package/dist/scroll-list.css +1 -736
  65. package/dist/select.css +1 -2516
  66. package/dist/shared/foundation-input-textarea.css +304 -0
  67. package/dist/shared/foundation-portal-portal.css +15 -0
  68. package/dist/side-sheet.css +1 -1474
  69. package/dist/sidebar.css +1 -3661
  70. package/dist/skeleton.css +1 -736
  71. package/dist/slider.css +1 -964
  72. package/dist/space.css +1 -699
  73. package/dist/spin.css +1 -699
  74. package/dist/steps.css +1 -6118
  75. package/dist/style-dependencies.json +1647 -0
  76. package/dist/switch.css +1 -805
  77. package/dist/table.css +1 -4365
  78. package/dist/tabs.css +1 -1674
  79. package/dist/tag-input.css +1 -2784
  80. package/dist/tag.css +1 -1902
  81. package/dist/time-picker.css +1 -2035
  82. package/dist/timeline.css +1 -699
  83. package/dist/toast.css +1 -1424
  84. package/dist/tooltip.css +1 -749
  85. package/dist/transfer.css +1 -3256
  86. package/dist/tree-select.css +1 -3602
  87. package/dist/tree.css +1 -1852
  88. package/dist/typography.css +1 -1166
  89. package/dist/upload.css +1 -2592
  90. package/dist/user-guide.css +1 -2272
  91. package/dist/video-player.css +1 -885
  92. package/package.json +5 -3
@@ -1,4872 +1,7 @@
1
+ @charset "UTF-8";
1
2
  /* shadow */
2
3
  /* sizing */
3
4
  /* spacing */
4
- body, body .semi-always-light, :host, :host .semi-always-light {
5
- --semi-amber-0: 254,251,235;
6
- --semi-amber-1: 252,245,206;
7
- --semi-amber-2: 249,232,158;
8
- --semi-amber-3: 246,216,111;
9
- --semi-amber-4: 243,198,65;
10
- --semi-amber-5: 240,177,20;
11
- --semi-amber-6: 200,138,15;
12
- --semi-amber-7: 160,102,10;
13
- --semi-amber-8: 120,70,6;
14
- --semi-amber-9: 80,43,3;
15
- --semi-black: 0,0,0;
16
- --semi-blue-0: 234,245,255;
17
- --semi-blue-1: 203,231,254;
18
- --semi-blue-2: 152,205,253;
19
- --semi-blue-3: 101,178,252;
20
- --semi-blue-4: 50,149,251;
21
- --semi-blue-5: 0,100,250;
22
- --semi-blue-6: 0,98,214;
23
- --semi-blue-7: 0,79,179;
24
- --semi-blue-8: 0,61,143;
25
- --semi-blue-9: 0,44,107;
26
- --semi-cyan-0: 229,247,248;
27
- --semi-cyan-1: 194,239,240;
28
- --semi-cyan-2: 138,221,226;
29
- --semi-cyan-3: 88,203,211;
30
- --semi-cyan-4: 44,184,197;
31
- --semi-cyan-5: 5,164,182;
32
- --semi-cyan-6: 3,134,152;
33
- --semi-cyan-7: 1,105,121;
34
- --semi-cyan-8: 0,77,91;
35
- --semi-cyan-9: 0,50,61;
36
- --semi-green-0: 236,247,236;
37
- --semi-green-1: 208,240,209;
38
- --semi-green-2: 164,224,167;
39
- --semi-green-3: 125,209,130;
40
- --semi-green-4: 90,194,98;
41
- --semi-green-5: 59,179,70;
42
- --semi-green-6: 48,149,59;
43
- --semi-green-7: 37,119,47;
44
- --semi-green-8: 27,89,36;
45
- --semi-green-9: 17,60,24;
46
- --semi-grey-0: 249,249,249;
47
- --semi-grey-1: 230,232,234;
48
- --semi-grey-2: 198,202,205;
49
- --semi-grey-3: 167,171,176;
50
- --semi-grey-4: 136,141,146;
51
- --semi-grey-5: 107,112,117;
52
- --semi-grey-6: 85,91,97;
53
- --semi-grey-7: 65,70,76;
54
- --semi-grey-8: 46,50,56;
55
- --semi-grey-9: 28,31,35;
56
- --semi-indigo-0: 236,239,248;
57
- --semi-indigo-1: 209,216,240;
58
- --semi-indigo-2: 167,179,225;
59
- --semi-indigo-3: 128,144,211;
60
- --semi-indigo-4: 94,111,196;
61
- --semi-indigo-5: 63,81,181;
62
- --semi-indigo-6: 51,66,161;
63
- --semi-indigo-7: 40,52,140;
64
- --semi-indigo-8: 31,40,120;
65
- --semi-indigo-9: 23,29,99;
66
- --semi-light-blue-0: 233,247,253;
67
- --semi-light-blue-1: 201,236,252;
68
- --semi-light-blue-2: 149,216,248;
69
- --semi-light-blue-3: 98,195,245;
70
- --semi-light-blue-4: 48,172,241;
71
- --semi-light-blue-5: 0,149,238;
72
- --semi-light-blue-6: 0,123,202;
73
- --semi-light-blue-7: 0,99,167;
74
- --semi-light-blue-8: 0,75,131;
75
- --semi-light-blue-9: 0,53,95;
76
- --semi-light-green-0: 243,248,236;
77
- --semi-light-green-1: 227,240,208;
78
- --semi-light-green-2: 200,226,165;
79
- --semi-light-green-3: 173,211,126;
80
- --semi-light-green-4: 147,197,91;
81
- --semi-light-green-5: 123,182,60;
82
- --semi-light-green-6: 100,152,48;
83
- --semi-light-green-7: 78,121,38;
84
- --semi-light-green-8: 57,91,27;
85
- --semi-light-green-9: 37,61,18;
86
- --semi-lime-0: 242,250,230;
87
- --semi-lime-1: 227,246,197;
88
- --semi-lime-2: 203,237,142;
89
- --semi-lime-3: 183,227,91;
90
- --semi-lime-4: 167,218,44;
91
- --semi-lime-5: 155,209,0;
92
- --semi-lime-6: 126,174,0;
93
- --semi-lime-7: 99,139,0;
94
- --semi-lime-8: 72,104,0;
95
- --semi-lime-9: 47,70,0;
96
- --semi-orange-0: 255,248,234;
97
- --semi-orange-1: 254,238,204;
98
- --semi-orange-2: 254,217,152;
99
- --semi-orange-3: 253,193,101;
100
- --semi-orange-4: 253,166,51;
101
- --semi-orange-5: 252,136,0;
102
- --semi-orange-6: 210,103,0;
103
- --semi-orange-7: 168,74,0;
104
- --semi-orange-8: 126,49,0;
105
- --semi-orange-9: 84,29,0;
106
- --semi-pink-0: 253,236,239;
107
- --semi-pink-1: 251,207,216;
108
- --semi-pink-2: 246,160,181;
109
- --semi-pink-3: 242,115,150;
110
- --semi-pink-4: 237,72,123;
111
- --semi-pink-5: 233,30,99;
112
- --semi-pink-6: 197,19,86;
113
- --semi-pink-7: 162,11,72;
114
- --semi-pink-8: 126,5,58;
115
- --semi-pink-9: 90,1,43;
116
- --semi-purple-0: 247,233,247;
117
- --semi-purple-1: 239,202,240;
118
- --semi-purple-2: 221,155,224;
119
- --semi-purple-3: 201,111,209;
120
- --semi-purple-4: 180,73,194;
121
- --semi-purple-5: 158,40,179;
122
- --semi-purple-6: 135,30,158;
123
- --semi-purple-7: 113,22,138;
124
- --semi-purple-8: 92,15,117;
125
- --semi-purple-9: 73,10,97;
126
- --semi-red-0: 254,242,237;
127
- --semi-red-1: 254,221,210;
128
- --semi-red-2: 253,183,165;
129
- --semi-red-3: 251,144,120;
130
- --semi-red-4: 250,102,76;
131
- --semi-red-5: 249,57,32;
132
- --semi-red-6: 213,37,21;
133
- --semi-red-7: 178,20,12;
134
- --semi-red-8: 142,8,5;
135
- --semi-red-9: 106,1,3;
136
- --semi-teal-0: 228,247,244;
137
- --semi-teal-1: 192,240,232;
138
- --semi-teal-2: 135,224,211;
139
- --semi-teal-3: 84,209,193;
140
- --semi-teal-4: 39,194,176;
141
- --semi-teal-5: 0,179,161;
142
- --semi-teal-6: 0,149,137;
143
- --semi-teal-7: 0,119,111;
144
- --semi-teal-8: 0,89,85;
145
- --semi-teal-9: 0,60,58;
146
- --semi-violet-0: 243,237,249;
147
- --semi-violet-1: 226,209,244;
148
- --semi-violet-2: 196,167,233;
149
- --semi-violet-3: 166,127,221;
150
- --semi-violet-4: 136,91,210;
151
- --semi-violet-5: 106,58,199;
152
- --semi-violet-6: 87,47,179;
153
- --semi-violet-7: 70,37,158;
154
- --semi-violet-8: 54,28,138;
155
- --semi-violet-9: 40,20,117;
156
- --semi-white: 255,255,255;
157
- --semi-yellow-0: 255,253,234;
158
- --semi-yellow-1: 254,251,203;
159
- --semi-yellow-2: 253,243,152;
160
- --semi-yellow-3: 252,232,101;
161
- --semi-yellow-4: 251,218,50;
162
- --semi-yellow-5: 250,200,0;
163
- --semi-yellow-6: 208,170,0;
164
- --semi-yellow-7: 167,139,0;
165
- --semi-yellow-8: 125,106,0;
166
- --semi-yellow-9: 83,72,0;
167
- --semi-ai-purple-0: 248,237,255;
168
- --semi-ai-purple-1: 242,218,255;
169
- --semi-ai-purple-2: 227,181,255;
170
- --semi-ai-purple-3: 209,145,255;
171
- --semi-ai-purple-4: 189,108,255;
172
- --semi-ai-purple-5: 166,71,255;
173
- --semi-ai-purple-6: 134,54,219;
174
- --semi-ai-purple-7: 105,40,184;
175
- --semi-ai-purple-8: 78,28,148;
176
- --semi-ai-purple-9: 54,18,112;
177
- --semi-ai-general-0-3: 239,247,255;
178
- --semi-ai-general-0-2: 244,244,255;
179
- --semi-ai-general-0-1: 248,237,255;
180
- --semi-ai-general-0-0: 255,242,255;
181
- --semi-ai-general-1-3: 213,235,255;
182
- --semi-ai-general-1-2: 223,224,255;
183
- --semi-ai-general-1-1: 242,218,255;
184
- --semi-ai-general-1-0: 255,218,254;
185
- --semi-ai-general-2-3: 171,213,255;
186
- --semi-ai-general-2-2: 193,192,255;
187
- --semi-ai-general-2-1: 227,181,255;
188
- --semi-ai-general-2-0: 254,181,255;
189
- --semi-ai-general-3-3: 130,190,255;
190
- --semi-ai-general-3-2: 163,160,255;
191
- --semi-ai-general-3-1: 209,145,255;
192
- --semi-ai-general-3-0: 249,143,255;
193
- --semi-ai-general-4-3: 88,166,255;
194
- --semi-ai-general-4-2: 134,129,255;
195
- --semi-ai-general-4-1: 189,108,255;
196
- --semi-ai-general-4-0: 242,106,255;
197
- --semi-ai-general-5-3: 46,140,255;
198
- --semi-ai-general-5-2: 107,97,255;
199
- --semi-ai-general-5-1: 166,71,255;
200
- --semi-ai-general-5-0: 233,69,255;
201
- --semi-ai-general-6-3: 33,114,219;
202
- --semi-ai-general-6-2: 88,77,219;
203
- --semi-ai-general-6-1: 134,54,219;
204
- --semi-ai-general-6-0: 194,53,219;
205
- --semi-ai-general-7-3: 22,89,184;
206
- --semi-ai-general-7-2: 71,59,184;
207
- --semi-ai-general-7-1: 105,40,184;
208
- --semi-ai-general-7-0: 157,39,184;
209
- --semi-ai-general-8-3: 13,67,148;
210
- --semi-ai-general-8-2: 55,43,148;
211
- --semi-ai-general-8-1: 78,28,148;
212
- --semi-ai-general-8-0: 121,27,148;
213
- --semi-ai-general-9-3: 7,47,112;
214
- --semi-ai-general-9-2: 40,29,112;
215
- --semi-ai-general-9-1: 54,18,112;
216
- --semi-ai-general-9-0: 88,17,112;
217
- --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0)) 0%, rgba(var(--semi-ai-general-0-1)) 30%, rgba(var(--semi-ai-general-0-2)) 60%, rgba(var(--semi-ai-general-0-3)) 100%);
218
- --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0)) 0%, rgba(var(--semi-ai-general-1-1)) 30%, rgba(var(--semi-ai-general-1-2)) 60%, rgba(var(--semi-ai-general-1-3)) 100%);
219
- --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0)) 0%, rgba(var(--semi-ai-general-2-1)) 30%, rgba(var(--semi-ai-general-2-2)) 60%, rgba(var(--semi-ai-general-2-3)) 100%);
220
- --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0)) 0%, rgba(var(--semi-ai-general-3-1)) 30%, rgba(var(--semi-ai-general-3-2)) 60%, rgba(var(--semi-ai-general-3-3)) 100%);
221
- --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0)) 0%, rgba(var(--semi-ai-general-4-1)) 30%, rgba(var(--semi-ai-general-4-2)) 60%, rgba(var(--semi-ai-general-4-3)) 100%);
222
- --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0)) 0%, rgba(var(--semi-ai-general-5-1)) 30%, rgba(var(--semi-ai-general-5-2)) 60%, rgba(var(--semi-ai-general-5-3)) 100%);
223
- --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0)) 0%, rgba(var(--semi-ai-general-6-1)) 30%, rgba(var(--semi-ai-general-6-2)) 60%, rgba(var(--semi-ai-general-6-3)) 100%);
224
- --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0)) 0%, rgba(var(--semi-ai-general-7-1)) 30%, rgba(var(--semi-ai-general-7-2)) 60%, rgba(var(--semi-ai-general-7-3)) 100%);
225
- --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0)) 0%, rgba(var(--semi-ai-general-8-1)) 30%, rgba(var(--semi-ai-general-8-2)) 60%, rgba(var(--semi-ai-general-8-3)) 100%);
226
- --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0)) 0%, rgba(var(--semi-ai-general-9-1)) 30%, rgba(var(--semi-ai-general-9-2)) 60%, rgba(var(--semi-ai-general-9-3)) 100%);
227
- }
228
-
229
- body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
230
- --semi-red-0: 108,9,11;
231
- --semi-red-1: 144,17,16;
232
- --semi-red-2: 180,32,25;
233
- --semi-red-3: 215,51,36;
234
- --semi-red-4: 251,73,50;
235
- --semi-red-5: 252,114,90;
236
- --semi-red-6: 253,153,131;
237
- --semi-red-7: 253,190,172;
238
- --semi-red-8: 254,224,213;
239
- --semi-red-9: 255,243,239;
240
- --semi-pink-0: 92,7,48;
241
- --semi-pink-1: 128,14,65;
242
- --semi-pink-2: 164,23,81;
243
- --semi-pink-3: 199,34,97;
244
- --semi-pink-4: 235,47,113;
245
- --semi-pink-5: 239,86,134;
246
- --semi-pink-6: 243,126,159;
247
- --semi-pink-7: 247,168,188;
248
- --semi-pink-8: 251,211,220;
249
- --semi-pink-9: 253,238,241;
250
- --semi-purple-0: 74,16,97;
251
- --semi-purple-1: 94,23,118;
252
- --semi-purple-2: 115,31,138;
253
- --semi-purple-3: 137,40,159;
254
- --semi-purple-4: 160,51,179;
255
- --semi-purple-5: 181,83,194;
256
- --semi-purple-6: 202,120,209;
257
- --semi-purple-7: 221,160,225;
258
- --semi-purple-8: 239,206,240;
259
- --semi-purple-9: 247,235,247;
260
- --semi-violet-0: 64,27,119;
261
- --semi-violet-1: 76,36,140;
262
- --semi-violet-2: 88,46,160;
263
- --semi-violet-3: 100,57,181;
264
- --semi-violet-4: 114,70,201;
265
- --semi-violet-5: 136,101,212;
266
- --semi-violet-6: 162,136,223;
267
- --semi-violet-7: 190,173,233;
268
- --semi-violet-8: 221,212,244;
269
- --semi-violet-9: 241,238,250;
270
- --semi-indigo-0: 23,30,101;
271
- --semi-indigo-1: 32,41,122;
272
- --semi-indigo-2: 41,54,142;
273
- --semi-indigo-3: 52,68,163;
274
- --semi-indigo-4: 64,83,183;
275
- --semi-indigo-5: 95,113,197;
276
- --semi-indigo-6: 129,145,212;
277
- --semi-indigo-7: 167,180,226;
278
- --semi-indigo-8: 209,216,241;
279
- --semi-indigo-9: 237,239,248;
280
- --semi-blue-0: 5,49,112;
281
- --semi-blue-1: 10,70,148;
282
- --semi-blue-2: 19,92,184;
283
- --semi-blue-3: 29,117,219;
284
- --semi-blue-4: 41,144,255;
285
- --semi-blue-5: 84,169,255;
286
- --semi-blue-6: 127,193,255;
287
- --semi-blue-7: 169,215,255;
288
- --semi-blue-8: 212,236,255;
289
- --semi-blue-9: 239,248,255;
290
- --semi-light-blue-0: 0,55,97;
291
- --semi-light-blue-1: 0,77,133;
292
- --semi-light-blue-2: 3,102,169;
293
- --semi-light-blue-3: 10,129,204;
294
- --semi-light-blue-4: 19,159,240;
295
- --semi-light-blue-5: 64,180,243;
296
- --semi-light-blue-6: 110,200,246;
297
- --semi-light-blue-7: 157,220,249;
298
- --semi-light-blue-8: 206,238,252;
299
- --semi-light-blue-9: 235,248,254;
300
- --semi-cyan-0: 4,52,61;
301
- --semi-cyan-1: 7,79,92;
302
- --semi-cyan-2: 10,108,123;
303
- --semi-cyan-3: 14,137,153;
304
- --semi-cyan-4: 19,168,184;
305
- --semi-cyan-5: 56,187,198;
306
- --semi-cyan-6: 98,205,212;
307
- --semi-cyan-7: 145,223,227;
308
- --semi-cyan-8: 198,239,241;
309
- --semi-cyan-9: 231,247,248;
310
- --semi-teal-0: 2,60,57;
311
- --semi-teal-1: 4,90,85;
312
- --semi-teal-2: 7,119,111;
313
- --semi-teal-3: 10,149,136;
314
- --semi-teal-4: 14,179,161;
315
- --semi-teal-5: 51,194,176;
316
- --semi-teal-6: 94,209,193;
317
- --semi-teal-7: 142,225,211;
318
- --semi-teal-8: 196,240,232;
319
- --semi-teal-9: 230,247,244;
320
- --semi-green-0: 18,60,25;
321
- --semi-green-1: 28,90,37;
322
- --semi-green-2: 39,119,49;
323
- --semi-green-3: 50,149,61;
324
- --semi-green-4: 62,179,73;
325
- --semi-green-5: 93,194,100;
326
- --semi-green-6: 127,209,132;
327
- --semi-green-7: 166,225,168;
328
- --semi-green-8: 208,240,209;
329
- --semi-green-9: 236,247,236;
330
- --semi-light-green-0: 38,61,19;
331
- --semi-light-green-1: 59,92,29;
332
- --semi-light-green-2: 81,123,40;
333
- --semi-light-green-3: 103,153,52;
334
- --semi-light-green-4: 127,184,64;
335
- --semi-light-green-5: 151,198,95;
336
- --semi-light-green-6: 176,212,129;
337
- --semi-light-green-7: 201,227,167;
338
- --semi-light-green-8: 228,241,209;
339
- --semi-light-green-9: 243,248,237;
340
- --semi-lime-0: 49,70,3;
341
- --semi-lime-1: 75,105,5;
342
- --semi-lime-2: 103,141,9;
343
- --semi-lime-3: 132,176,12;
344
- --semi-lime-4: 162,211,17;
345
- --semi-lime-5: 174,220,58;
346
- --semi-lime-6: 189,229,102;
347
- --semi-lime-7: 207,237,150;
348
- --semi-lime-8: 229,246,201;
349
- --semi-lime-9: 243,251,233;
350
- --semi-yellow-0: 84,73,3;
351
- --semi-yellow-1: 126,108,6;
352
- --semi-yellow-2: 168,142,10;
353
- --semi-yellow-3: 210,175,15;
354
- --semi-yellow-4: 252,206,20;
355
- --semi-yellow-5: 253,222,67;
356
- --semi-yellow-6: 253,235,113;
357
- --semi-yellow-7: 254,245,160;
358
- --semi-yellow-8: 254,251,208;
359
- --semi-yellow-9: 255,254,236;
360
- --semi-amber-0: 81,46,9;
361
- --semi-amber-1: 121,75,15;
362
- --semi-amber-2: 161,107,22;
363
- --semi-amber-3: 202,143,30;
364
- --semi-amber-4: 242,183,38;
365
- --semi-amber-5: 245,202,80;
366
- --semi-amber-6: 247,219,122;
367
- --semi-amber-7: 250,234,166;
368
- --semi-amber-8: 252,246,210;
369
- --semi-amber-9: 254,251,237;
370
- --semi-orange-0: 85,31,3;
371
- --semi-orange-1: 128,53,6;
372
- --semi-orange-2: 170,80,10;
373
- --semi-orange-3: 213,111,15;
374
- --semi-orange-4: 255,146,20;
375
- --semi-orange-5: 255,174,67;
376
- --semi-orange-6: 255,199,114;
377
- --semi-orange-7: 255,221,161;
378
- --semi-orange-8: 255,239,208;
379
- --semi-orange-9: 255,249,237;
380
- --semi-grey-0: 28,31,35;
381
- --semi-grey-1: 46,50,56;
382
- --semi-grey-2: 65,70,76;
383
- --semi-grey-3: 85,91,97;
384
- --semi-grey-4: 107,112,117;
385
- --semi-grey-5: 136,141,146;
386
- --semi-grey-6: 167,171,176;
387
- --semi-grey-7: 198,202,205;
388
- --semi-grey-8: 230,232,234;
389
- --semi-grey-9: 249,249,249;
390
- --semi-white: 255, 255, 255;
391
- --semi-black: 0, 0, 0;
392
- --semi-ai-purple-0: 58,23,112;
393
- --semi-ai-purple-1: 83,35,148;
394
- --semi-ai-purple-2: 111,49,184;
395
- --semi-ai-purple-3: 141,65,219;
396
- --semi-ai-purple-4: 167,68,255;
397
- --semi-ai-purple-5: 195,117,255;
398
- --semi-ai-purple-6: 213,152,255;
399
- --semi-ai-purple-7: 229,186,255;
400
- --semi-ai-purple-8: 243,221,255;
401
- --semi-ai-purple-9: 251,243,255;
402
- --semi-ai-general-0-0: 9,44,100;
403
- --semi-ai-general-0-1: 39,29,108;
404
- --semi-ai-general-0-2: 58,23,112;
405
- --semi-ai-general-0-3: 80,18,101;
406
- --semi-ai-general-1-0: 17,64,136;
407
- --semi-ai-general-1-1: 54,43,144;
408
- --semi-ai-general-1-2: 83,35,148;
409
- --semi-ai-general-1-3: 113,28,137;
410
- --semi-ai-general-2-0: 26,86,172;
411
- --semi-ai-general-2-1: 70,59,180;
412
- --semi-ai-general-2-2: 111,49,184;
413
- --semi-ai-general-2-3: 148,41,173;
414
- --semi-ai-general-3-0: 38,111,207;
415
- --semi-ai-general-3-1: 88,78,215;
416
- --semi-ai-general-3-2: 141,65,219;
417
- --semi-ai-general-3-3: 185,55,208;
418
- --semi-ai-general-4-0: 35,127,240;
419
- --semi-ai-general-4-1: 94,84,248;
420
- --semi-ai-general-4-2: 167,68,255;
421
- --semi-ai-general-4-3: 219,56,241;
422
- --semi-ai-general-5-0: 91,162,245;
423
- --semi-ai-general-5-1: 134,129,252;
424
- --semi-ai-general-5-2: 195,117,255;
425
- --semi-ai-general-5-3: 234,107,246;
426
- --semi-ai-general-6-0: 131,187,248;
427
- --semi-ai-general-6-1: 163,160,253;
428
- --semi-ai-general-6-2: 213,152,255;
429
- --semi-ai-general-6-3: 243,143,248;
430
- --semi-ai-general-7-0: 172,210,250;
431
- --semi-ai-general-7-1: 192,192,253;
432
- --semi-ai-general-7-2: 229,186,255;
433
- --semi-ai-general-7-3: 249,180,251;
434
- --semi-ai-general-8-0: 213,233,253;
435
- --semi-ai-general-8-1: 223,223,254;
436
- --semi-ai-general-8-2: 243,221,255;
437
- --semi-ai-general-8-3: 253,217,252;
438
- --semi-ai-general-9-0: 239,247,254;
439
- --semi-ai-general-9-1: 244,244,255;
440
- --semi-ai-general-9-2: 251,243,255;
441
- --semi-ai-general-9-3: 254,241,254;
442
- --semi-ai-general-0: linear-gradient(278deg, rgba(var(--semi-ai-general-0-0)) 0%, rgba(var(--semi-ai-general-0-1)) 30%, rgba(var(--semi-ai-general-0-2)) 60%, rgba(var(--semi-ai-general-0-3)) 100%);
443
- --semi-ai-general-1: linear-gradient(278deg, rgba(var(--semi-ai-general-1-0)) 0%, rgba(var(--semi-ai-general-1-1)) 30%, rgba(var(--semi-ai-general-1-2)) 60%, rgba(var(--semi-ai-general-1-3)) 100%);
444
- --semi-ai-general-2: linear-gradient(278deg, rgba(var(--semi-ai-general-2-0)) 0%, rgba(var(--semi-ai-general-2-1)) 30%, rgba(var(--semi-ai-general-2-2)) 60%, rgba(var(--semi-ai-general-2-3)) 100%);
445
- --semi-ai-general-3: linear-gradient(278deg, rgba(var(--semi-ai-general-3-0)) 0%, rgba(var(--semi-ai-general-3-1)) 30%, rgba(var(--semi-ai-general-3-2)) 60%, rgba(var(--semi-ai-general-3-3)) 100%);
446
- --semi-ai-general-4: linear-gradient(278deg, rgba(var(--semi-ai-general-4-0)) 0%, rgba(var(--semi-ai-general-4-1)) 30%, rgba(var(--semi-ai-general-4-2)) 60%, rgba(var(--semi-ai-general-4-3)) 100%);
447
- --semi-ai-general-5: linear-gradient(278deg, rgba(var(--semi-ai-general-5-0)) 0%, rgba(var(--semi-ai-general-5-1)) 30%, rgba(var(--semi-ai-general-5-2)) 60%, rgba(var(--semi-ai-general-5-3)) 100%);
448
- --semi-ai-general-6: linear-gradient(278deg, rgba(var(--semi-ai-general-6-0)) 0%, rgba(var(--semi-ai-general-6-1)) 30%, rgba(var(--semi-ai-general-6-2)) 60%, rgba(var(--semi-ai-general-6-3)) 100%);
449
- --semi-ai-general-7: linear-gradient(278deg, rgba(var(--semi-ai-general-7-0)) 0%, rgba(var(--semi-ai-general-7-1)) 30%, rgba(var(--semi-ai-general-7-2)) 60%, rgba(var(--semi-ai-general-7-3)) 100%);
450
- --semi-ai-general-8: linear-gradient(278deg, rgba(var(--semi-ai-general-8-0)) 0%, rgba(var(--semi-ai-general-8-1)) 30%, rgba(var(--semi-ai-general-8-2)) 60%, rgba(var(--semi-ai-general-8-3)) 100%);
451
- --semi-ai-general-9: linear-gradient(278deg, rgba(var(--semi-ai-general-9-0)) 0%, rgba(var(--semi-ai-general-9-1)) 30%, rgba(var(--semi-ai-general-9-2)) 60%, rgba(var(--semi-ai-general-9-3)) 100%);
452
- }
453
-
454
- body, body[theme-mode=dark] .semi-always-light, :host, :host .semi-always-light {
455
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
456
- -webkit-font-smoothing: antialiased;
457
- --semi-color-white: rgba(var(--semi-white), 1);
458
- --semi-color-black: rgba(var(--semi-black), 1);
459
- --semi-color-primary: rgba(var(--semi-blue-5), 1);
460
- --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
461
- --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
462
- --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
463
- --semi-color-primary-light-default: rgba(var(--semi-blue-0), 1);
464
- --semi-color-primary-light-hover: rgba(var(--semi-blue-1), 1);
465
- --semi-color-primary-light-active: rgba(var(--semi-blue-2), 1);
466
- --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
467
- --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
468
- --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
469
- --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
470
- --semi-color-secondary-light-default: rgba(var(--semi-light-blue-0), 1);
471
- --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-1), 1);
472
- --semi-color-secondary-light-active: rgba(var(--semi-light-blue-2), 1);
473
- --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
474
- --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
475
- --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
476
- --semi-color-tertiary-light-default: rgba(var(--semi-grey-0), 1);
477
- --semi-color-tertiary-light-hover: rgba(var(--semi-grey-1), 1);
478
- --semi-color-tertiary-light-active: rgba(var(--semi-grey-2), 1);
479
- --semi-color-default: rgba(var(--semi-grey-0), 1);
480
- --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
481
- --semi-color-default-active: rgba(var(--semi-grey-2), 1);
482
- --semi-color-info: rgba(var(--semi-blue-5), 1);
483
- --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
484
- --semi-color-info-active: rgba(var(--semi-blue-7), 1);
485
- --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
486
- --semi-color-info-light-default: rgba(var(--semi-blue-0), 1);
487
- --semi-color-info-light-hover: rgba(var(--semi-blue-1), 1);
488
- --semi-color-info-light-active: rgba(var(--semi-blue-2), 1);
489
- --semi-color-success: rgba(var(--semi-green-5), 1);
490
- --semi-color-success-hover: rgba(var(--semi-green-6), 1);
491
- --semi-color-success-active: rgba(var(--semi-green-7), 1);
492
- --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
493
- --semi-color-success-light-default: rgba(var(--semi-green-0), 1);
494
- --semi-color-success-light-hover: rgba(var(--semi-green-1), 1);
495
- --semi-color-success-light-active: rgba(var(--semi-green-2), 1);
496
- --semi-color-danger: rgba(var(--semi-red-5), 1);
497
- --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
498
- --semi-color-danger-active: rgba(var(--semi-red-7), 1);
499
- --semi-color-danger-light-default: rgba(var(--semi-red-0), 1);
500
- --semi-color-danger-light-hover: rgba(var(--semi-red-1), 1);
501
- --semi-color-danger-light-active: rgba(var(--semi-red-2), 1);
502
- --semi-color-warning: rgba(var(--semi-orange-5), 1);
503
- --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
504
- --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
505
- --semi-color-warning-light-default: rgba(var(--semi-orange-0), 1);
506
- --semi-color-warning-light-hover: rgba(var(--semi-orange-1), 1);
507
- --semi-color-warning-light-active: rgba(var(--semi-orange-2), 1);
508
- --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
509
- --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
510
- --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
511
- --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
512
- --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
513
- --semi-color-shadow: rgba(var(--semi-black), .04);
514
- --semi-color-link: rgba(var(--semi-blue-5), 1);
515
- --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
516
- --semi-color-link-active: rgba(var(--semi-blue-7), 1);
517
- --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
518
- --semi-color-border: rgba(var(--semi-grey-9), .08);
519
- --semi-color-nav-bg: rgba(var(--semi-white), 1);
520
- --semi-color-overlay-bg: rgba(22, 22, 26, .6);
521
- --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
522
- --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
523
- --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
524
- --semi-color-bg-0: rgba(var(--semi-white), 1);
525
- --semi-color-bg-1: rgba(var(--semi-white), 1);
526
- --semi-color-bg-2: rgba(var(--semi-white), 1);
527
- --semi-color-bg-3: rgba(var(--semi-white), 1);
528
- --semi-color-bg-4: rgba(var(--semi-white), 1);
529
- --semi-color-text-0: rgba(var(--semi-grey-9), 1);
530
- --semi-color-text-1: rgba(var(--semi-grey-9), .8);
531
- --semi-color-text-2: rgba(var(--semi-grey-9), .62);
532
- --semi-color-text-3: rgba(var(--semi-grey-9), .35);
533
- --semi-shadow-elevated: 0 0 1px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .1);
534
- --semi-border-radius-extra-small: 3px;
535
- --semi-border-radius-small: 3px;
536
- --semi-border-radius-medium: 6px;
537
- --semi-border-radius-large: 12px;
538
- --semi-border-radius-circle: 50%;
539
- --semi-border-radius-full: 9999px;
540
- --semi-color-highlight-bg: rgba(var(--semi-yellow-4), 1);
541
- --semi-color-highlight: rgba(var(--semi-black), 1);
542
- --semi-color-data-0: rgba(87, 105, 255, 1);
543
- --semi-color-data-1: rgba(142, 212, 231, 1);
544
- --semi-color-data-2: rgba(245, 135, 0, 1);
545
- --semi-color-data-3: rgba(220, 183, 252, 1);
546
- --semi-color-data-4: rgba(74, 156, 247, 1);
547
- --semi-color-data-5: rgba(243, 204, 53, 1);
548
- --semi-color-data-6: rgba(254, 128, 144, 1);
549
- --semi-color-data-7: rgba(139, 215, 210, 1);
550
- --semi-color-data-8: rgba(131, 176, 35, 1);
551
- --semi-color-data-9: rgba(233, 165, 229, 1);
552
- --semi-color-data-10: rgba(48, 167, 206, 1);
553
- --semi-color-data-11: rgba(249, 192, 100, 1);
554
- --semi-color-data-12: rgba(177, 113, 249, 1);
555
- --semi-color-data-13: rgba(119, 182, 249, 1);
556
- --semi-color-data-14: rgba(200, 143, 2, 1);
557
- --semi-color-data-15: rgba(255, 170, 178, 1);
558
- --semi-color-data-16: rgba(51, 176, 171, 1);
559
- --semi-color-data-17: rgba(182, 215, 129, 1);
560
- --semi-color-data-18: rgba(212, 88, 212, 1);
561
- --semi-color-data-19: rgba(188, 198, 255, 1);
562
- --semi-color-ai-general: var(--semi-ai-general-5);
563
- --semi-color-ai-general-hover: var(--semi-ai-general-6);
564
- --semi-color-ai-general-active: var(--semi-ai-general-7);
565
- --semi-color-ai-general-disabled: var(--semi-ai-general-2);
566
- --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
567
- --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
568
- --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
569
- --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
570
- --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 255, 255, 0.04) 6.58%, rgba(255, 226, 138, 0.04) 32.88%, rgba(231, 45, 255, 0.04) 67.93%, rgba(0, 115, 255, 0.04) 94.23%);
571
- --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 255, 255, 0.08) 6.58%, rgba(255, 226, 138, 0.08) 32.88%, rgba(231, 45, 255, 0.08) 67.93%, rgba(0, 115, 255, 0.08) 94.23%);
572
- --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 255, 255, 0.12) 6.58%, rgba(255, 226, 138, 0.12) 32.88%, rgba(231, 45, 255, 0.12) 67.93%, rgba(0, 115, 255, 0.12) 94.23%);
573
- --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, 0.16) 6.58%, rgba(176, 48, 240, 0.096) 32.88%, rgba(231, 45, 255, 0.048) 59.17%, rgba(255, 255, 255, 0) 94.23%);
574
- --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.24) 6.58%, rgba(176, 48, 240, 0.144) 32.88%, rgba(231, 45, 255, 0.072) 59.17%, rgba(255, 255, 255, 0) 94.23%);
575
- --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.32) 6.58%, rgba(176, 48, 240, 0.192) 32.88%, rgba(231, 45, 255, 0.096) 59.17%, rgba(255, 255, 255, 0) 94.23%);
576
- }
577
-
578
- body[theme-mode=dark], body .semi-always-dark, :host([theme-mode=dark]), :host .semi-always-dark {
579
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
580
- -webkit-font-smoothing: antialiased;
581
- --semi-color-white: rgba(228, 231, 245, 1);
582
- --semi-color-black: rgba(var(--semi-black), 1);
583
- --semi-color-primary: rgba(var(--semi-blue-5), 1);
584
- --semi-color-primary-hover: rgba(var(--semi-blue-6), 1);
585
- --semi-color-primary-active: rgba(var(--semi-blue-7), 1);
586
- --semi-color-primary-disabled: rgba(var(--semi-blue-2), 1);
587
- --semi-color-primary-light-default: rgba(var(--semi-blue-5), .2);
588
- --semi-color-primary-light-hover: rgba(var(--semi-blue-5), .3);
589
- --semi-color-primary-light-active: rgba(var(--semi-blue-5), .4);
590
- --semi-color-secondary: rgba(var(--semi-light-blue-5), 1);
591
- --semi-color-secondary-hover: rgba(var(--semi-light-blue-6), 1);
592
- --semi-color-secondary-active: rgba(var(--semi-light-blue-7), 1);
593
- --semi-color-secondary-disabled: rgba(var(--semi-light-blue-2), 1);
594
- --semi-color-secondary-light-default: rgba(var(--semi-light-blue-5), .2);
595
- --semi-color-secondary-light-hover: rgba(var(--semi-light-blue-5), .3);
596
- --semi-color-secondary-light-active: rgba(var(--semi-light-blue-5), .4);
597
- --semi-color-tertiary: rgba(var(--semi-grey-5), 1);
598
- --semi-color-tertiary-hover: rgba(var(--semi-grey-6), 1);
599
- --semi-color-tertiary-active: rgba(var(--semi-grey-7), 1);
600
- --semi-color-tertiary-light-default: rgba(var(--semi-grey-5), .2);
601
- --semi-color-tertiary-light-hover: rgba(var(--semi-grey-5), .3);
602
- --semi-color-tertiary-light-active: rgba(var(--semi-grey-5), .4);
603
- --semi-color-default: rgba(var(--semi-grey-0), 1);
604
- --semi-color-default-hover: rgba(var(--semi-grey-1), 1);
605
- --semi-color-default-active: rgba(var(--semi-grey-2), 1);
606
- --semi-color-info: rgba(var(--semi-blue-5), 1);
607
- --semi-color-info-hover: rgba(var(--semi-blue-6), 1);
608
- --semi-color-info-active: rgba(var(--semi-blue-7), 1);
609
- --semi-color-info-disabled: rgba(var(--semi-blue-2), 1);
610
- --semi-color-info-light-default: rgba(var(--semi-blue-5), .2);
611
- --semi-color-info-light-hover: rgba(var(--semi-blue-5), .3);
612
- --semi-color-info-light-active: rgba(var(--semi-blue-5), .4);
613
- --semi-color-success: rgba(var(--semi-green-5), 1);
614
- --semi-color-success-hover: rgba(var(--semi-green-6), 1);
615
- --semi-color-success-active: rgba(var(--semi-green-7), 1);
616
- --semi-color-success-disabled: rgba(var(--semi-green-2), 1);
617
- --semi-color-success-light-default: rgba(var(--semi-green-5), .2);
618
- --semi-color-success-light-hover: rgba(var(--semi-green-5), .3);
619
- --semi-color-success-light-active: rgba(var(--semi-green-5), .4);
620
- --semi-color-danger: rgba(var(--semi-red-5), 1);
621
- --semi-color-danger-hover: rgba(var(--semi-red-6), 1);
622
- --semi-color-danger-active: rgba(var(--semi-red-7), 1);
623
- --semi-color-danger-light-default: rgba(var(--semi-red-5), .2);
624
- --semi-color-danger-light-hover: rgba(var(--semi-red-5), .3);
625
- --semi-color-danger-light-active: rgba(var(--semi-red-5), .4);
626
- --semi-color-warning: rgba(var(--semi-orange-5), 1);
627
- --semi-color-warning-hover: rgba(var(--semi-orange-6), 1);
628
- --semi-color-warning-active: rgba(var(--semi-orange-7), 1);
629
- --semi-color-warning-light-default: rgba(var(--semi-orange-5), .2);
630
- --semi-color-warning-light-hover: rgba(var(--semi-orange-5), .3);
631
- --semi-color-warning-light-active: rgba(var(--semi-orange-5), .4);
632
- --semi-color-focus-border: rgba(var(--semi-blue-5), 1);
633
- --semi-color-disabled-text: rgba(var(--semi-grey-9), .35);
634
- --semi-color-disabled-border: rgba(var(--semi-grey-1), 1);
635
- --semi-color-disabled-bg: rgba(var(--semi-grey-1), 1);
636
- --semi-color-disabled-fill: rgba(var(--semi-grey-8), .04);
637
- --semi-color-link: rgba(var(--semi-blue-5), 1);
638
- --semi-color-link-hover: rgba(var(--semi-blue-6), 1);
639
- --semi-color-link-active: rgba(var(--semi-blue-7), 1);
640
- --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
641
- --semi-color-nav-bg: rgba(35, 36, 41, 1);
642
- --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
643
- --semi-color-overlay-bg: rgba(22, 22, 26, .6);
644
- --semi-color-fill-0: rgba(var(--semi-white), .12);
645
- --semi-color-fill-1: rgba(var(--semi-white), .16);
646
- --semi-color-fill-2: rgba(var(--semi-white), .20);
647
- --semi-color-border: rgba(var(--semi-white), .08);
648
- --semi-color-shadow: rgba(var(--semi-black), .04);
649
- --semi-color-bg-0: rgba(22, 22, 26, 1);
650
- --semi-color-bg-1: rgba(35, 36, 41, 1);
651
- --semi-color-bg-2: rgba(53, 54, 60, 1);
652
- --semi-color-bg-3: rgba(67, 68, 74, 1);
653
- --semi-color-bg-4: rgba(79, 81, 89, 1);
654
- --semi-color-text-0: rgba(var(--semi-grey-9), 1);
655
- --semi-color-text-1: rgba(var(--semi-grey-9), .8);
656
- --semi-color-text-2: rgba(var(--semi-grey-9), .6);
657
- --semi-color-text-3: rgba(var(--semi-grey-9), .35);
658
- --semi-border-radius-extra-small: 3px;
659
- --semi-border-radius-small: 3px;
660
- --semi-border-radius-medium: 6px;
661
- --semi-border-radius-large: 12px;
662
- --semi-border-radius-circle: 50%;
663
- --semi-border-radius-full: 9999px;
664
- --semi-color-highlight-bg: rgba(var(--semi-yellow-2), 1);
665
- --semi-color-highlight: rgba(var(--semi-white), 1);
666
- --semi-color-data-0: rgba(94, 109, 194, 1);
667
- --semi-color-data-1: rgba(8, 104, 120, 1);
668
- --semi-color-data-2: rgba(250, 173, 63, 1);
669
- --semi-color-data-3: rgba(76, 43, 156, 1);
670
- --semi-color-data-4: rgba(16, 125, 248, 1);
671
- --semi-color-data-5: rgba(248, 202, 16, 1);
672
- --semi-color-data-6: rgba(195, 30, 87, 1);
673
- --semi-color-data-7: rgba(5, 119, 115, 1);
674
- --semi-color-data-8: rgba(154, 207, 13, 1);
675
- --semi-color-data-9: rgba(117, 29, 138, 1);
676
- --semi-color-data-10: rgba(16, 162, 180, 1);
677
- --semi-color-data-11: rgba(208, 110, 11, 1);
678
- --semi-color-data-12: rgba(113, 66, 197, 1);
679
- --semi-color-data-13: rgba(7, 100, 212, 1);
680
- --semi-color-data-14: rgba(251, 232, 110, 1);
681
- --semi-color-data-15: rgba(160, 19, 73, 1);
682
- --semi-color-data-16: rgba(11, 179, 167, 1);
683
- --semi-color-data-17: rgba(98, 138, 6, 1);
684
- --semi-color-data-18: rgba(162, 48, 179, 1);
685
- --semi-color-data-19: rgba(40, 51, 138, 1);
686
- --semi-color-ai-general: var(--semi-ai-general-5);
687
- --semi-color-ai-general-hover: var(--semi-ai-general-6);
688
- --semi-color-ai-general-active: var(--semi-ai-general-7);
689
- --semi-color-ai-general-disabled: var(--semi-ai-general-2);
690
- --semi-color-ai-purple: rgba(var(--semi-ai-purple-5));
691
- --semi-color-ai-purple-hover: rgba(var(--semi-ai-purple-6));
692
- --semi-color-ai-purple-active: rgba(var(--semi-ai-purple-7));
693
- --semi-color-ai-purple-disabled: rgba(var(--semi-ai-purple-2));
694
- --semi-color-ai-background-bottom: linear-gradient(201.15deg, rgba(255, 226, 138, 0.2) 6.58%, rgba(231, 45, 255, 0.2) 50.4%, rgba(0, 115, 255, 0.2) 94.23%);
695
- --semi-color-ai-background-bottom-hover: linear-gradient(201.15deg, rgba(255, 226, 138, 0.3) 6.58%, rgba(231, 45, 255, 0.3) 50.4%, rgba(0, 115, 255, 0.3) 94.23%);
696
- --semi-color-ai-background-bottom-active: linear-gradient(201.15deg, rgba(255, 226, 138, 0.4) 6.58%, rgba(231, 45, 255, 0.4) 50.4%, rgba(0, 115, 255, 0.4) 94.23%);
697
- --semi-color-ai-background-top: linear-gradient(201.15deg, rgba(83, 56, 255, 0.36) 6.58%, rgba(176, 48, 240, 0.216) 32.88%, rgba(154, 0, 174, 0.108) 59.17%, rgba(0, 0, 0, 0) 94.23%);
698
- --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.54) 6.58%, rgba(176, 48, 240, 0.324) 32.88%, rgba(154, 0, 174, 0.162) 59.17%, rgba(0, 0, 0, 0) 94.23%);
699
- --semi-color-ai-background-top-hover: linear-gradient(201.15deg, rgba(83, 56, 255, 0.72) 6.58%, rgba(176, 48, 240, 0.432) 32.88%, rgba(154, 0, 174, 0.216) 59.17%, rgba(0, 0, 0, 0) 94.23%);
700
- }
701
-
702
- .semi-button-split {
703
- display: inline-block;
704
- }
705
- .semi-button-split .semi-button {
706
- border-radius: 0;
707
- margin-right: 1px;
708
- }
709
- .semi-button-split .semi-button-first {
710
- border-top-left-radius: var(--semi-border-radius-small);
711
- border-bottom-left-radius: var(--semi-border-radius-small);
712
- }
713
- .semi-button-split .semi-button-last {
714
- border-top-right-radius: var(--semi-border-radius-small);
715
- border-bottom-right-radius: var(--semi-border-radius-small);
716
- margin-right: unset;
717
- }
718
- .semi-button-split:hover .semi-button-borderless:active {
719
- background-color: var(--semi-color-fill-1);
720
- }
721
-
722
- .semi-button {
723
- --semi-button-colorful-multiple-fill-0: rgba(var(--semi-ai-general-5-3));
724
- --semi-button-colorful-multiple-fill-1: rgba(var(--semi-ai-general-5-2));
725
- --semi-button-colorful-multiple-fill-2: rgba(var(--semi-ai-general-5-1));
726
- --semi-button-colorful-multiple-fill-3: rgba(var(--semi-ai-general-5-0));
727
- --semi-button-colorful-disabled-fill: var(--semi-color-disabled-text);
728
- --semi-button-colorful-fill-primary: var(--semi-color-ai-purple);
729
- --semi-button-colorful-fill-secondary: var(--semi-color-text-0);
730
- }
731
-
732
- .semi-button {
733
- box-shadow: none;
734
- height: 32px;
735
- display: inline-flex;
736
- align-items: center;
737
- justify-content: center;
738
- cursor: pointer;
739
- user-select: none;
740
- border: 0 transparent solid;
741
- border-radius: var(--semi-border-radius-small);
742
- padding-left: 12px;
743
- padding-right: 12px;
744
- padding-top: 6px;
745
- padding-bottom: 6px;
746
- font-family: inherit;
747
- font-size: 14px;
748
- line-height: 20px;
749
- font-weight: 600;
750
- outline: none;
751
- vertical-align: middle;
752
- white-space: nowrap;
753
- }
754
- .semi-button.semi-button-primary:focus-visible, .semi-button.semi-button-secondary:focus-visible, .semi-button.semi-button-tertiary:focus-visible, .semi-button.semi-button-warning:focus-visible, .semi-button.semi-button-danger:focus-visible {
755
- outline: 2px solid var(--semi-color-primary-light-active);
756
- }
757
- .semi-button-content {
758
- display: flex;
759
- align-items: center;
760
- }
761
- .semi-button-danger {
762
- background-color: var(--semi-color-danger);
763
- color: rgba(var(--semi-white), 1);
764
- 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);
765
- transform: scale(var(--semi-transform_scale-none));
766
- }
767
- .semi-button-danger-disabled {
768
- background-color: var(--semi-color-disabled-bg);
769
- }
770
- .semi-button-danger-disabled.semi-button-outline {
771
- background-color: transparent;
772
- border: 1px solid var(--semi-color-border);
773
- }
774
- .semi-button-danger-disabled.semi-button-light {
775
- background-color: var(--semi-color-fill-0);
776
- }
777
- .semi-button-danger:hover {
778
- background-color: var(--semi-color-danger-hover);
779
- }
780
- .semi-button-danger:active {
781
- background-color: var(--semi-color-danger-active);
782
- }
783
- .semi-button-danger.semi-button-outline {
784
- background-color: transparent;
785
- border: 1px solid var(--semi-color-danger);
786
- }
787
- .semi-button-danger.semi-button-light, .semi-button-danger.semi-button-outline, .semi-button-danger.semi-button-borderless {
788
- color: var(--semi-color-danger);
789
- }
790
- .semi-button-danger:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
791
- outline: 2px solid var(--semi-color-danger-light-active);
792
- }
793
- .semi-button-warning {
794
- background-color: var(--semi-color-warning);
795
- color: rgba(var(--semi-white), 1);
796
- 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);
797
- transform: scale(var(--semi-transform_scale-none));
798
- }
799
- .semi-button-warning-disabled {
800
- background-color: var(--semi-color-disabled-bg);
801
- }
802
- .semi-button-warning-disabled.semi-button-outline {
803
- background-color: transparent;
804
- border: 1px solid var(--semi-color-border);
805
- }
806
- .semi-button-warning-disabled.semi-button-light {
807
- background-color: var(--semi-color-fill-0);
808
- }
809
- .semi-button-warning:hover {
810
- background-color: var(--semi-color-warning-hover);
811
- }
812
- .semi-button-warning:active {
813
- background-color: var(--semi-color-warning-active);
814
- }
815
- .semi-button-warning.semi-button-outline {
816
- background-color: transparent;
817
- border: 1px solid var(--semi-color-warning);
818
- }
819
- .semi-button-warning.semi-button-light, .semi-button-warning.semi-button-outline, .semi-button-warning.semi-button-borderless {
820
- color: var(--semi-color-warning);
821
- }
822
- .semi-button-warning:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
823
- outline: 2px solid var(--semi-color-warning-light-active);
824
- }
825
- .semi-button-tertiary {
826
- background-color: var(--semi-color-tertiary);
827
- color: rgba(var(--semi-white), 1);
828
- 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);
829
- transform: scale(var(--semi-transform_scale-none));
830
- }
831
- .semi-button-tertiary.semi-button-colorful.semi-button-solid {
832
- background: var(--semi-ai-general-0);
833
- }
834
- .semi-button-tertiary.semi-button-colorful.semi-button-solid:hover {
835
- background: var(--semi-ai-general-1);
836
- }
837
- .semi-button-tertiary.semi-button-colorful.semi-button-solid:active {
838
- background: var(--semi-ai-general-2);
839
- }
840
- .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content-right, .semi-button-tertiary.semi-button-colorful.semi-button-solid .semi-button-content:not(:has(> .semi-button-content-right)) {
841
- background: var(--semi-color-ai-general);
842
- background-clip: text;
843
- color: transparent;
844
- }
845
- .semi-button-tertiary-disabled {
846
- background-color: var(--semi-color-disabled-bg);
847
- }
848
- .semi-button-tertiary-disabled.semi-button-outline {
849
- background-color: transparent;
850
- border: 1px solid var(--semi-color-border);
851
- }
852
- .semi-button-tertiary-disabled.semi-button-light {
853
- background-color: var(--semi-color-fill-0);
854
- }
855
- .semi-button-tertiary:hover {
856
- background-color: var(--semi-color-tertiary-hover);
857
- }
858
- .semi-button-tertiary:active {
859
- background-color: var(--semi-color-tertiary-active);
860
- }
861
- .semi-button-tertiary.semi-button-outline {
862
- background-color: transparent;
863
- border: 1px solid var(--semi-color-border);
864
- }
865
- .semi-button-tertiary.semi-button-light, .semi-button-tertiary.semi-button-outline, .semi-button-tertiary.semi-button-borderless {
866
- color: var(--semi-color-text-1);
867
- }
868
- .semi-button-primary {
869
- background-color: var(--semi-color-primary);
870
- color: rgba(var(--semi-white), 1);
871
- 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);
872
- transform: scale(var(--semi-transform_scale-none));
873
- }
874
- .semi-button-primary.semi-button-colorful.semi-button-solid {
875
- background: var(--semi-color-ai-general);
876
- }
877
- .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
878
- background: var(--semi-color-ai-general-hover);
879
- }
880
- .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
881
- background: var(--semi-color-ai-general-active);
882
- }
883
- .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content-right, .semi-button-primary.semi-button-colorful.semi-button-light .semi-button-content:not(:has(> .semi-button-content-right)) {
884
- background: var(--semi-color-ai-general);
885
- background-clip: text;
886
- color: transparent;
887
- }
888
- .semi-button-primary.semi-button-colorful.semi-button-outline {
889
- color: var(--semi-color-ai-purple);
890
- border-color: var(--semi-color-ai-purple);
891
- }
892
- .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content-right, .semi-button-primary.semi-button-colorful.semi-button-borderless .semi-button-content:not(:has(> .semi-button-content-right)) {
893
- background: var(--semi-color-ai-general);
894
- background-clip: text;
895
- color: transparent;
896
- }
897
- .semi-button-primary-disabled {
898
- background-color: var(--semi-color-disabled-bg);
899
- }
900
- .semi-button-primary-disabled.semi-button-light {
901
- background: var(--semi-color-fill-0);
902
- }
903
- .semi-button-primary-disabled.semi-button-outline {
904
- background-color: transparent;
905
- border: 1px solid var(--semi-color-border);
906
- }
907
- .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
908
- background-color: var(--semi-color-primary-hover);
909
- }
910
- .semi-button-primary.semi-button-outline {
911
- background-color: transparent;
912
- border: 1px solid var(--semi-color-border);
913
- }
914
- .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
915
- background-color: var(--semi-color-primary-active);
916
- }
917
- .semi-button-primary.semi-button-light, .semi-button-primary.semi-button-outline, .semi-button-primary.semi-button-borderless {
918
- color: var(--semi-color-primary);
919
- }
920
- .semi-button-secondary {
921
- background-color: var(--semi-color-secondary);
922
- outline-color: var(--semi-color-secondary);
923
- color: rgba(var(--semi-white), 1);
924
- 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);
925
- transform: scale(var(--semi-transform_scale-none));
926
- }
927
- .semi-button-secondary-disabled {
928
- background-color: var(--semi-color-disabled-bg);
929
- }
930
- .semi-button-secondary-disabled.semi-button-outline {
931
- background-color: transparent;
932
- border: 1px solid var(--semi-color-border);
933
- }
934
- .semi-button-secondary-disabled.semi-button-light {
935
- background-color: var(--semi-color-fill-0);
936
- }
937
- .semi-button-secondary.semi-button-outline {
938
- background-color: transparent;
939
- border: 1px solid var(--semi-color-border);
940
- }
941
- .semi-button-secondary:hover {
942
- background-color: var(--semi-color-secondary-hover);
943
- }
944
- .semi-button-secondary:active {
945
- background-color: var(--semi-color-secondary-active);
946
- }
947
- .semi-button-secondary.semi-button-light, .semi-button-secondary.semi-button-outline, .semi-button-secondary.semi-button-borderless {
948
- color: var(--semi-color-secondary);
949
- }
950
- .semi-button-disabled {
951
- color: var(--semi-color-disabled-text);
952
- cursor: not-allowed;
953
- }
954
- .semi-button-disabled:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
955
- color: var(--semi-color-disabled-text);
956
- }
957
- .semi-button-disabled.semi-button-light, .semi-button-disabled.semi-button-borderless {
958
- color: var(--semi-color-disabled-text);
959
- }
960
- .semi-button-disabled.semi-button-outline {
961
- color: var(--semi-color-disabled-text);
962
- }
963
- .semi-button-borderless {
964
- background-color: transparent;
965
- border: 0 transparent solid;
966
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
967
- transform: scale(var(--semi-transform_scale-none));
968
- }
969
- .semi-button-borderless:not(.semi-button-disabled):hover {
970
- background-color: var(--semi-color-fill-0);
971
- border: 0 transparent solid;
972
- }
973
- .semi-button-borderless:not(.semi-button-disabled):active {
974
- background-color: var(--semi-color-fill-1);
975
- border: 0 transparent solid;
976
- }
977
- .semi-button-outline {
978
- background-color: transparent;
979
- }
980
- .semi-button-outline:not(.semi-button-disabled):hover {
981
- background-color: var(--semi-color-fill-0);
982
- }
983
- .semi-button-outline:not(.semi-button-disabled):active {
984
- background-color: var(--semi-color-fill-1);
985
- }
986
- .semi-button-light {
987
- background-color: var(--semi-color-fill-0);
988
- border: 0 transparent solid;
989
- 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);
990
- transform: scale(var(--semi-transform_scale-none));
991
- }
992
- .semi-button-light:not(.semi-button-disabled):hover {
993
- background-color: var(--semi-color-fill-1);
994
- border: 0 transparent solid;
995
- }
996
- .semi-button-light:not(.semi-button-disabled):active {
997
- background-color: var(--semi-color-fill-2);
998
- border: 0 transparent solid;
999
- }
1000
- .semi-button-size-small {
1001
- height: 24px;
1002
- padding-top: 2px;
1003
- padding-bottom: 2px;
1004
- padding-left: 12px;
1005
- padding-right: 12px;
1006
- font-size: 14px;
1007
- line-height: 20px;
1008
- font-weight: 600;
1009
- }
1010
- .semi-button-size-large {
1011
- height: 40px;
1012
- padding-top: 10px;
1013
- padding-bottom: 10px;
1014
- padding-left: 16px;
1015
- padding-right: 16px;
1016
- font-size: 14px;
1017
- line-height: 20px;
1018
- font-weight: 600;
1019
- }
1020
- .semi-button-block {
1021
- width: 100%;
1022
- }
1023
- .semi-button-group {
1024
- display: flex;
1025
- flex-wrap: wrap;
1026
- }
1027
- .semi-button-group > .semi-button {
1028
- margin: 0;
1029
- padding-left: 0;
1030
- padding-right: 0;
1031
- border-radius: 0;
1032
- }
1033
- .semi-button-group > .semi-button .semi-button-content {
1034
- padding-left: 12px;
1035
- padding-right: 12px;
1036
- }
1037
- .semi-button-group > .semi-button-size-large .semi-button-content {
1038
- padding-left: 16px;
1039
- padding-right: 16px;
1040
- }
1041
- .semi-button-group > .semi-button-size-small .semi-button-content {
1042
- padding-left: 12px;
1043
- padding-right: 12px;
1044
- }
1045
- .semi-button-group > .semi-button.semi-button-with-icon-only {
1046
- padding-left: 0;
1047
- padding-right: 0;
1048
- }
1049
- .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
1050
- padding-left: 8px;
1051
- padding-right: 8px;
1052
- }
1053
- .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
1054
- padding-left: 4px;
1055
- padding-right: 4px;
1056
- }
1057
- .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
1058
- padding-left: 12px;
1059
- padding-right: 12px;
1060
- }
1061
- .semi-button-group > .semi-button:first-child {
1062
- border-top-left-radius: var(--semi-border-radius-small);
1063
- border-bottom-left-radius: var(--semi-border-radius-small);
1064
- }
1065
- .semi-button-group > .semi-button:last-child {
1066
- border-top-right-radius: var(--semi-border-radius-small);
1067
- border-bottom-right-radius: var(--semi-border-radius-small);
1068
- }
1069
- .semi-button-group > .semi-button-outline:not(:last-child) {
1070
- border-right-color: transparent;
1071
- margin-right: -1px;
1072
- }
1073
- .semi-button-group-line {
1074
- display: inline-flex;
1075
- align-items: center;
1076
- background-color: var(--semi-color-border);
1077
- }
1078
- .semi-button-group-line-primary {
1079
- background-color: var(--semi-color-primary);
1080
- }
1081
- .semi-button-group-line-secondary {
1082
- background-color: var(--semi-color-secondary);
1083
- }
1084
- .semi-button-group-line-tertiary {
1085
- background-color: var(--semi-color-tertiary);
1086
- }
1087
- .semi-button-group-line-warning {
1088
- background-color: var(--semi-color-warning);
1089
- }
1090
- .semi-button-group-line-danger {
1091
- background-color: var(--semi-color-danger);
1092
- }
1093
- .semi-button-group-line-disabled {
1094
- background-color: var(--semi-color-disabled-bg);
1095
- }
1096
- .semi-button-group-line-light {
1097
- background-color: var(--semi-color-fill-0);
1098
- }
1099
- .semi-button-group-line-borderless {
1100
- background-color: transparent;
1101
- }
1102
- .semi-button-group-line::before {
1103
- display: block;
1104
- content: "";
1105
- width: 1px;
1106
- height: 20px;
1107
- background-color: var(--semi-color-border);
1108
- }
1109
-
1110
- .semi-rtl .semi-button,
1111
- .semi-portal-rtl .semi-button {
1112
- direction: rtl;
1113
- padding-left: 12px;
1114
- padding-right: 12px;
1115
- }
1116
- .semi-rtl .semi-button-size-small,
1117
- .semi-portal-rtl .semi-button-size-small {
1118
- padding-left: 12px;
1119
- padding-right: 12px;
1120
- }
1121
- .semi-rtl .semi-button-size-large,
1122
- .semi-portal-rtl .semi-button-size-large {
1123
- padding-left: 16px;
1124
- padding-right: 16px;
1125
- }
1126
- .semi-rtl .semi-button-group,
1127
- .semi-portal-rtl .semi-button-group {
1128
- direction: rtl;
1129
- }
1130
- .semi-rtl .semi-button-group > .semi-button,
1131
- .semi-portal-rtl .semi-button-group > .semi-button {
1132
- padding-left: 0;
1133
- padding-right: 0;
1134
- }
1135
- .semi-rtl .semi-button-group > .semi-button .semi-button-content,
1136
- .semi-portal-rtl .semi-button-group > .semi-button .semi-button-content {
1137
- padding-left: 12px;
1138
- padding-right: 12px;
1139
- }
1140
- .semi-rtl .semi-button-group > .semi-button-size-large .semi-button-content,
1141
- .semi-portal-rtl .semi-button-group > .semi-button-size-large .semi-button-content {
1142
- padding-left: 16px;
1143
- padding-right: 16px;
1144
- }
1145
- .semi-rtl .semi-button-group > .semi-button-size-small .semi-button-content,
1146
- .semi-portal-rtl .semi-button-group > .semi-button-size-small .semi-button-content {
1147
- padding-left: 12px;
1148
- padding-right: 12px;
1149
- }
1150
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only,
1151
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only {
1152
- padding-left: 0;
1153
- padding-right: 0;
1154
- }
1155
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content,
1156
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
1157
- padding-left: 8px;
1158
- padding-right: 8px;
1159
- }
1160
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
1161
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
1162
- padding-left: 4px;
1163
- padding-right: 4px;
1164
- }
1165
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
1166
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
1167
- padding-left: 12px;
1168
- padding-right: 12px;
1169
- }
1170
- .semi-rtl .semi-button-group > .semi-button:first-child,
1171
- .semi-portal-rtl .semi-button-group > .semi-button:first-child {
1172
- border-top-left-radius: 0;
1173
- border-bottom-left-radius: 0;
1174
- border-top-right-radius: var(--semi-border-radius-small);
1175
- border-bottom-right-radius: var(--semi-border-radius-small);
1176
- }
1177
- .semi-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content,
1178
- .semi-portal-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content {
1179
- border-left: 1px var(--semi-color-border) solid;
1180
- border-right: 0;
1181
- }
1182
- .semi-rtl .semi-button-group > .semi-button:last-child,
1183
- .semi-portal-rtl .semi-button-group > .semi-button:last-child {
1184
- border-top-right-radius: 0;
1185
- border-bottom-right-radius: 0;
1186
- border-top-left-radius: var(--semi-border-radius-small);
1187
- border-bottom-left-radius: var(--semi-border-radius-small);
1188
- }
1189
- .semi-rtl .semi-button.semi-button-with-icon-only,
1190
- .semi-portal-rtl .semi-button.semi-button-with-icon-only {
1191
- padding-left: 8px;
1192
- padding-right: 8px;
1193
- }
1194
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
1195
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
1196
- padding-left: 4px;
1197
- padding-right: 4px;
1198
- }
1199
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
1200
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
1201
- padding-left: 12px;
1202
- padding-right: 12px;
1203
- }
1204
- .semi-rtl .semi-button-content-left,
1205
- .semi-portal-rtl .semi-button-content-left {
1206
- margin-left: 8px;
1207
- margin-right: 0;
1208
- }
1209
- .semi-rtl .semi-button-content-right,
1210
- .semi-portal-rtl .semi-button-content-right {
1211
- margin-right: 8px;
1212
- margin-left: 0;
1213
- }
1214
-
1215
- .semi-checkbox {
1216
- box-sizing: border-box;
1217
- position: relative;
1218
- display: flex;
1219
- align-items: flex-start;
1220
- font-size: 14px;
1221
- line-height: 20px;
1222
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1223
- cursor: pointer;
1224
- 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);
1225
- transform: scale(var(--semi-transform_scale-none));
1226
- column-gap: 8px;
1227
- }
1228
- .semi-checkbox input[type=checkbox] {
1229
- position: absolute;
1230
- left: 0;
1231
- top: 0;
1232
- width: 100%;
1233
- height: 100%;
1234
- margin: 0;
1235
- opacity: 0;
1236
- }
1237
- .semi-checkbox-content {
1238
- flex: 1;
1239
- display: flex;
1240
- flex-direction: column;
1241
- row-gap: 4px;
1242
- }
1243
- .semi-checkbox-addon {
1244
- display: flex;
1245
- flex: 1;
1246
- align-items: center;
1247
- color: var(--semi-color-text-0);
1248
- line-height: 20px;
1249
- user-select: none;
1250
- }
1251
- .semi-checkbox:hover .semi-checkbox-inner-display {
1252
- background: var(--semi-color-fill-0);
1253
- box-shadow: inset 0 0 0 1px var(--semi-color-focus-border);
1254
- }
1255
- .semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1256
- background: var(--semi-color-primary-hover);
1257
- box-shadow: none;
1258
- }
1259
- .semi-checkbox:active .semi-checkbox-inner-display {
1260
- background: var(--semi-color-fill-1);
1261
- }
1262
- .semi-checkbox:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1263
- background: var(--semi-color-primary-active);
1264
- box-shadow: none;
1265
- }
1266
- .semi-checkbox.semi-checkbox-disabled:hover .semi-checkbox-inner-display, .semi-checkbox.semi-checkbox-disabled:active .semi-checkbox-inner-display {
1267
- background: var(--semi-color-disabled-fill);
1268
- box-shadow: inset 0 0 0 1px var(--semi-color-border);
1269
- }
1270
- .semi-checkbox.semi-checkbox-disabled:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display, .semi-checkbox.semi-checkbox-disabled:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1271
- color: var(--semi-color-white);
1272
- background: var(--semi-color-primary-disabled);
1273
- box-shadow: none;
1274
- }
1275
- .semi-checkbox-inner {
1276
- position: relative;
1277
- display: flex;
1278
- align-items: center;
1279
- width: 16px;
1280
- height: 20px;
1281
- user-select: none;
1282
- cursor: pointer;
1283
- }
1284
- .semi-checkbox-inner-display {
1285
- box-sizing: border-box;
1286
- position: relative;
1287
- width: 16px;
1288
- height: 16px;
1289
- margin: 0;
1290
- background: transparent;
1291
- 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);
1292
- box-shadow: inset 0 0 0 1px var(--semi-color-text-3);
1293
- border-radius: var(--semi-border-radius-extra-small);
1294
- }
1295
- .semi-checkbox-inner-display .semi-icon {
1296
- font-size: 16px;
1297
- }
1298
- .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1299
- background: var(--semi-color-primary);
1300
- color: var(--semi-color-white);
1301
- box-shadow: inset 0 0 0 1px var(--semi-color-primary);
1302
- border-radius: var(--semi-border-radius-extra-small);
1303
- }
1304
- .semi-checkbox-inner-checked > .semi-checkbox-addon {
1305
- color: var(--semi-color-text-0);
1306
- }
1307
- .semi-checkbox:hover .semi-checkbox-inner-display {
1308
- background: var(--semi-color-fill-0);
1309
- }
1310
- .semi-checkbox:hover.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1311
- background: var(--semi-color-primary-hover);
1312
- box-shadow: none;
1313
- color: var(--semi-color-white);
1314
- }
1315
- .semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1316
- background: var(--semi-color-primary-hover);
1317
- border-color: var(--semi-color-primary-hover);
1318
- color: var(--semi-color-white);
1319
- }
1320
- .semi-checkbox:hover.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
1321
- background: var(--semi-color-white);
1322
- }
1323
- .semi-checkbox:active .semi-checkbox-inner-display {
1324
- background: var(--semi-color-fill-1);
1325
- }
1326
- .semi-checkbox:active.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1327
- background: var(--semi-color-primary-active);
1328
- border-color: var(--semi-color-primary-active);
1329
- color: var(--semi-color-white);
1330
- box-shadow: none;
1331
- }
1332
- .semi-checkbox:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1333
- background: var(--semi-color-primary-active);
1334
- border-color: var(--semi-color-primary-active);
1335
- color: var(--semi-color-white);
1336
- }
1337
- .semi-checkbox:active.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
1338
- background: var(--semi-color-white);
1339
- }
1340
- .semi-checkbox-cardType {
1341
- flex-wrap: nowrap;
1342
- align-items: flex-start;
1343
- border-radius: 3px;
1344
- padding: 12px 16px;
1345
- background: transparent;
1346
- border: 1px solid transparent;
1347
- }
1348
- .semi-checkbox-cardType .semi-checkbox-inner {
1349
- position: relative;
1350
- flex-shrink: 0;
1351
- }
1352
- .semi-checkbox-cardType .semi-checkbox-inner-display {
1353
- background: var(--semi-color-white);
1354
- }
1355
- .semi-checkbox-cardType .semi-checkbox-inner-pureCardType {
1356
- opacity: 0;
1357
- width: 0;
1358
- }
1359
- .semi-checkbox-cardType .semi-checkbox-addon {
1360
- font-weight: 600;
1361
- font-size: 14px;
1362
- line-height: 20px;
1363
- color: var(--semi-color-text-0);
1364
- }
1365
- .semi-checkbox-cardType .semi-checkbox-extra {
1366
- font-weight: normal;
1367
- font-size: 14px;
1368
- line-height: 20px;
1369
- color: var(--semi-color-text-2);
1370
- }
1371
- .semi-checkbox-cardType .semi-checkbox-extra.semi-checkbox-cardType_extra_noChildren {
1372
- margin-top: 0;
1373
- }
1374
- .semi-checkbox-cardType:hover {
1375
- background: var(--semi-color-fill-0);
1376
- }
1377
- .semi-checkbox-cardType:active {
1378
- background: var(--semi-color-fill-1);
1379
- }
1380
- .semi-checkbox-cardType_checked {
1381
- background: var(--semi-color-primary-light-default);
1382
- border: 1px solid var(--semi-color-primary);
1383
- }
1384
- .semi-checkbox-cardType_checked:hover {
1385
- background: var(--semi-color-primary-light-default);
1386
- border-color: var(--semi-color-primary-hover);
1387
- }
1388
- .semi-checkbox-cardType_checked:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1389
- box-shadow: none;
1390
- }
1391
- .semi-checkbox-cardType_checked:active {
1392
- background: var(--semi-color-primary-light-default);
1393
- border-color: var(--semi-color-primary-active);
1394
- }
1395
- .semi-checkbox-cardType_disabled:active {
1396
- background: transparent;
1397
- }
1398
- .semi-checkbox-cardType_disabled:hover {
1399
- background: transparent;
1400
- }
1401
- .semi-checkbox-cardType_checked_disabled.semi-checkbox-cardType {
1402
- background: var(--semi-color-primary-light-default);
1403
- border: 1px solid var(--semi-color-primary-disabled);
1404
- }
1405
- .semi-checkbox-cardType_checked_disabled.semi-checkbox-cardType:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1406
- box-shadow: none;
1407
- }
1408
- .semi-checkbox-indeterminate .semi-checkbox-inner-display, .semi-checkbox-checked .semi-checkbox-inner-display {
1409
- background: var(--semi-color-primary);
1410
- color: var(--semi-color-white);
1411
- box-shadow: inset 0 0 0 1px var(--semi-color-primary);
1412
- border-radius: var(--semi-border-radius-extra-small);
1413
- }
1414
- .semi-checkbox-indeterminate .semi-checkbox-inner-display:hover, .semi-checkbox-checked .semi-checkbox-inner-display:hover {
1415
- background: var(--semi-color-primary-hover);
1416
- border-color: var(--semi-color-primary-hover);
1417
- color: var(--semi-color-white);
1418
- }
1419
- .semi-checkbox-indeterminate .semi-checkbox-inner-display:active, .semi-checkbox-checked .semi-checkbox-inner-display:active {
1420
- background: var(--semi-color-primary-active);
1421
- border-color: var(--semi-color-primary-active);
1422
- color: var(--semi-color-white);
1423
- }
1424
- .semi-checkbox-indeterminate .semi-checkbox-inner-addon, .semi-checkbox-checked .semi-checkbox-inner-addon {
1425
- color: var(--semi-color-text-0);
1426
- }
1427
- .semi-checkbox-disabled {
1428
- cursor: not-allowed;
1429
- }
1430
- .semi-checkbox-disabled .semi-checkbox-inner {
1431
- cursor: not-allowed;
1432
- }
1433
- .semi-checkbox-disabled .semi-checkbox-inner-display {
1434
- color: var(--semi-color-white);
1435
- background: var(--semi-color-disabled-fill);
1436
- box-shadow: inset 0 0 0 1px var(--semi-color-border);
1437
- }
1438
- .semi-checkbox-disabled .semi-checkbox-inner-display:hover {
1439
- color: var(--semi-color-white);
1440
- background: transparent;
1441
- }
1442
- .semi-checkbox-disabled .semi-checkbox-inner-checked {
1443
- color: var(--semi-color-white);
1444
- }
1445
- .semi-checkbox-disabled .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1446
- opacity: 0.75;
1447
- background: var(--semi-color-primary-disabled);
1448
- box-shadow: inset 0 0 0 1px var(--semi-color-primary-disabled);
1449
- }
1450
- .semi-checkbox-disabled .semi-checkbox-inner-checked .semi-checkbox-inner-display:hover {
1451
- color: var(--semi-color-white);
1452
- background: var(--semi-color-primary-disabled);
1453
- }
1454
- .semi-checkbox-disabled .semi-checkbox-addon {
1455
- color: var(--semi-color-disabled-text);
1456
- }
1457
- .semi-checkbox-disabled .semi-checkbox-extra {
1458
- color: var(--semi-color-disabled-text);
1459
- }
1460
- .semi-checkbox.semi-checkbox-disabled.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1461
- opacity: 0.75;
1462
- background: var(--semi-color-primary-disabled);
1463
- box-shadow: inset 0 0 0 1px var(--semi-color-primary-disabled);
1464
- color: var(--semi-color-white);
1465
- }
1466
- .semi-checkbox-extra {
1467
- flex-shrink: 0;
1468
- flex-grow: 1;
1469
- flex-basis: 100%;
1470
- box-sizing: border-box;
1471
- color: var(--semi-color-text-2);
1472
- }
1473
- .semi-checkbox-focus {
1474
- outline: 2px solid var(--semi-color-primary-light-active);
1475
- }
1476
- .semi-checkbox-focus-border {
1477
- box-shadow: inset 0 0 0 1px var(--semi-color-focus-border);
1478
- }
1479
-
1480
- .semi-checkboxGroup {
1481
- font-size: 14px;
1482
- line-height: 20px;
1483
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1484
- line-height: 14px;
1485
- }
1486
- .semi-checkboxGroup .semi-checkbox.semi-checkbox-vertical {
1487
- margin-bottom: 16px;
1488
- }
1489
- .semi-checkboxGroup-horizontal {
1490
- display: flex;
1491
- flex-wrap: wrap;
1492
- gap: 16px;
1493
- }
1494
- .semi-checkboxGroup-horizontal .semi-checkbox {
1495
- display: inline-flex;
1496
- }
1497
- .semi-checkboxGroup-vertical {
1498
- display: flex;
1499
- flex-direction: column;
1500
- row-gap: 12px;
1501
- }
1502
- .semi-checkboxGroup-vertical-cardType {
1503
- row-gap: 16px;
1504
- }
1505
- .semi-checkboxGroup-vertical-pureCardType .semi-checkbox {
1506
- column-gap: 0;
1507
- }
1508
-
1509
- .semi-rtl .semi-checkbox,
1510
- .semi-portal-rtl .semi-checkbox {
1511
- direction: rtl;
1512
- }
1513
- .semi-rtl .semi-checkbox input[type=checkbox],
1514
- .semi-portal-rtl .semi-checkbox input[type=checkbox] {
1515
- left: auto;
1516
- right: 0;
1517
- }
1518
- .semi-rtl .semi-checkboxGroup,
1519
- .semi-portal-rtl .semi-checkboxGroup {
1520
- direction: rtl;
1521
- }
1522
-
1523
- .semi-avatar {
1524
- position: relative;
1525
- display: inline-flex;
1526
- overflow: hidden;
1527
- align-items: center;
1528
- justify-content: center;
1529
- white-space: nowrap;
1530
- text-align: center;
1531
- vertical-align: middle;
1532
- }
1533
- .semi-avatar:focus-visible {
1534
- outline: 2px solid var(--semi-color-primary-light-active);
1535
- }
1536
- .semi-avatar-focus {
1537
- outline: 2px solid var(--semi-color-primary-light-active);
1538
- }
1539
- .semi-avatar-no-focus-visible:focus-visible {
1540
- outline: none;
1541
- }
1542
- .semi-avatar .semi-avatar-label {
1543
- display: flex;
1544
- align-items: center;
1545
- font-size: 14px;
1546
- line-height: 20px;
1547
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1548
- font-weight: 600;
1549
- }
1550
- .semi-avatar-content {
1551
- user-select: none;
1552
- }
1553
- .semi-avatar-extra-extra-small {
1554
- width: 20px;
1555
- height: 20px;
1556
- border-radius: 3px;
1557
- }
1558
- .semi-avatar-extra-extra-small .semi-avatar-content {
1559
- transform-origin: center;
1560
- transform: scale(0.8);
1561
- }
1562
- .semi-avatar-extra-extra-small .semi-avatar-label {
1563
- font-size: 10px;
1564
- line-height: 15px;
1565
- }
1566
- .semi-avatar-extra-small {
1567
- width: 24px;
1568
- height: 24px;
1569
- border-radius: 3px;
1570
- }
1571
- .semi-avatar-extra-small .semi-avatar-content {
1572
- transform-origin: center;
1573
- transform: scale(0.8);
1574
- }
1575
- .semi-avatar-extra-small .semi-avatar-label {
1576
- font-size: 10px;
1577
- line-height: 15px;
1578
- }
1579
- .semi-avatar-small {
1580
- width: 32px;
1581
- height: 32px;
1582
- border-radius: 3px;
1583
- }
1584
- .semi-avatar-small .semi-avatar-label {
1585
- font-size: 12px;
1586
- line-height: 16px;
1587
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1588
- }
1589
- .semi-avatar-default {
1590
- width: 40px;
1591
- height: 40px;
1592
- border-radius: 3px;
1593
- }
1594
- .semi-avatar-default .semi-avatar-label {
1595
- font-size: 18px;
1596
- line-height: 24px;
1597
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1598
- }
1599
- .semi-avatar-medium {
1600
- width: 48px;
1601
- height: 48px;
1602
- border-radius: 3px;
1603
- }
1604
- .semi-avatar-medium .semi-avatar-label {
1605
- font-size: 20px;
1606
- line-height: 28px;
1607
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1608
- }
1609
- .semi-avatar-large {
1610
- width: 72px;
1611
- height: 72px;
1612
- border-radius: 6px;
1613
- }
1614
- .semi-avatar-large .semi-avatar-label {
1615
- font-size: 32px;
1616
- line-height: 44px;
1617
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1618
- }
1619
- .semi-avatar-extra-large {
1620
- width: 128px;
1621
- height: 128px;
1622
- border-radius: 12px;
1623
- }
1624
- .semi-avatar-extra-large .semi-avatar-label {
1625
- font-size: 64px;
1626
- line-height: 77px;
1627
- }
1628
- .semi-avatar-circle {
1629
- border-radius: var(--semi-border-radius-circle);
1630
- }
1631
- .semi-avatar-image {
1632
- background-color: transparent;
1633
- }
1634
- .semi-avatar > img {
1635
- display: block;
1636
- width: 100%;
1637
- height: 100%;
1638
- object-fit: cover;
1639
- }
1640
- .semi-avatar-hover {
1641
- position: absolute;
1642
- left: 0;
1643
- top: 0;
1644
- width: 100%;
1645
- height: 100%;
1646
- }
1647
- .semi-avatar:hover {
1648
- cursor: pointer;
1649
- }
1650
-
1651
- .semi-avatar-wrapper {
1652
- position: relative;
1653
- display: inline-flex;
1654
- flex-direction: column;
1655
- align-items: center;
1656
- width: fit-content;
1657
- }
1658
- .semi-avatar-wrapper .semi-avatar-top_slot-bg {
1659
- position: absolute;
1660
- display: flex;
1661
- justify-content: center;
1662
- border-radius: 50%;
1663
- overflow: hidden;
1664
- }
1665
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-small {
1666
- width: 32px;
1667
- height: 32px;
1668
- }
1669
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-default {
1670
- width: 40px;
1671
- height: 40px;
1672
- }
1673
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-medium {
1674
- width: 48px;
1675
- height: 48px;
1676
- }
1677
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-large {
1678
- width: 72px;
1679
- height: 72px;
1680
- }
1681
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-extra-large {
1682
- width: 128px;
1683
- height: 128px;
1684
- }
1685
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg {
1686
- position: absolute;
1687
- }
1688
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-small {
1689
- top: -28px;
1690
- scale: 0.4;
1691
- }
1692
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-default {
1693
- top: -32px;
1694
- scale: 0.7;
1695
- }
1696
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-medium {
1697
- top: -30px;
1698
- scale: 0.8;
1699
- }
1700
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-large {
1701
- top: -30px;
1702
- scale: 1.1;
1703
- }
1704
- .semi-avatar-wrapper .semi-avatar-top_slot-bg-svg-extra-large {
1705
- top: -32px;
1706
- scale: 1.4;
1707
- }
1708
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper {
1709
- position: absolute;
1710
- display: flex;
1711
- justify-content: center;
1712
- }
1713
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot {
1714
- color: var(--semi-color-bg-0);
1715
- font-weight: 600;
1716
- }
1717
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content {
1718
- user-select: none;
1719
- position: relative;
1720
- line-height: normal;
1721
- }
1722
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-small {
1723
- font-size: 5px;
1724
- margin-top: 0px;
1725
- }
1726
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-default {
1727
- font-size: 6px;
1728
- margin-top: -2px;
1729
- }
1730
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-medium {
1731
- font-size: 8px;
1732
- margin-top: 0px;
1733
- }
1734
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-large {
1735
- font-size: 14px;
1736
- margin-top: 0px;
1737
- }
1738
- .semi-avatar-wrapper .semi-avatar-top_slot-wrapper .semi-avatar-top_slot-content-extra-large {
1739
- font-size: 16px;
1740
- margin-top: 0px;
1741
- }
1742
- .semi-avatar-wrapper .semi-avatar-bottom_slot {
1743
- color: var(--semi-color-bg-0);
1744
- position: absolute;
1745
- cursor: pointer;
1746
- bottom: 3.5px;
1747
- transform: translateY(50%);
1748
- user-select: none;
1749
- }
1750
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle {
1751
- display: flex;
1752
- justify-content: center;
1753
- align-items: center;
1754
- background: var(--semi-color-primary);
1755
- border-radius: var(--semi-border-radius-circle);
1756
- line-height: normal;
1757
- }
1758
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-small {
1759
- width: 12px;
1760
- height: 12px;
1761
- font-size: 5px;
1762
- }
1763
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-small {
1764
- width: 12px;
1765
- height: 12px;
1766
- font-size: 5px;
1767
- }
1768
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-default {
1769
- width: 16px;
1770
- height: 16px;
1771
- font-size: 12px;
1772
- }
1773
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-medium {
1774
- width: 18px;
1775
- height: 18px;
1776
- font-size: 12px;
1777
- }
1778
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-large {
1779
- width: 28px;
1780
- height: 28px;
1781
- font-size: 12px;
1782
- }
1783
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_circle-extra-large {
1784
- width: 28px;
1785
- height: 28px;
1786
- font-size: 14px;
1787
- }
1788
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square {
1789
- display: flex;
1790
- justify-content: center;
1791
- align-items: center;
1792
- background: var(--semi-color-primary);
1793
- border-radius: 4px;
1794
- padding: 1px 4px;
1795
- font-weight: 600;
1796
- border-style: solid;
1797
- border-color: var(--semi-color-bg-0);
1798
- }
1799
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra_small {
1800
- font-size: 5px;
1801
- border-width: 2px;
1802
- }
1803
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-small {
1804
- font-size: 5px;
1805
- border-width: 2px;
1806
- }
1807
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-default {
1808
- font-size: 12px;
1809
- border-width: 2px;
1810
- }
1811
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-medium {
1812
- font-size: 12px;
1813
- border-width: 2px;
1814
- }
1815
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-large {
1816
- font-size: 12px;
1817
- border-width: 2px;
1818
- }
1819
- .semi-avatar-wrapper .semi-avatar-bottom_slot-shape_square-extra-large {
1820
- font-size: 14px;
1821
- border-width: 2px;
1822
- }
1823
-
1824
- .semi-avatar-group {
1825
- display: inline-block;
1826
- }
1827
- .semi-avatar-group .semi-avatar {
1828
- box-sizing: border-box;
1829
- }
1830
- .semi-avatar-group .semi-avatar:first-child {
1831
- margin-left: 0;
1832
- }
1833
- .semi-avatar-group .semi-avatar-extra-large {
1834
- border: 3px var(--semi-color-bg-1) solid;
1835
- margin-left: -32px;
1836
- }
1837
- .semi-avatar-group .semi-avatar-large {
1838
- border: 3px var(--semi-color-bg-1) solid;
1839
- margin-left: -18px;
1840
- }
1841
- .semi-avatar-group .semi-avatar-medium {
1842
- border: 2px var(--semi-color-bg-1) solid;
1843
- margin-left: -12px;
1844
- }
1845
- .semi-avatar-group .semi-avatar-default {
1846
- border: 2px var(--semi-color-bg-1) solid;
1847
- margin-left: -12px;
1848
- }
1849
- .semi-avatar-group .semi-avatar-small {
1850
- border: 2px var(--semi-color-bg-1) solid;
1851
- margin-left: -12px;
1852
- }
1853
- .semi-avatar-group .semi-avatar-extra-small {
1854
- border: 1px var(--semi-color-bg-1) solid;
1855
- margin-left: -10px;
1856
- }
1857
- .semi-avatar-group .semi-avatar-extra-extra-small {
1858
- border: 1px var(--semi-color-bg-1) solid;
1859
- margin-left: -4px;
1860
- }
1861
- .semi-avatar-group .semi-avatar-item-start-0 {
1862
- z-index: 100;
1863
- }
1864
- .semi-avatar-group .semi-avatar-item-end-0 {
1865
- z-index: 80;
1866
- }
1867
- .semi-avatar-group .semi-avatar-item-start-1 {
1868
- z-index: 99;
1869
- }
1870
- .semi-avatar-group .semi-avatar-item-end-1 {
1871
- z-index: 81;
1872
- }
1873
- .semi-avatar-group .semi-avatar-item-start-2 {
1874
- z-index: 98;
1875
- }
1876
- .semi-avatar-group .semi-avatar-item-end-2 {
1877
- z-index: 82;
1878
- }
1879
- .semi-avatar-group .semi-avatar-item-start-3 {
1880
- z-index: 97;
1881
- }
1882
- .semi-avatar-group .semi-avatar-item-end-3 {
1883
- z-index: 83;
1884
- }
1885
- .semi-avatar-group .semi-avatar-item-start-4 {
1886
- z-index: 96;
1887
- }
1888
- .semi-avatar-group .semi-avatar-item-end-4 {
1889
- z-index: 84;
1890
- }
1891
- .semi-avatar-group .semi-avatar-item-start-5 {
1892
- z-index: 95;
1893
- }
1894
- .semi-avatar-group .semi-avatar-item-end-5 {
1895
- z-index: 85;
1896
- }
1897
- .semi-avatar-group .semi-avatar-item-start-6 {
1898
- z-index: 94;
1899
- }
1900
- .semi-avatar-group .semi-avatar-item-end-6 {
1901
- z-index: 86;
1902
- }
1903
- .semi-avatar-group .semi-avatar-item-start-7 {
1904
- z-index: 93;
1905
- }
1906
- .semi-avatar-group .semi-avatar-item-end-7 {
1907
- z-index: 87;
1908
- }
1909
- .semi-avatar-group .semi-avatar-item-start-8 {
1910
- z-index: 92;
1911
- }
1912
- .semi-avatar-group .semi-avatar-item-end-8 {
1913
- z-index: 88;
1914
- }
1915
- .semi-avatar-group .semi-avatar-item-start-9 {
1916
- z-index: 91;
1917
- }
1918
- .semi-avatar-group .semi-avatar-item-end-9 {
1919
- z-index: 89;
1920
- }
1921
- .semi-avatar-group .semi-avatar-item-start-10 {
1922
- z-index: 90;
1923
- }
1924
- .semi-avatar-group .semi-avatar-item-end-10 {
1925
- z-index: 90;
1926
- }
1927
- .semi-avatar-group .semi-avatar-item-start-11 {
1928
- z-index: 89;
1929
- }
1930
- .semi-avatar-group .semi-avatar-item-end-11 {
1931
- z-index: 91;
1932
- }
1933
- .semi-avatar-group .semi-avatar-item-start-12 {
1934
- z-index: 88;
1935
- }
1936
- .semi-avatar-group .semi-avatar-item-end-12 {
1937
- z-index: 92;
1938
- }
1939
- .semi-avatar-group .semi-avatar-item-start-13 {
1940
- z-index: 87;
1941
- }
1942
- .semi-avatar-group .semi-avatar-item-end-13 {
1943
- z-index: 93;
1944
- }
1945
- .semi-avatar-group .semi-avatar-item-start-14 {
1946
- z-index: 86;
1947
- }
1948
- .semi-avatar-group .semi-avatar-item-end-14 {
1949
- z-index: 94;
1950
- }
1951
- .semi-avatar-group .semi-avatar-item-start-15 {
1952
- z-index: 85;
1953
- }
1954
- .semi-avatar-group .semi-avatar-item-end-15 {
1955
- z-index: 95;
1956
- }
1957
- .semi-avatar-group .semi-avatar-item-start-16 {
1958
- z-index: 84;
1959
- }
1960
- .semi-avatar-group .semi-avatar-item-end-16 {
1961
- z-index: 96;
1962
- }
1963
- .semi-avatar-group .semi-avatar-item-start-17 {
1964
- z-index: 83;
1965
- }
1966
- .semi-avatar-group .semi-avatar-item-end-17 {
1967
- z-index: 97;
1968
- }
1969
- .semi-avatar-group .semi-avatar-item-start-18 {
1970
- z-index: 82;
1971
- }
1972
- .semi-avatar-group .semi-avatar-item-end-18 {
1973
- z-index: 98;
1974
- }
1975
- .semi-avatar-group .semi-avatar-item-start-19 {
1976
- z-index: 81;
1977
- }
1978
- .semi-avatar-group .semi-avatar-item-end-19 {
1979
- z-index: 99;
1980
- }
1981
- .semi-avatar-group .semi-avatar-item-start-20 {
1982
- z-index: 80;
1983
- }
1984
- .semi-avatar-group .semi-avatar-item-end-20 {
1985
- z-index: 100;
1986
- }
1987
- .semi-avatar-group .semi-avatar-item-more {
1988
- background-color: rgba(var(--semi-grey-5), 1);
1989
- }
1990
-
1991
- .semi-avatar-amber {
1992
- background-color: rgba(var(--semi-amber-3), 1);
1993
- color: rgba(var(--semi-white), 1);
1994
- }
1995
-
1996
- .semi-avatar-blue {
1997
- background-color: rgba(var(--semi-blue-3), 1);
1998
- color: rgba(var(--semi-white), 1);
1999
- }
2000
-
2001
- .semi-avatar-cyan {
2002
- background-color: rgba(var(--semi-cyan-3), 1);
2003
- color: rgba(var(--semi-white), 1);
2004
- }
2005
-
2006
- .semi-avatar-green {
2007
- background-color: rgba(var(--semi-green-3), 1);
2008
- color: rgba(var(--semi-white), 1);
2009
- }
2010
-
2011
- .semi-avatar-grey {
2012
- background-color: rgba(var(--semi-grey-3), 1);
2013
- color: rgba(var(--semi-white), 1);
2014
- }
2015
-
2016
- .semi-avatar-indigo {
2017
- background-color: rgba(var(--semi-indigo-3), 1);
2018
- color: rgba(var(--semi-white), 1);
2019
- }
2020
-
2021
- .semi-avatar-light-blue {
2022
- background-color: rgba(var(--semi-light-blue-3), 1);
2023
- color: rgba(var(--semi-white), 1);
2024
- }
2025
-
2026
- .semi-avatar-light-green {
2027
- background-color: rgba(var(--semi-light-green-3), 1);
2028
- color: rgba(var(--semi-white), 1);
2029
- }
2030
-
2031
- .semi-avatar-lime {
2032
- background-color: rgba(var(--semi-lime-3), 1);
2033
- color: rgba(var(--semi-white), 1);
2034
- }
2035
-
2036
- .semi-avatar-orange {
2037
- background-color: rgba(var(--semi-orange-3), 1);
2038
- color: rgba(var(--semi-white), 1);
2039
- }
2040
-
2041
- .semi-avatar-pink {
2042
- background-color: rgba(var(--semi-pink-3), 1);
2043
- color: rgba(var(--semi-white), 1);
2044
- }
2045
-
2046
- .semi-avatar-purple {
2047
- background-color: rgba(var(--semi-purple-3), 1);
2048
- color: rgba(var(--semi-white), 1);
2049
- }
2050
-
2051
- .semi-avatar-red {
2052
- background-color: rgba(var(--semi-red-3), 1);
2053
- color: rgba(var(--semi-white), 1);
2054
- }
2055
-
2056
- .semi-avatar-teal {
2057
- background-color: rgba(var(--semi-teal-3), 1);
2058
- color: rgba(var(--semi-white), 1);
2059
- }
2060
-
2061
- .semi-avatar-violet {
2062
- background-color: rgba(var(--semi-violet-3), 1);
2063
- color: rgba(var(--semi-white), 1);
2064
- }
2065
-
2066
- .semi-avatar-yellow {
2067
- background-color: rgba(var(--semi-yellow-3), 1);
2068
- color: rgba(var(--semi-white), 1);
2069
- }
2070
-
2071
- .semi-avatar-additionalBorder {
2072
- border-style: solid;
2073
- border-color: var(--semi-color-primary);
2074
- display: inline-block;
2075
- box-sizing: border-box;
2076
- position: absolute;
2077
- border-width: 1.5px;
2078
- top: -3.5px;
2079
- left: -3.5px;
2080
- }
2081
- .semi-avatar-additionalBorder-extra-extra-small {
2082
- width: 27px;
2083
- height: 27px;
2084
- }
2085
- .semi-avatar-additionalBorder-extra-small {
2086
- width: 31px;
2087
- height: 31px;
2088
- }
2089
- .semi-avatar-additionalBorder-small {
2090
- width: 39px;
2091
- height: 39px;
2092
- }
2093
- .semi-avatar-additionalBorder-default {
2094
- width: 47px;
2095
- height: 47px;
2096
- }
2097
- .semi-avatar-additionalBorder-medium {
2098
- width: 55px;
2099
- height: 55px;
2100
- }
2101
- .semi-avatar-additionalBorder-large {
2102
- width: 79px;
2103
- height: 79px;
2104
- }
2105
- .semi-avatar-additionalBorder-extra-large {
2106
- width: 135px;
2107
- height: 135px;
2108
- }
2109
-
2110
- .semi-avatar-square.semi-avatar-additionalBorder-extra_extra_small {
2111
- border-radius: 3px;
2112
- }
2113
-
2114
- .semi-avatar-square.semi-avatar-additionalBorder-extra_small {
2115
- border-radius: 3px;
2116
- }
2117
-
2118
- .semi-avatar-square.semi-avatar-additionalBorder-small {
2119
- border-radius: 3px;
2120
- }
2121
-
2122
- .semi-avatar-square.semi-avatar-additionalBorder-default {
2123
- border-radius: 3px;
2124
- }
2125
-
2126
- .semi-avatar-square.semi-avatar-additionalBorder-medium {
2127
- border-radius: 3px;
2128
- }
2129
-
2130
- .semi-avatar-square.semi-avatar-additionalBorder-large {
2131
- border-radius: 6px;
2132
- }
2133
-
2134
- .semi-avatar-additionalBorder-circle {
2135
- border-radius: var(--semi-border-radius-circle);
2136
- }
2137
-
2138
- .semi-avatar-additionalBorder-animated {
2139
- animation: 800ms linear infinite semi-avatar-additionalBorder;
2140
- }
2141
-
2142
- .semi-avatar-animated {
2143
- animation: 1000ms linear infinite semi-avatar-content;
2144
- }
2145
-
2146
- @keyframes semi-avatar-additionalBorder {
2147
- 0% {
2148
- opacity: 1;
2149
- transform: scale(1);
2150
- }
2151
- to {
2152
- border-width: 0;
2153
- opacity: 0;
2154
- transform: scale(1.15);
2155
- }
2156
- }
2157
- @keyframes semi-avatar-content {
2158
- 0% {
2159
- transform: scale(1);
2160
- }
2161
- 50% {
2162
- transform: scale(0.9);
2163
- }
2164
- to {
2165
- transform: scale(1);
2166
- }
2167
- }
2168
- .semi-rtl .semi-avatar,
2169
- .semi-portal-rtl .semi-avatar {
2170
- direction: rtl;
2171
- }
2172
- .semi-rtl .semi-avatar-extra-extra-small .semi-avatar-content,
2173
- .semi-portal-rtl .semi-avatar-extra-extra-small .semi-avatar-content {
2174
- transform: scale(0.8);
2175
- }
2176
- .semi-rtl .semi-avatar-extra-small .semi-avatar-content,
2177
- .semi-portal-rtl .semi-avatar-extra-small .semi-avatar-content {
2178
- transform: scale(0.8);
2179
- }
2180
- .semi-rtl .semi-avatar-hover,
2181
- .semi-portal-rtl .semi-avatar-hover {
2182
- left: auto;
2183
- right: 0;
2184
- }
2185
- .semi-rtl .semi-avatar-group,
2186
- .semi-portal-rtl .semi-avatar-group {
2187
- direction: rtl;
2188
- }
2189
- .semi-rtl .semi-avatar-group .semi-avatar:first-child,
2190
- .semi-portal-rtl .semi-avatar-group .semi-avatar:first-child {
2191
- margin-left: auto;
2192
- margin-right: 0;
2193
- }
2194
- .semi-rtl .semi-avatar-group .semi-avatar-extra-large,
2195
- .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-large {
2196
- margin-left: auto;
2197
- margin-right: -32px;
2198
- }
2199
- .semi-rtl .semi-avatar-group .semi-avatar-large,
2200
- .semi-portal-rtl .semi-avatar-group .semi-avatar-large {
2201
- margin-left: auto;
2202
- margin-right: -18px;
2203
- }
2204
- .semi-rtl .semi-avatar-group .semi-avatar-medium,
2205
- .semi-rtl .semi-avatar-group .semi-avatar-small,
2206
- .semi-portal-rtl .semi-avatar-group .semi-avatar-medium,
2207
- .semi-portal-rtl .semi-avatar-group .semi-avatar-small {
2208
- margin-left: auto;
2209
- margin-right: -12px;
2210
- }
2211
- .semi-rtl .semi-avatar-group .semi-avatar-extra-small,
2212
- .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-small {
2213
- margin-left: auto;
2214
- margin-right: -10px;
2215
- }
2216
- .semi-rtl .semi-avatar-group .semi-avatar-extra-extra-small,
2217
- .semi-portal-rtl .semi-avatar-group .semi-avatar-extra-extra-small {
2218
- margin-left: auto;
2219
- margin-right: -4px;
2220
- }
2221
-
2222
- .semi-image {
2223
- border-radius: var(--semi-border-radius-small);
2224
- position: relative;
2225
- display: inline-block;
2226
- overflow: hidden;
2227
- }
2228
- .semi-image img {
2229
- /**
2230
- * In tailwind, the max-width of img/video is set to 100%,
2231
- * which will affect the amplification effect of the picture.
2232
- * So we need to set max-width to none.
2233
- */
2234
- max-width: none;
2235
- }
2236
- .semi-image-tooltip-children-wrapper {
2237
- display: inline-flex;
2238
- width: fit-content;
2239
- height: fit-content;
2240
- vertical-align: middle;
2241
- }
2242
- .semi-image-img {
2243
- vertical-align: top;
2244
- border-radius: inherit;
2245
- user-select: none;
2246
- }
2247
- .semi-image-img-preview {
2248
- cursor: zoom-in;
2249
- }
2250
- .semi-image-img-error {
2251
- opacity: 0;
2252
- }
2253
- .semi-image-overlay {
2254
- position: absolute;
2255
- top: 0;
2256
- left: 0;
2257
- width: 100%;
2258
- height: 100%;
2259
- }
2260
-
2261
- .semi-image-status {
2262
- width: 100%;
2263
- height: 100%;
2264
- display: flex;
2265
- justify-content: center;
2266
- align-items: center;
2267
- border-radius: var(--semi-border-radius-small);
2268
- background-color: var(--semi-color-fill-0);
2269
- color: var(--semi-color-disabled-text);
2270
- }
2271
-
2272
- .semi-image-preview {
2273
- position: fixed;
2274
- top: 0;
2275
- left: 0;
2276
- width: 100%;
2277
- height: 100%;
2278
- z-index: 1070;
2279
- background-color: var(--semi-color-overlay-bg);
2280
- transition: opacity 500ms;
2281
- overflow: hidden;
2282
- }
2283
- .semi-image-preview-popup {
2284
- position: absolute;
2285
- }
2286
- .semi-image-preview .semi-image-preview-hide {
2287
- opacity: 0;
2288
- }
2289
- .semi-image-preview-icon {
2290
- display: flex;
2291
- justify-content: center;
2292
- align-items: center;
2293
- width: 40px;
2294
- height: 40px;
2295
- border-radius: 50%;
2296
- position: absolute;
2297
- top: 50%;
2298
- transform: translateY(-50%);
2299
- background: rgba(0, 0, 0, 0.75);
2300
- cursor: pointer;
2301
- color: var(--semi-color-white);
2302
- }
2303
- .semi-image-preview-prev {
2304
- left: 24px;
2305
- }
2306
- .semi-image-preview-next {
2307
- right: 24px;
2308
- }
2309
- .semi-image-preview-header {
2310
- position: absolute;
2311
- top: 0;
2312
- left: 0;
2313
- right: 0;
2314
- font-weight: normal;
2315
- font-size: 14px;
2316
- line-height: 20px;
2317
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2318
- color: var(--semi-color-white);
2319
- height: 60px;
2320
- display: flex;
2321
- justify-content: space-between;
2322
- align-items: center;
2323
- padding: 0 24px;
2324
- z-index: 1;
2325
- pointer-events: none;
2326
- }
2327
- .semi-image-preview-header-title {
2328
- flex: 1;
2329
- }
2330
- .semi-image-preview-header-close {
2331
- display: flex;
2332
- justify-content: center;
2333
- align-items: center;
2334
- cursor: pointer;
2335
- width: 30px;
2336
- height: 30px;
2337
- border-radius: 50%;
2338
- pointer-events: auto;
2339
- }
2340
- .semi-image-preview-header-close:hover {
2341
- background-color: rgba(0, 0, 0, 0.75);
2342
- }
2343
- .semi-image-preview-footer {
2344
- display: flex;
2345
- align-items: center;
2346
- }
2347
- .semi-image-preview-footer-content {
2348
- padding: 0 16px;
2349
- background: rgba(0, 0, 0, 0.75);
2350
- border-radius: var(--semi-border-radius-medium);
2351
- height: 48px;
2352
- }
2353
- .semi-image-preview-footer-wrapper {
2354
- position: absolute;
2355
- left: 50%;
2356
- bottom: 16px;
2357
- transform: translateX(-50%);
2358
- }
2359
- .semi-image-preview-footer-page {
2360
- user-select: none;
2361
- color: var(--semi-color-white);
2362
- font-size: 16px;
2363
- line-height: 22px;
2364
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2365
- margin: 0 12px;
2366
- }
2367
- .semi-image-preview-footer .semi-icon {
2368
- color: var(--semi-color-white);
2369
- cursor: pointer;
2370
- }
2371
- .semi-image-preview-footer-gap {
2372
- margin-left: 16px;
2373
- }
2374
- .semi-image-preview-footer .semi-slider {
2375
- width: 132px;
2376
- padding: 0 16px;
2377
- }
2378
- .semi-image-preview-footer .semi-slider .semi-slider-rail {
2379
- color: var(--semi-color-white);
2380
- height: 2px;
2381
- }
2382
- .semi-image-preview-footer .semi-slider .semi-slider-track {
2383
- height: 2px;
2384
- }
2385
- .semi-image-preview-footer .semi-slider .semi-slider-handle {
2386
- width: 16px;
2387
- height: 16px;
2388
- margin-top: 8px;
2389
- box-sizing: border-box;
2390
- }
2391
- .semi-image-preview-footer .semi-divider {
2392
- background: rgba(255, 255, 255, 0.5);
2393
- margin: 0 16px;
2394
- }
2395
- .semi-image-preview-footer .semi-image-preview-footer-disabled {
2396
- color: rgba(249, 249, 249, 0.35);
2397
- cursor: default;
2398
- pointer-events: none;
2399
- }
2400
- .semi-image-preview-image {
2401
- position: relative;
2402
- height: 100%;
2403
- display: flex;
2404
- justify-content: center;
2405
- align-items: center;
2406
- }
2407
- .semi-image-preview-image-img {
2408
- position: absolute;
2409
- transform: scale3d(1, 1, 1) var(--semi-transform-rotate-none);
2410
- z-index: 0;
2411
- user-select: none;
2412
- }
2413
- .semi-image-preview-image-spin {
2414
- position: absolute;
2415
- top: 50%;
2416
- left: 50%;
2417
- transform: translate(-50%, -50%);
2418
- }
2419
- .semi-image-preview-image-spin .semi-spin-wrapper {
2420
- color: #ccc;
2421
- }
2422
- @keyframes spinner {
2423
- to {
2424
- transform: var(--semi-transform_rotate-clockwise360deg);
2425
- }
2426
- }
2427
-
2428
- img[src=""], img:not([src]) {
2429
- opacity: 0;
2430
- }
2431
-
2432
- .semi-rtl .semi-image-preview,
2433
- .semi-portal-rtl .semi-image-preview {
2434
- direction: rtl;
2435
- }
2436
- .semi-rtl .semi-image-preview-group,
2437
- .semi-portal-rtl .semi-image-preview-group {
2438
- direction: rtl;
2439
- }
2440
- .semi-rtl .semi-image-preview-prev,
2441
- .semi-portal-rtl .semi-image-preview-prev {
2442
- right: 24px;
2443
- left: auto;
2444
- transform: var(--semi-transform_rotate-clockwise180deg);
2445
- }
2446
- .semi-rtl .semi-image-preview-next,
2447
- .semi-portal-rtl .semi-image-preview-next {
2448
- left: 24px;
2449
- right: auto;
2450
- transform: var(--semi-transform_rotate-clockwise180deg);
2451
- }
2452
- .semi-rtl .semi-image-preview-footer-page,
2453
- .semi-portal-rtl .semi-image-preview-footer-page {
2454
- display: flex;
2455
- direction: rtl;
2456
- }
2457
- .semi-rtl .semi-image-preview-footer-gap,
2458
- .semi-portal-rtl .semi-image-preview-footer-gap {
2459
- margin-right: 16px;
2460
- margin-left: 0;
2461
- }
2462
- .semi-rtl .semi-image-preview-footer .semi-icon-chevron_left,
2463
- .semi-portal-rtl .semi-image-preview-footer .semi-icon-chevron_left {
2464
- transform: var(--semi-transform_rotate-clockwise180deg);
2465
- }
2466
- .semi-rtl .semi-image-preview-footer .semi-icon-chevron_right,
2467
- .semi-portal-rtl .semi-image-preview-footer .semi-icon-chevron_right {
2468
- transform: var(--semi-transform_rotate-clockwise180deg);
2469
- }
2470
-
2471
- .semi-collapsible-transition {
2472
- transition: height 250ms cubic-bezier(0.25, 0.1, 0.25, 1) var(--semi-transition_delay-none), opacity 250ms var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
2473
- }
2474
-
2475
- .semi-dropdown {
2476
- font-size: 14px;
2477
- line-height: 20px;
2478
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2479
- }
2480
- .semi-dropdown-wrapper {
2481
- overflow-y: auto;
2482
- box-shadow: var(--semi-shadow-elevated);
2483
- position: relative;
2484
- z-index: 1050;
2485
- border-radius: var(--semi-border-radius-medium);
2486
- background: var(--semi-color-bg-3);
2487
- backdrop-filter: none;
2488
- opacity: 0;
2489
- }
2490
- .semi-dropdown-wrapper-show {
2491
- opacity: 1;
2492
- }
2493
- .semi-dropdown-trigger {
2494
- display: inline-block;
2495
- }
2496
- .semi-dropdown-menu {
2497
- list-style: none;
2498
- padding: 4px 0;
2499
- margin: 0;
2500
- }
2501
- .semi-dropdown-title {
2502
- color: var(--semi-color-text-2);
2503
- padding-top: 8px;
2504
- padding-bottom: 4px;
2505
- padding-left: 16px;
2506
- padding-right: 16px;
2507
- font-size: 12px;
2508
- line-height: 16px;
2509
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2510
- cursor: default;
2511
- }
2512
- .semi-dropdown-title-withTick {
2513
- padding-left: 31px;
2514
- }
2515
- .semi-dropdown-item {
2516
- padding: 8px 16px;
2517
- color: var(--semi-color-text-0);
2518
- max-width: 280px;
2519
- display: flex;
2520
- align-items: center;
2521
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeOut) 0ms;
2522
- border-radius: 0px;
2523
- }
2524
- .semi-dropdown-item-hover {
2525
- background-color: var(--semi-color-fill-0);
2526
- }
2527
- .semi-dropdown-item:not(.semi-dropdown-item-active):hover {
2528
- background-color: var(--semi-color-fill-0);
2529
- cursor: pointer;
2530
- }
2531
- .semi-dropdown-item:not(.semi-dropdown-item-active):active {
2532
- background-color: var(--semi-color-fill-1);
2533
- }
2534
- .semi-dropdown-item:focus-visible {
2535
- background-color: var(--semi-color-fill-0);
2536
- outline: 0;
2537
- }
2538
- .semi-dropdown-item-icon {
2539
- display: inline-flex;
2540
- align-items: center;
2541
- margin-right: 8px;
2542
- }
2543
- .semi-dropdown-item-danger {
2544
- color: var(--semi-color-danger);
2545
- }
2546
- .semi-dropdown-item-secondary {
2547
- color: var(--semi-color-secondary);
2548
- }
2549
- .semi-dropdown-item-warning {
2550
- color: var(--semi-color-warning);
2551
- }
2552
- .semi-dropdown-item-tertiary {
2553
- color: var(--semi-color-tertiary);
2554
- }
2555
- .semi-dropdown-item-primary {
2556
- color: var(--semi-color-primary);
2557
- }
2558
- .semi-dropdown-item-withTick {
2559
- padding-left: 12px;
2560
- }
2561
- .semi-dropdown-item > .semi-icon {
2562
- flex-shrink: 0;
2563
- margin-right: 9px;
2564
- font-size: 12px;
2565
- }
2566
- .semi-dropdown-item-active {
2567
- font-weight: 600;
2568
- }
2569
- .semi-dropdown-item.semi-dropdown-item-disabled {
2570
- color: var(--semi-color-disabled-text);
2571
- cursor: not-allowed;
2572
- }
2573
- .semi-dropdown-item.semi-dropdown-item-disabled:hover, .semi-dropdown-item.semi-dropdown-item-disabled:active {
2574
- cursor: not-allowed;
2575
- background-color: transparent;
2576
- }
2577
- .semi-dropdown-divider {
2578
- display: block;
2579
- height: 1px;
2580
- width: 100%;
2581
- min-width: 100%;
2582
- clear: both;
2583
- background: var(--semi-color-border);
2584
- margin: 4px 0;
2585
- }
2586
-
2587
- .semi-rtl .semi-dropdown-wrapper,
2588
- .semi-portal-rtl .semi-dropdown-wrapper {
2589
- direction: rtl;
2590
- }
2591
- .semi-rtl .semi-dropdown-title-withTick,
2592
- .semi-portal-rtl .semi-dropdown-title-withTick {
2593
- padding-left: 0;
2594
- padding-right: 31px;
2595
- }
2596
- .semi-rtl .semi-dropdown-item-withTick,
2597
- .semi-portal-rtl .semi-dropdown-item-withTick {
2598
- padding-left: auto;
2599
- padding-right: 12px;
2600
- }
2601
- .semi-rtl .semi-dropdown-item > .semi-icon,
2602
- .semi-portal-rtl .semi-dropdown-item > .semi-icon {
2603
- margin-right: 0;
2604
- margin-left: 9px;
2605
- }
2606
-
2607
- .semi-modal {
2608
- font-size: 14px;
2609
- line-height: 20px;
2610
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2611
- position: relative;
2612
- margin: 80px auto;
2613
- color: var(--semi-color-text-0);
2614
- }
2615
- .semi-modal-mask {
2616
- position: fixed;
2617
- top: 0;
2618
- right: 0;
2619
- left: 0;
2620
- bottom: 0;
2621
- background-color: var(--semi-color-overlay-bg);
2622
- backdrop-filter: none;
2623
- height: 100%;
2624
- z-index: 1000;
2625
- }
2626
- .semi-modal-mask-hidden {
2627
- display: none;
2628
- }
2629
- .semi-modal-icon-wrapper {
2630
- display: inline-flex;
2631
- margin-right: 12px;
2632
- width: 24px;
2633
- }
2634
- .semi-modal-wrap {
2635
- position: fixed;
2636
- overflow: auto;
2637
- top: 0;
2638
- right: 0;
2639
- bottom: 0;
2640
- left: 0;
2641
- z-index: 1000;
2642
- -webkit-overflow-scrolling: touch;
2643
- outline: 0;
2644
- }
2645
- .semi-modal-wrap-center {
2646
- display: flex;
2647
- align-items: flex-start;
2648
- }
2649
- .semi-modal-title {
2650
- display: inline-flex;
2651
- align-items: flex-start;
2652
- justify-content: flex-start;
2653
- width: 100%;
2654
- margin: 0;
2655
- }
2656
- .semi-modal-content {
2657
- position: relative;
2658
- display: flex;
2659
- height: max-content;
2660
- width: 100%;
2661
- box-sizing: border-box;
2662
- flex-direction: column;
2663
- background-color: var(--semi-color-bg-2);
2664
- backdrop-filter: none;
2665
- border: 1px solid var(--semi-color-border);
2666
- border-radius: var(--semi-border-radius-large);
2667
- padding: 0 24px;
2668
- background-clip: padding-box;
2669
- overflow: hidden;
2670
- box-shadow: var(--semi-shadow-elevated);
2671
- }
2672
- .semi-modal-footerfill {
2673
- display: flex;
2674
- }
2675
- .semi-modal-content-height-set {
2676
- height: 100%;
2677
- }
2678
- .semi-modal-content-fullScreen {
2679
- border-radius: 0;
2680
- border: none;
2681
- height: 100%;
2682
- top: 0px;
2683
- }
2684
- .semi-modal-header {
2685
- display: flex;
2686
- align-items: flex-start;
2687
- margin: 24px 0;
2688
- padding: 0 0;
2689
- font-size: 14px;
2690
- font-weight: 600;
2691
- background-color: transparent;
2692
- color: var(--semi-color-text-0);
2693
- border-bottom: 0 solid transparent;
2694
- }
2695
- .semi-modal-body-wrapper {
2696
- display: flex;
2697
- align-items: flex-start;
2698
- margin: 24px 0;
2699
- }
2700
- .semi-modal-body {
2701
- flex: 1 1 auto;
2702
- margin: 0;
2703
- padding: 0;
2704
- }
2705
- .semi-modal-withIcon {
2706
- margin-left: 36px;
2707
- }
2708
- .semi-modal-footer {
2709
- margin: 24px 0;
2710
- padding: 0 0;
2711
- text-align: right;
2712
- border-radius: 0 0 5px 5px;
2713
- border-top: 0 solid transparent;
2714
- background-color: transparent;
2715
- }
2716
- .semi-modal-footer .semi-button {
2717
- margin-left: 12px;
2718
- margin-right: 0;
2719
- }
2720
- .semi-modal-confirm .semi-modal-header {
2721
- margin-bottom: 8px;
2722
- }
2723
- .semi-modal-confirm-icon-wrapper {
2724
- display: inline-flex;
2725
- margin-right: 12px;
2726
- width: 24px;
2727
- }
2728
- .semi-modal-confirm-icon {
2729
- display: inline-flex;
2730
- color: var(--semi-color-primary);
2731
- }
2732
- .semi-modal-info-icon {
2733
- color: var(--semi-color-info);
2734
- }
2735
- .semi-modal-success-icon {
2736
- color: var(--semi-color-success);
2737
- }
2738
- .semi-modal-error-icon {
2739
- color: var(--semi-color-danger);
2740
- }
2741
- .semi-modal-warning-icon {
2742
- color: var(--semi-color-warning);
2743
- }
2744
- .semi-modal-small {
2745
- width: 448px;
2746
- }
2747
- .semi-modal-medium {
2748
- width: 684px;
2749
- }
2750
- .semi-modal-large {
2751
- width: 920px;
2752
- }
2753
- .semi-modal-full-width {
2754
- width: calc(100vw - 64px);
2755
- }
2756
-
2757
- .semi-modal-centered {
2758
- margin: auto;
2759
- }
2760
-
2761
- .semi-modal-popup .semi-modal-mask,
2762
- .semi-modal-popup .semi-modal-wrap {
2763
- position: absolute;
2764
- overflow: hidden;
2765
- }
2766
-
2767
- .semi-modal-fixed .semi-modal-mask,
2768
- .semi-modal-fixed .semi-modal-wrap {
2769
- position: fixed;
2770
- overflow: hidden;
2771
- }
2772
-
2773
- .semi-modal-displayNone {
2774
- display: none;
2775
- }
2776
-
2777
- .semi-modal-content-animate-show {
2778
- animation: 120ms semi-modal-content-keyframe-show cubic-bezier(0.215, 0.61, 0.355, 1) 0ms forwards;
2779
- animation-fill-mode: forwards;
2780
- }
2781
-
2782
- .semi-modal-content-animate-hide {
2783
- animation: 120ms semi-modal-content-keyframe-hide cubic-bezier(0.215, 0.61, 0.355, 1) 0ms forwards;
2784
- animation-fill-mode: forwards;
2785
- }
2786
-
2787
- .semi-modal-mask-animate-show {
2788
- animation: 90ms semi-modal-mask-keyframe-show cubic-bezier(0.215, 0.61, 0.355, 1) 0ms forwards;
2789
- animation-fill-mode: forwards;
2790
- }
2791
-
2792
- .semi-modal-mask-animate-hide {
2793
- animation: 90ms semi-modal-mask-keyframe-hide cubic-bezier(0.215, 0.61, 0.355, 1) 0ms forwards;
2794
- animation-fill-mode: forwards;
2795
- }
2796
-
2797
- @keyframes semi-modal-content-keyframe-show {
2798
- 0% {
2799
- opacity: 0;
2800
- transform: scale(0.7);
2801
- }
2802
- 100% {
2803
- opacity: 1;
2804
- transform: scale(1);
2805
- }
2806
- }
2807
- @keyframes semi-modal-content-keyframe-hide {
2808
- 0% {
2809
- opacity: 1;
2810
- transform: scale(1);
2811
- }
2812
- 100% {
2813
- opacity: 0;
2814
- transform: scale(0.7);
2815
- }
2816
- }
2817
- @keyframes semi-modal-mask-keyframe-show {
2818
- 0% {
2819
- opacity: 0;
2820
- }
2821
- 100% {
2822
- opacity: 1;
2823
- }
2824
- }
2825
- @keyframes semi-modal-mask-keyframe-hide {
2826
- 0% {
2827
- opacity: 1;
2828
- }
2829
- 100% {
2830
- opacity: 0;
2831
- }
2832
- }
2833
- .semi-modal-rtl {
2834
- direction: rtl;
2835
- }
2836
- .semi-modal-rtl .semi-modal-icon-wrapper, .semi-modal-confirm-rtl .semi-modal-icon-wrapper {
2837
- margin-right: 0;
2838
- margin-left: 12px;
2839
- }
2840
- .semi-modal-rtl .semi-modal-withIcon, .semi-modal-confirm-rtl .semi-modal-withIcon {
2841
- margin-left: 0;
2842
- margin-right: 36px;
2843
- }
2844
- .semi-modal-rtl .semi-modal-footer, .semi-modal-confirm-rtl .semi-modal-footer {
2845
- text-align: left;
2846
- }
2847
- .semi-modal-rtl .semi-modal-footer .semi-button, .semi-modal-confirm-rtl .semi-modal-footer .semi-button {
2848
- margin-left: 0;
2849
- margin-right: 12px;
2850
- }
2851
- .semi-modal-confirm-rtl {
2852
- direction: rtl;
2853
- }
2854
- .semi-modal-confirm .semi-modal-confirm-rtl .semi-button {
2855
- margin-left: 0;
2856
- margin-right: 12px;
2857
- }
2858
-
2859
- .semi-toast {
2860
- pointer-events: none;
2861
- }
2862
- .semi-toast-wrapper {
2863
- position: fixed;
2864
- height: 0;
2865
- top: 0;
2866
- width: 100%;
2867
- display: flex;
2868
- justify-content: center;
2869
- z-index: 1010;
2870
- }
2871
- .semi-toast-wrapper .semi-toast-innerWrapper {
2872
- width: fit-content;
2873
- height: fit-content;
2874
- text-align: center;
2875
- }
2876
- .semi-toast-wrapper .semi-toast-innerWrapper-hover .semi-toast-zero-height-wrapper {
2877
- perspective: unset;
2878
- perspective-origin: center center;
2879
- }
2880
- .semi-toast-zero-height-wrapper {
2881
- transition: all 300ms cubic-bezier(0.22, 0.57, 0.02, 1.2);
2882
- perspective-origin: center 280px;
2883
- perspective: 280px;
2884
- height: 0;
2885
- overflow: visible;
2886
- }
2887
- .semi-toast-content {
2888
- pointer-events: all;
2889
- box-shadow: var(--semi-shadow-elevated);
2890
- font-size: 14px;
2891
- line-height: 20px;
2892
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2893
- background-color: var(--semi-color-bg-3);
2894
- border-radius: var(--semi-border-radius-medium);
2895
- padding: 12px 8px 12px 8px;
2896
- display: inline-flex;
2897
- align-items: flex-start;
2898
- justify-content: center;
2899
- margin: 12px;
2900
- font-weight: 600;
2901
- color: var(--semi-color-text-0);
2902
- }
2903
- .semi-toast-content .semi-toast-close-button {
2904
- margin-top: -2px;
2905
- height: 20px;
2906
- }
2907
- .semi-toast-content .semi-toast-content-text {
2908
- margin-left: 12px;
2909
- margin-right: 12px;
2910
- text-align: left;
2911
- word-wrap: break-word;
2912
- overflow-wrap: break-word;
2913
- }
2914
- .semi-toast-light.semi-toast-warning .semi-toast-content {
2915
- background-color: var(--semi-color-warning-light-default);
2916
- border: 1px solid var(--semi-color-warning);
2917
- }
2918
- .semi-toast-light.semi-toast-warning .semi-toast-icon-warning {
2919
- color: var(--semi-color-warning);
2920
- }
2921
- .semi-toast-light.semi-toast-success .semi-toast-content {
2922
- background-color: var(--semi-color-success-light-default);
2923
- border: 1px solid var(--semi-color-success);
2924
- }
2925
- .semi-toast-light.semi-toast-success .semi-toast-icon-success {
2926
- color: var(--semi-color-success);
2927
- }
2928
- .semi-toast-light.semi-toast-info .semi-toast-content {
2929
- background-color: var(--semi-color-info-light-default);
2930
- border: 1px solid var(--semi-color-info);
2931
- }
2932
- .semi-toast-light.semi-toast-info .semi-toast-icon-info {
2933
- color: var(--semi-color-info);
2934
- }
2935
- .semi-toast-light.semi-toast-error .semi-toast-content {
2936
- background-color: var(--semi-color-danger-light-default);
2937
- border: 1px solid var(--semi-color-danger);
2938
- }
2939
- .semi-toast-light.semi-toast-error .semi-toast-icon-error {
2940
- color: var(--semi-color-danger);
2941
- }
2942
- .semi-toast .semi-toast-icon-warning {
2943
- color: var(--semi-color-warning);
2944
- }
2945
- .semi-toast .semi-toast-icon-success {
2946
- color: var(--semi-color-success);
2947
- }
2948
- .semi-toast .semi-toast-icon-info {
2949
- color: var(--semi-color-info);
2950
- }
2951
- .semi-toast .semi-toast-icon-error {
2952
- color: var(--semi-color-danger);
2953
- }
2954
- .semi-toast-animation-show {
2955
- animation: 300ms semi-toast-keyframe-toast-show cubic-bezier(0.22, 0.57, 0.02, 1.2) 0s;
2956
- animation-fill-mode: forwards;
2957
- }
2958
- .semi-toast-animation-hide {
2959
- animation: 300ms semi-toast-keyframe-toast-hide cubic-bezier(0.22, 0.57, 0.02, 1.2) 0s;
2960
- animation-fill-mode: forwards;
2961
- }
2962
- @keyframes semi-toast-keyframe-toast-show {
2963
- 0% {
2964
- opacity: 0;
2965
- transform: translateY(-100%);
2966
- }
2967
- 100% {
2968
- opacity: 1;
2969
- }
2970
- }
2971
- @keyframes semi-toast-keyframe-toast-hide {
2972
- 0% {
2973
- opacity: 1;
2974
- }
2975
- 100% {
2976
- opacity: 0;
2977
- transform: translateY(-100%);
2978
- }
2979
- }
2980
-
2981
- .semi-toast-rtl {
2982
- direction: rtl;
2983
- }
2984
- .semi-toast-rtl .semi-toast-content .semi-toast-content-text {
2985
- text-align: right;
2986
- margin-left: 12px;
2987
- margin-right: 12px;
2988
- }
2989
-
2990
- .semi-typography {
2991
- color: var(--semi-color-text-0);
2992
- font-size: 14px;
2993
- line-height: 20px;
2994
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2995
- }
2996
- .semi-typography.semi-typography-secondary {
2997
- color: var(--semi-color-text-1);
2998
- }
2999
- .semi-typography.semi-typography-tertiary {
3000
- color: var(--semi-color-text-2);
3001
- }
3002
- .semi-typography.semi-typography-quaternary {
3003
- color: var(--semi-color-text-3);
3004
- }
3005
- .semi-typography.semi-typography-warning {
3006
- color: var(--semi-color-warning);
3007
- }
3008
- .semi-typography.semi-typography-success {
3009
- color: var(--semi-color-success);
3010
- }
3011
- .semi-typography.semi-typography-danger {
3012
- color: var(--semi-color-danger);
3013
- }
3014
- .semi-typography.semi-typography-link {
3015
- color: var(--semi-color-link);
3016
- font-weight: 600;
3017
- }
3018
- .semi-typography.semi-typography-disabled {
3019
- color: var(--semi-color-disabled-text);
3020
- cursor: not-allowed;
3021
- user-select: none;
3022
- }
3023
- .semi-typography.semi-typography-disabled.semi-typography-link {
3024
- color: var(--semi-color-link);
3025
- }
3026
- .semi-typography-icon {
3027
- margin-right: 4px;
3028
- vertical-align: middle;
3029
- color: inherit;
3030
- }
3031
- .semi-typography-small {
3032
- font-size: 12px;
3033
- line-height: 16px;
3034
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3035
- font-weight: 400;
3036
- }
3037
- .semi-typography-small.semi-typography-paragraph {
3038
- font-weight: 400;
3039
- }
3040
- .semi-typography code {
3041
- border: 1px solid var(--semi-color-border);
3042
- border-radius: 2px;
3043
- color: var(--semi-color-text-2);
3044
- background-color: var(--semi-color-fill-1);
3045
- padding: 2px 4px;
3046
- }
3047
- .semi-typography mark {
3048
- background-color: var(--semi-color-primary-light-default);
3049
- }
3050
- .semi-typography u {
3051
- text-decoration: underline;
3052
- text-decoration-skip-ink: auto;
3053
- }
3054
- .semi-typography del {
3055
- text-decoration: line-through;
3056
- }
3057
- .semi-typography strong {
3058
- font-weight: 600;
3059
- }
3060
- .semi-typography a {
3061
- display: inline;
3062
- color: var(--semi-color-link);
3063
- cursor: pointer;
3064
- text-decoration: none;
3065
- }
3066
- .semi-typography a:visited {
3067
- color: var(--semi-color-link-visited);
3068
- }
3069
- .semi-typography a:hover {
3070
- color: var(--semi-color-link-hover);
3071
- }
3072
- .semi-typography a:active {
3073
- color: var(--semi-color-link-active);
3074
- }
3075
- .semi-typography a .semi-typography-link-underline:hover {
3076
- border-bottom: 1px solid var(--semi-color-link-hover);
3077
- margin-bottom: -1px;
3078
- }
3079
- .semi-typography a .semi-typography-link-underline:active {
3080
- border-bottom: 1px solid var(--semi-color-link-active);
3081
- margin-bottom: -1px;
3082
- }
3083
- .semi-typography-ellipsis-single-line {
3084
- overflow: hidden;
3085
- }
3086
- .semi-typography-ellipsis-multiple-line {
3087
- display: -webkit-box;
3088
- -webkit-box-orient: vertical;
3089
- overflow: hidden;
3090
- }
3091
- .semi-typography-ellipsis-multiple-line.semi-typography-ellipsis-multiple-line-text {
3092
- display: -webkit-inline-box;
3093
- }
3094
- .semi-typography-ellipsis-overflow-ellipsis {
3095
- display: block;
3096
- white-space: nowrap;
3097
- text-overflow: ellipsis;
3098
- }
3099
- .semi-typography-ellipsis-overflow-ellipsis.semi-typography-ellipsis-overflow-ellipsis-text {
3100
- display: inline-block;
3101
- max-width: 100%;
3102
- vertical-align: top;
3103
- }
3104
- .semi-typography-ellipsis-expand {
3105
- display: inline;
3106
- margin-left: 8px;
3107
- }
3108
- .semi-typography-action-copy {
3109
- display: inline-flex;
3110
- vertical-align: middle;
3111
- padding: 0;
3112
- margin-left: 4px;
3113
- }
3114
- .semi-typography a.semi-typography-action-copy-icon {
3115
- display: inline-flex;
3116
- }
3117
- .semi-typography-action-copied {
3118
- display: inline-flex;
3119
- padding: 0;
3120
- margin-left: 4px;
3121
- color: var(--semi-color-text-2);
3122
- }
3123
- .semi-typography-action-copied .semi-icon {
3124
- vertical-align: middle;
3125
- color: var(--semi-color-success);
3126
- }
3127
- .semi-typography-paragraph {
3128
- margin: 0;
3129
- }
3130
-
3131
- h1.semi-typography,
3132
- .semi-typography-h1.semi-typography {
3133
- font-size: 32px;
3134
- line-height: 44px;
3135
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3136
- font-weight: 600;
3137
- margin: 0;
3138
- }
3139
- h1.semi-typography.semi-typography-h1-weight-light,
3140
- .semi-typography-h1.semi-typography.semi-typography-h1-weight-light {
3141
- font-weight: 200;
3142
- }
3143
- h1.semi-typography.semi-typography-h1-weight-regular,
3144
- .semi-typography-h1.semi-typography.semi-typography-h1-weight-regular {
3145
- font-weight: 400;
3146
- }
3147
- h1.semi-typography.semi-typography-h1-weight-medium,
3148
- .semi-typography-h1.semi-typography.semi-typography-h1-weight-medium {
3149
- font-weight: 500;
3150
- }
3151
- h1.semi-typography.semi-typography-h1-weight-semibold,
3152
- .semi-typography-h1.semi-typography.semi-typography-h1-weight-semibold {
3153
- font-weight: 600;
3154
- }
3155
- h1.semi-typography.semi-typography-h1-weight-bold,
3156
- .semi-typography-h1.semi-typography.semi-typography-h1-weight-bold {
3157
- font-weight: 700;
3158
- }
3159
-
3160
- h2.semi-typography,
3161
- .semi-typography-h2.semi-typography {
3162
- font-size: 28px;
3163
- line-height: 40px;
3164
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3165
- font-weight: 600;
3166
- margin: 0;
3167
- }
3168
- h2.semi-typography.semi-typography-h2-weight-light,
3169
- .semi-typography-h2.semi-typography.semi-typography-h2-weight-light {
3170
- font-weight: 200;
3171
- }
3172
- h2.semi-typography.semi-typography-h2-weight-regular,
3173
- .semi-typography-h2.semi-typography.semi-typography-h2-weight-regular {
3174
- font-weight: 400;
3175
- }
3176
- h2.semi-typography.semi-typography-h2-weight-medium,
3177
- .semi-typography-h2.semi-typography.semi-typography-h2-weight-medium {
3178
- font-weight: 500;
3179
- }
3180
- h2.semi-typography.semi-typography-h2-weight-semibold,
3181
- .semi-typography-h2.semi-typography.semi-typography-h2-weight-semibold {
3182
- font-weight: 600;
3183
- }
3184
- h2.semi-typography.semi-typography-h2-weight-bold,
3185
- .semi-typography-h2.semi-typography.semi-typography-h2-weight-bold {
3186
- font-weight: 700;
3187
- }
3188
-
3189
- h3.semi-typography,
3190
- .semi-typography-h3.semi-typography {
3191
- font-size: 24px;
3192
- line-height: 32px;
3193
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3194
- font-weight: 600;
3195
- margin: 0;
3196
- }
3197
- h3.semi-typography.semi-typography-h3-weight-light,
3198
- .semi-typography-h3.semi-typography.semi-typography-h3-weight-light {
3199
- font-weight: 200;
3200
- }
3201
- h3.semi-typography.semi-typography-h3-weight-regular,
3202
- .semi-typography-h3.semi-typography.semi-typography-h3-weight-regular {
3203
- font-weight: 400;
3204
- }
3205
- h3.semi-typography.semi-typography-h3-weight-medium,
3206
- .semi-typography-h3.semi-typography.semi-typography-h3-weight-medium {
3207
- font-weight: 500;
3208
- }
3209
- h3.semi-typography.semi-typography-h3-weight-semibold,
3210
- .semi-typography-h3.semi-typography.semi-typography-h3-weight-semibold {
3211
- font-weight: 600;
3212
- }
3213
- h3.semi-typography.semi-typography-h3-weight-bold,
3214
- .semi-typography-h3.semi-typography.semi-typography-h3-weight-bold {
3215
- font-weight: 700;
3216
- }
3217
-
3218
- h4.semi-typography,
3219
- .semi-typography-h4.semi-typography {
3220
- font-size: 20px;
3221
- line-height: 28px;
3222
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3223
- font-weight: 600;
3224
- margin: 0;
3225
- }
3226
- h4.semi-typography.semi-typography-h4-weight-light,
3227
- .semi-typography-h4.semi-typography.semi-typography-h4-weight-light {
3228
- font-weight: 200;
3229
- }
3230
- h4.semi-typography.semi-typography-h4-weight-regular,
3231
- .semi-typography-h4.semi-typography.semi-typography-h4-weight-regular {
3232
- font-weight: 400;
3233
- }
3234
- h4.semi-typography.semi-typography-h4-weight-medium,
3235
- .semi-typography-h4.semi-typography.semi-typography-h4-weight-medium {
3236
- font-weight: 500;
3237
- }
3238
- h4.semi-typography.semi-typography-h4-weight-semibold,
3239
- .semi-typography-h4.semi-typography.semi-typography-h4-weight-semibold {
3240
- font-weight: 600;
3241
- }
3242
- h4.semi-typography.semi-typography-h4-weight-bold,
3243
- .semi-typography-h4.semi-typography.semi-typography-h4-weight-bold {
3244
- font-weight: 700;
3245
- }
3246
-
3247
- h5.semi-typography,
3248
- .semi-typography-h5.semi-typography {
3249
- font-size: 18px;
3250
- line-height: 24px;
3251
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3252
- font-weight: 600;
3253
- margin: 0;
3254
- }
3255
- h5.semi-typography.semi-typography-h5-weight-light,
3256
- .semi-typography-h5.semi-typography.semi-typography-h5-weight-light {
3257
- font-weight: 200;
3258
- }
3259
- h5.semi-typography.semi-typography-h5-weight-regular,
3260
- .semi-typography-h5.semi-typography.semi-typography-h5-weight-regular {
3261
- font-weight: 400;
3262
- }
3263
- h5.semi-typography.semi-typography-h5-weight-medium,
3264
- .semi-typography-h5.semi-typography.semi-typography-h5-weight-medium {
3265
- font-weight: 500;
3266
- }
3267
- h5.semi-typography.semi-typography-h5-weight-semibold,
3268
- .semi-typography-h5.semi-typography.semi-typography-h5-weight-semibold {
3269
- font-weight: 600;
3270
- }
3271
- h5.semi-typography.semi-typography-h5-weight-bold,
3272
- .semi-typography-h5.semi-typography.semi-typography-h5-weight-bold {
3273
- font-weight: 700;
3274
- }
3275
-
3276
- h6.semi-typography,
3277
- .semi-typography-h6.semi-typography {
3278
- font-size: 16px;
3279
- line-height: 22px;
3280
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3281
- font-weight: 600;
3282
- margin: 0;
3283
- }
3284
- h6.semi-typography.semi-typography-h6-weight-light,
3285
- .semi-typography-h6.semi-typography.semi-typography-h6-weight-light {
3286
- font-weight: 200;
3287
- }
3288
- h6.semi-typography.semi-typography-h6-weight-regular,
3289
- .semi-typography-h6.semi-typography.semi-typography-h6-weight-regular {
3290
- font-weight: 400;
3291
- }
3292
- h6.semi-typography.semi-typography-h6-weight-medium,
3293
- .semi-typography-h6.semi-typography.semi-typography-h6-weight-medium {
3294
- font-weight: 500;
3295
- }
3296
- h6.semi-typography.semi-typography-h6-weight-semibold,
3297
- .semi-typography-h6.semi-typography.semi-typography-h6-weight-semibold {
3298
- font-weight: 600;
3299
- }
3300
- h6.semi-typography.semi-typography-h6-weight-bold,
3301
- .semi-typography-h6.semi-typography.semi-typography-h6-weight-bold {
3302
- font-weight: 700;
3303
- }
3304
-
3305
- p.semi-typography-extended,
3306
- .semi-typography-paragraph.semi-typography-extended {
3307
- line-height: 24px;
3308
- font-weight: 400;
3309
- }
3310
-
3311
- .semi-rtl .semi-typography,
3312
- .semi-portal-rtl .semi-typography {
3313
- direction: rtl;
3314
- }
3315
- .semi-rtl .semi-typography-link a,
3316
- .semi-rtl .semi-typography a,
3317
- .semi-portal-rtl .semi-typography-link a,
3318
- .semi-portal-rtl .semi-typography a {
3319
- display: inline-block;
3320
- }
3321
- .semi-rtl .semi-typography-icon,
3322
- .semi-portal-rtl .semi-typography-icon {
3323
- margin-right: auto;
3324
- margin-left: 4px;
3325
- }
3326
- .semi-rtl .semi-typography-ellipsis-expand,
3327
- .semi-portal-rtl .semi-typography-ellipsis-expand {
3328
- margin-left: auto;
3329
- }
3330
- .semi-rtl .semi-typography-action-copy,
3331
- .semi-portal-rtl .semi-typography-action-copy {
3332
- margin-left: auto;
3333
- margin-right: 4px;
3334
- }
3335
- .semi-rtl .semi-typography-action-copied,
3336
- .semi-portal-rtl .semi-typography-action-copied {
3337
- margin-left: auto;
3338
- margin-right: 4px;
3339
- }
3340
-
3341
- .semi-table-panel-operation {
3342
- background-color: var(--semi-color-primary);
3343
- padding-left: 16px;
3344
- padding-right: 16px;
3345
- padding-top: 8px;
3346
- padding-bottom: 8px;
3347
- display: flex;
3348
- justify-content: space-between;
3349
- color: var(--semi-color-text-2);
3350
- }
3351
- .semi-table-panel-operation-right, .semi-table-panel-operation-left {
3352
- display: flex;
3353
- justify-content: space-between;
3354
- }
3355
- .semi-table-panel-operation-selected {
3356
- color: var(--semi-color-primary-light-active);
3357
- }
3358
-
3359
- .semi-table-pagination-info {
3360
- font-size: 14px;
3361
- line-height: 20px;
3362
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3363
- font-weight: 400;
3364
- }
3365
- .semi-table-pagination-outer {
3366
- display: flex;
3367
- justify-content: space-between;
3368
- align-items: center;
3369
- }
3370
-
3371
- .semi-table {
3372
- width: 100%;
3373
- text-align: left;
3374
- border-collapse: separate;
3375
- border-spacing: 0;
3376
- font-size: inherit;
3377
- display: table;
3378
- }
3379
- .semi-table-wrapper {
3380
- zoom: 1;
3381
- position: relative;
3382
- clear: both;
3383
- box-sizing: border-box;
3384
- margin: 0;
3385
- padding: 0;
3386
- font-size: 14px;
3387
- line-height: 20px;
3388
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3389
- color: var(--semi-color-text-0);
3390
- width: 100%;
3391
- }
3392
- .semi-table-wrapper[data-column-fixed=true] {
3393
- z-index: 1;
3394
- }
3395
- .semi-table-wrapper-ltr {
3396
- direction: ltr;
3397
- }
3398
- .semi-table-wrapper-ltr .semi-spin {
3399
- direction: ltr;
3400
- }
3401
- .semi-table-middle .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3402
- padding-top: 12px;
3403
- padding-bottom: 12px;
3404
- }
3405
- .semi-table-small .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3406
- padding-top: 8px;
3407
- padding-bottom: 8px;
3408
- }
3409
- .semi-table-title {
3410
- position: relative;
3411
- padding-top: 16px;
3412
- padding-bottom: 16px;
3413
- padding-left: 0;
3414
- padding-right: 0;
3415
- }
3416
- .semi-table-container {
3417
- position: relative;
3418
- }
3419
- .semi-table-header {
3420
- overflow: hidden;
3421
- scrollbar-base-color: transparent;
3422
- }
3423
- .semi-table-header::-webkit-scrollbar {
3424
- background-color: transparent;
3425
- border-bottom: 2px solid var(--semi-color-border);
3426
- }
3427
- .semi-table-header-sticky {
3428
- position: sticky;
3429
- z-index: 102;
3430
- }
3431
- .semi-table-header-sticky .semi-table-thead > .semi-table-row > .semi-table-row-head {
3432
- background-color: var(--semi-color-bg-1);
3433
- }
3434
- .semi-table-header-hidden {
3435
- height: 0;
3436
- }
3437
- .semi-table-align-center .semi-table-operate-wrapper {
3438
- justify-content: center;
3439
- }
3440
- .semi-table-align-right .semi-table-operate-wrapper {
3441
- justify-content: flex-end;
3442
- }
3443
- .semi-table-operate-wrapper {
3444
- display: flex;
3445
- justify-content: flex-start;
3446
- }
3447
- .semi-table-body {
3448
- overflow: auto;
3449
- width: 100%;
3450
- box-sizing: border-box;
3451
- }
3452
- .semi-table-colgroup {
3453
- display: table-column-group;
3454
- }
3455
- .semi-table-colgroup .semi-table-col {
3456
- display: table-column;
3457
- }
3458
- .semi-table-colgroup .semi-table-column-expand, .semi-table-colgroup .semi-table-column-selection {
3459
- width: 48px;
3460
- }
3461
- .semi-table-thead > .semi-table-row > .semi-table-row-head {
3462
- background-color: var(--semi-color-bg-1);
3463
- color: var(--semi-color-text-2);
3464
- font-weight: 600;
3465
- text-align: left;
3466
- border-bottom: 2px solid var(--semi-color-border);
3467
- padding-left: 16px;
3468
- padding-right: 16px;
3469
- padding-top: 8px;
3470
- padding-bottom: 8px;
3471
- vertical-align: middle;
3472
- overflow-wrap: break-word;
3473
- position: relative;
3474
- transition: background-color var(--semi-transition_duration-none) linear;
3475
- }
3476
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-row-head-clickSort {
3477
- cursor: pointer;
3478
- }
3479
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-row-head-clickSort:hover {
3480
- background-image: linear-gradient(0deg, var(--semi-color-fill-0), var(--semi-color-fill-0));
3481
- background-color: var(--semi-color-bg-0);
3482
- }
3483
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left, .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right {
3484
- z-index: 101;
3485
- position: sticky;
3486
- background-color: var(--semi-color-bg-1);
3487
- }
3488
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last {
3489
- border-right: 1px solid var(--semi-color-border);
3490
- box-shadow: 3px 0 0 0 var(--semi-color-shadow);
3491
- }
3492
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last.resizing {
3493
- border-right: 2px solid var(--semi-color-primary);
3494
- }
3495
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last.resizing .react-resizable-handle:hover {
3496
- background-color: unset;
3497
- }
3498
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first {
3499
- border-left: 1px solid var(--semi-color-border);
3500
- box-shadow: -3px 0 0 0 var(--semi-color-shadow);
3501
- }
3502
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first.resizing {
3503
- border-right: 2px solid var(--semi-color-primary);
3504
- }
3505
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first.resizing .react-resizable-handle:hover {
3506
- background-color: unset;
3507
- }
3508
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first[x-type=column-scrollbar] {
3509
- box-shadow: none;
3510
- border-left: transparent;
3511
- }
3512
- .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-column-selection {
3513
- text-align: center;
3514
- }
3515
- .semi-table-thead > .semi-table-row > .semi-table-row-head[colspan]:not([colspan="1"]) {
3516
- text-align: center;
3517
- }
3518
- .semi-table-thead > .semi-table-row > .semi-table-row-head .semi-table-header-column {
3519
- display: inline-flex;
3520
- align-items: center;
3521
- }
3522
- .semi-table-thead > .semi-table-row > .semi-table-row-head-ellipsis {
3523
- overflow: hidden;
3524
- text-overflow: ellipsis;
3525
- white-space: nowrap;
3526
- }
3527
- .semi-table-thead > .semi-table-row > .semi-table-row-head-ellipsis .semi-table-row-head-title {
3528
- overflow: hidden;
3529
- text-overflow: ellipsis;
3530
- white-space: nowrap;
3531
- }
3532
- .semi-table-thead > .semi-table-row .react-resizable {
3533
- position: relative;
3534
- background-clip: padding-box;
3535
- }
3536
- .semi-table-thead > .semi-table-row .resizing {
3537
- border-right: 2px solid var(--semi-color-primary);
3538
- }
3539
- .semi-table-thead > .semi-table-row .resizing .react-resizable-handle:hover {
3540
- background-color: unset;
3541
- }
3542
- .semi-table-thead > .semi-table-row .react-resizable-handle {
3543
- position: absolute;
3544
- width: 9px;
3545
- height: calc(100% - 4px * 2);
3546
- background-color: var(--semi-color-border);
3547
- bottom: 4px;
3548
- right: -1px;
3549
- cursor: col-resize;
3550
- z-index: 0;
3551
- }
3552
- .semi-table-thead > .semi-table-row .react-resizable-handle:hover {
3553
- background-color: var(--semi-color-primary);
3554
- }
3555
- .semi-table-tbody {
3556
- display: table-row-group;
3557
- }
3558
- .semi-table-tbody > .semi-table-row {
3559
- display: table-row;
3560
- background-color: var(--semi-color-bg-1);
3561
- }
3562
- .semi-table-tbody > .semi-table-row.semi-table-row-hovered > .semi-table-row-cell {
3563
- background-image: linear-gradient(0deg, var(--semi-color-fill-0), var(--semi-color-fill-0));
3564
- background-color: var(--semi-color-bg-0);
3565
- }
3566
- .semi-table-tbody > .semi-table-row.semi-table-row-hovered > .semi-table-row-cell.semi-table-cell-fixed-left, .semi-table-tbody > .semi-table-row.semi-table-row-hovered > .semi-table-row-cell.semi-table-cell-fixed-right {
3567
- background-image: linear-gradient(0deg, var(--semi-color-fill-0), var(--semi-color-fill-0));
3568
- background-color: var(--semi-color-bg-1);
3569
- }
3570
- .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell {
3571
- background-image: linear-gradient(0deg, var(--semi-color-fill-0), var(--semi-color-fill-0));
3572
- background-color: var(--semi-color-bg-0);
3573
- }
3574
- .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell.semi-table-cell-fixed-left, .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell.semi-table-cell-fixed-right {
3575
- background-image: linear-gradient(0deg, var(--semi-color-fill-0), var(--semi-color-fill-0));
3576
- background-color: var(--semi-color-bg-1);
3577
- }
3578
- .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3579
- display: table-cell;
3580
- overflow-wrap: break-word;
3581
- border-left: none;
3582
- border-right: none;
3583
- border-bottom: 1px solid var(--semi-color-border);
3584
- padding: 16px;
3585
- box-sizing: border-box;
3586
- position: relative;
3587
- vertical-align: middle;
3588
- }
3589
- .semi-table-tbody > .semi-table-row > .semi-table-row-cell.resizing {
3590
- border-right: 2px solid var(--semi-color-primary);
3591
- }
3592
- .semi-table-tbody > .semi-table-row > .semi-table-row-cell-ellipsis {
3593
- overflow: hidden;
3594
- text-overflow: ellipsis;
3595
- white-space: nowrap;
3596
- }
3597
- .semi-table-tbody > .semi-table-row.semi-table-row-expand > .semi-table-row-cell {
3598
- background-color: var(--semi-color-fill-0);
3599
- }
3600
- .semi-table-tbody > .semi-table-row.semi-table-row-hidden {
3601
- display: none;
3602
- }
3603
- .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left, .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right {
3604
- z-index: 101;
3605
- position: sticky;
3606
- background-color: var(--semi-color-bg-1);
3607
- }
3608
- .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last {
3609
- border-right: 1px solid var(--semi-color-border);
3610
- box-shadow: 3px 0 0 0 var(--semi-color-shadow);
3611
- }
3612
- .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first {
3613
- border-left: 1px solid var(--semi-color-border);
3614
- box-shadow: -3px 0 0 0 var(--semi-color-shadow);
3615
- }
3616
- .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed > * {
3617
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeOut) 0ms;
3618
- }
3619
- .semi-table-tbody > .semi-table-row > * {
3620
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeOut) 0ms;
3621
- }
3622
- .semi-table-tbody > .semi-table-row-section {
3623
- display: table-row;
3624
- }
3625
- .semi-table-tbody > .semi-table-row-section > .semi-table-row-cell {
3626
- background-color: rgba(var(--semi-grey-0), 1);
3627
- border-bottom: 1px solid var(--semi-color-border);
3628
- }
3629
- .semi-table-tbody > .semi-table-row-section > .semi-table-row-cell:not(.semi-table-column-selection) {
3630
- padding: 10px 16px;
3631
- }
3632
- .semi-table-tbody > .semi-table-row-section .semi-table-section-inner {
3633
- display: inline-flex;
3634
- align-items: center;
3635
- }
3636
- .semi-table-virtualized .semi-table-tbody {
3637
- display: block;
3638
- }
3639
- .semi-table-virtualized .semi-table-tbody > .semi-table-row {
3640
- display: flex;
3641
- }
3642
- .semi-table-virtualized .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3643
- word-wrap: unset;
3644
- word-break: unset;
3645
- white-space: nowrap;
3646
- display: inline-flex;
3647
- align-items: center;
3648
- overflow: hidden;
3649
- }
3650
- .semi-table-virtualized .semi-table-tbody > .semi-table-row-section > .semi-table-row-cell {
3651
- padding-top: 16px;
3652
- padding-bottom: 16px;
3653
- display: flex;
3654
- }
3655
- .semi-table-virtualized .semi-table-tbody > .semi-table-row-expand > .semi-table-row-cell {
3656
- padding: 0;
3657
- overflow: unset;
3658
- }
3659
- .semi-table-footer {
3660
- background-color: var(--semi-color-fill-0);
3661
- padding: 16px;
3662
- margin: 0;
3663
- position: relative;
3664
- }
3665
- .semi-table .semi-table-selection-wrap {
3666
- display: inline-flex;
3667
- vertical-align: bottom;
3668
- }
3669
- .semi-table .semi-table-selection-disabled {
3670
- cursor: not-allowed;
3671
- }
3672
- .semi-table .semi-table-selection-disabled > .semi-checkbox {
3673
- pointer-events: none;
3674
- }
3675
- .semi-table .semi-table-column-hidden {
3676
- display: none;
3677
- }
3678
- .semi-table .semi-table-column-selection {
3679
- text-align: center;
3680
- }
3681
- .semi-table .semi-table-column-selection .semi-checkbox-inner-display .semi-icon {
3682
- left: 0;
3683
- top: 0;
3684
- }
3685
- .semi-table .semi-table-column-expand .semi-table-expand-icon {
3686
- transform: translateY(2px);
3687
- }
3688
- .semi-table .semi-table-column-expand .semi-table-expand-icon:last-child {
3689
- margin-right: 0;
3690
- }
3691
- .semi-table .semi-table-column-sorter {
3692
- display: inline-block;
3693
- width: 16px;
3694
- height: 16px;
3695
- vertical-align: middle;
3696
- text-align: center;
3697
- }
3698
- .semi-table .semi-table-column-sorter-wrapper {
3699
- display: flex;
3700
- gap: 4px;
3701
- align-items: center;
3702
- cursor: pointer;
3703
- overflow: hidden;
3704
- }
3705
- .semi-table .semi-table-column-sorter-up, .semi-table .semi-table-column-sorter-down {
3706
- height: 0;
3707
- display: block;
3708
- color: var(--semi-color-text-2);
3709
- }
3710
- .semi-table .semi-table-column-sorter-up:hover .anticon, .semi-table .semi-table-column-sorter-down:hover .anticon {
3711
- color: var(--semi-color-text-2);
3712
- }
3713
- .semi-table .semi-table-column-sorter-up svg, .semi-table .semi-table-column-sorter-down svg {
3714
- width: 16px;
3715
- height: 16px;
3716
- }
3717
- .semi-table .semi-table-column-sorter-up.on .semi-icon-caretup,
3718
- .semi-table .semi-table-column-sorter-up.on .semi-icon-caretdown, .semi-table .semi-table-column-sorter-down.on .semi-icon-caretup,
3719
- .semi-table .semi-table-column-sorter-down.on .semi-icon-caretdown {
3720
- color: var(--semi-color-primary);
3721
- }
3722
- .semi-table .semi-table-column-filter {
3723
- margin-left: 4px;
3724
- display: inline-flex;
3725
- cursor: pointer;
3726
- color: var(--semi-color-text-2);
3727
- align-items: center;
3728
- }
3729
- .semi-table .semi-table-column-filter svg {
3730
- width: 16px;
3731
- height: 16px;
3732
- }
3733
- .semi-table .semi-table-column-filter.on {
3734
- color: var(--semi-color-primary);
3735
- }
3736
- .semi-table-bordered > .semi-table-title {
3737
- padding-left: 16px;
3738
- padding-right: 16px;
3739
- border-top: 1px solid var(--semi-color-border);
3740
- border-right: 1px solid var(--semi-color-border);
3741
- border-left: 1px solid var(--semi-color-border);
3742
- }
3743
- .semi-table-bordered > .semi-table-container {
3744
- border: 1px solid var(--semi-color-border);
3745
- border-right: 0;
3746
- border-bottom: 0;
3747
- }
3748
- :where(.semi-table-bordered) > .semi-table-container > .semi-table-header::-webkit-scrollbar {
3749
- border-right: 1px solid var(--semi-color-border);
3750
- }
3751
- :where(.semi-table-bordered) > .semi-table-container > .semi-table-footer {
3752
- border-left: 1px solid var(--semi-color-border);
3753
- border-right: 1px solid var(--semi-color-border);
3754
- border-bottom: 1px solid var(--semi-color-border);
3755
- }
3756
- .semi-table-bordered:not(.semi-table-scroll-position-right) > .semi-table-container::after {
3757
- content: "";
3758
- position: absolute;
3759
- top: 0;
3760
- right: 0;
3761
- bottom: 0;
3762
- width: 1px;
3763
- background-color: var(--semi-color-border);
3764
- display: block;
3765
- z-index: 103;
3766
- pointer-events: none;
3767
- }
3768
- .semi-table-bordered:not(.semi-table-scroll-position-right) > .semi-table-container > .semi-table-header {
3769
- box-shadow: inset -1px 0 0 0 var(--semi-color-border);
3770
- }
3771
- :where(.semi-table-bordered > .semi-table-container) > .semi-table-body > .semi-table-placeholder {
3772
- border-right: 1px solid var(--semi-color-border);
3773
- }
3774
- :where(.semi-table-bordered > .semi-table-container > .semi-table-body) > .semi-table > .semi-table-thead > .semi-table-row > .semi-table-row-head .react-resizable-handle {
3775
- background-color: transparent;
3776
- }
3777
- :where(.semi-table-bordered > .semi-table-container > .semi-table-body) > .semi-table > .semi-table-thead > .semi-table-row > .semi-table-row-head, :where(.semi-table-bordered > .semi-table-container > .semi-table-body) > .semi-table > .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3778
- border-right: 1px solid var(--semi-color-border);
3779
- }
3780
- :where(.semi-table-bordered > .semi-table-container > .semi-table-header) > .semi-table > .semi-table-thead > .semi-table-row > .semi-table-row-head {
3781
- border-right: 1px solid var(--semi-color-border);
3782
- }
3783
- :where(.semi-table-bordered > .semi-table-container > .semi-table-header) > .semi-table > .semi-table-thead > .semi-table-row > .semi-table-row-head .react-resizable-handle {
3784
- background-color: transparent;
3785
- }
3786
- .semi-table-placeholder {
3787
- position: sticky;
3788
- left: 0px;
3789
- z-index: 1;
3790
- box-sizing: border-box;
3791
- padding: 16px 12px;
3792
- color: var(--semi-color-text-2);
3793
- font-size: 14px;
3794
- text-align: center;
3795
- background: transparent;
3796
- border-bottom: 1px solid var(--semi-color-border);
3797
- }
3798
- .semi-table-fixed {
3799
- table-layout: fixed;
3800
- min-width: 100%;
3801
- }
3802
- .semi-table-fixed > .semi-table-tbody > .semi-table-row-expand > .semi-table-row-cell > .semi-table-expand-inner, .semi-table-fixed > .semi-table-tbody > .semi-table-row-section > .semi-table-row-cell > .semi-table-section-inner {
3803
- position: sticky;
3804
- overflow: auto;
3805
- left: 0;
3806
- margin-left: -16px;
3807
- margin-right: -16px;
3808
- padding-left: 16px;
3809
- padding-right: 16px;
3810
- height: 100%;
3811
- display: flex;
3812
- align-items: center;
3813
- }
3814
- .semi-table-fixed-header table {
3815
- table-layout: fixed;
3816
- }
3817
- .semi-table-scroll-position-left .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last,
3818
- .semi-table-scroll-position-left .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-left-last {
3819
- box-shadow: none;
3820
- }
3821
- .semi-table-scroll-position-right .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first,
3822
- .semi-table-scroll-position-right .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-right-first {
3823
- box-shadow: none;
3824
- }
3825
- .semi-table-pagination-outer {
3826
- color: var(--semi-color-text-2);
3827
- min-height: 60px;
3828
- }
3829
-
3830
- .semi-table-expand-icon {
3831
- color: var(--semi-color-text-2);
3832
- cursor: pointer;
3833
- display: inline-flex;
3834
- align-items: center;
3835
- user-select: none;
3836
- background: transparent;
3837
- position: relative;
3838
- margin-right: 8px;
3839
- }
3840
- .semi-table-expand-icon-cell {
3841
- display: inline-flex;
3842
- align-items: center;
3843
- justify-content: center;
3844
- }
3845
- .semi-table-expand-icon .semi-table-expandedIcon-show {
3846
- transition: transform 150ms cubic-bezier(0.62, 0.05, 0.36, 0.95);
3847
- transform: rotate(90deg);
3848
- }
3849
- .semi-table-expand-icon .semi-table-expandedIcon-hide {
3850
- transition: transform 150ms cubic-bezier(0.62, 0.05, 0.36, 0.95);
3851
- transform: rotate(0deg);
3852
- }
3853
-
3854
- .semi-table-column-filter-dropdown .semi-dropdown-menu {
3855
- max-height: 290px;
3856
- overflow-y: auto;
3857
- }
3858
-
3859
- .semi-table-wrapper-rtl .semi-table {
3860
- direction: rtl;
3861
- text-align: right;
3862
- }
3863
- .semi-table-wrapper-rtl .semi-table-align-left .semi-table-operate-wrapper {
3864
- justify-content: flex-end;
3865
- }
3866
- .semi-table-wrapper-rtl .semi-table-align-right .semi-table-operate-wrapper {
3867
- justify-content: flex-start;
3868
- }
3869
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head {
3870
- text-align: right;
3871
- }
3872
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last {
3873
- border-right: 0;
3874
- border-left: 1px solid var(--semi-color-border);
3875
- }
3876
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last.resizing {
3877
- border-left: 2px solid var(--semi-color-primary);
3878
- }
3879
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first {
3880
- border-left: 0;
3881
- border-right: 1px solid var(--semi-color-border);
3882
- }
3883
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first.resizing {
3884
- border-left: 2px solid var(--semi-color-primary);
3885
- }
3886
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first[x-type=column-scrollbar] {
3887
- box-shadow: none;
3888
- border-right: transparent;
3889
- }
3890
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row .resizing {
3891
- border-left: 2px solid var(--semi-color-primary);
3892
- }
3893
- .semi-table-wrapper-rtl .semi-table-thead > .semi-table-row .react-resizable-handle {
3894
- right: auto;
3895
- left: -1px;
3896
- }
3897
- .semi-table-wrapper-rtl .semi-table-tbody {
3898
- display: table-row-group;
3899
- }
3900
- .semi-table-wrapper-rtl .semi-table-tbody > .semi-table-row > .semi-table-row-cell.resizing {
3901
- border-right: 0;
3902
- border-left: 2px solid var(--semi-color-primary);
3903
- }
3904
- .semi-table-wrapper-rtl .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last {
3905
- border-right: 0;
3906
- border-left: 1px solid var(--semi-color-border);
3907
- }
3908
- .semi-table-wrapper-rtl .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first {
3909
- border-left: 0;
3910
- border-right: 1px solid var(--semi-color-border);
3911
- }
3912
- .semi-table-wrapper-rtl .semi-table .semi-table-column-selection .semi-checkbox-inner-display .semi-icon {
3913
- left: auto;
3914
- right: 0;
3915
- }
3916
- .semi-table-wrapper-rtl .semi-table .semi-table-column-expand .semi-table-expand-icon {
3917
- transform: scaleX(-1) translateY(2px);
3918
- }
3919
- .semi-table-wrapper-rtl .semi-table .semi-table-column-expand .semi-table-expand-icon:last-child {
3920
- margin-right: auto;
3921
- margin-left: 0;
3922
- }
3923
- .semi-table-wrapper-rtl .semi-table .semi-table-column-sorter {
3924
- margin-left: 0;
3925
- margin-right: 4px;
3926
- }
3927
- .semi-table-wrapper-rtl .semi-table .semi-table-column-filter {
3928
- margin-left: 0;
3929
- margin-right: 4px;
3930
- }
3931
- .semi-table-wrapper-rtl .semi-table-bordered .semi-table-container {
3932
- border-left: 0;
3933
- border-right: 1px solid var(--semi-color-border);
3934
- }
3935
- .semi-table-wrapper-rtl .semi-table-bordered .semi-table-thead > .semi-table-row > .semi-table-row-head,
3936
- .semi-table-wrapper-rtl .semi-table-bordered .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
3937
- border-right: 0;
3938
- border-left: 1px solid var(--semi-color-border);
3939
- }
3940
- .semi-table-wrapper-rtl .semi-table-bordered .semi-table-placeholder {
3941
- border-left: 1px solid var(--semi-color-border);
3942
- border-right: 0;
3943
- }
3944
- .semi-table-wrapper-rtl .semi-table-bordered .semi-table-header::-webkit-scrollbar {
3945
- border-right: 0;
3946
- border-left: 1px solid var(--semi-color-border);
3947
- }
3948
- .semi-table-wrapper-rtl .semi-table-bordered:not(.semi-table-scroll-position-left) > .semi-table-container::after {
3949
- content: "";
3950
- position: absolute;
3951
- top: 0;
3952
- left: 0;
3953
- bottom: 0;
3954
- width: 1px;
3955
- background-color: var(--semi-color-border);
3956
- display: block;
3957
- z-index: 103;
3958
- pointer-events: none;
3959
- }
3960
- .semi-table-wrapper-rtl .semi-table-fixed > .semi-table-tbody > .semi-table-row-expand > .semi-table-row-cell > .semi-table-expand-inner, .semi-table-wrapper-rtl .semi-table-fixed > .semi-table-tbody > .semi-table-row-section > .semi-table-row-cell > .semi-table-section-inner {
3961
- left: auto;
3962
- right: 0;
3963
- margin-right: -16px;
3964
- margin-left: -16px;
3965
- padding-right: 16px;
3966
- padding-left: 16px;
3967
- }
3968
- .semi-table-wrapper-rtl .semi-table-scroll-position-left .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last,
3969
- .semi-table-wrapper-rtl .semi-table-scroll-position-left .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-left-last {
3970
- box-shadow: 3px 0 0 0 var(--semi-color-shadow);
3971
- }
3972
- .semi-table-wrapper-rtl .semi-table-scroll-position-left .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first,
3973
- .semi-table-wrapper-rtl .semi-table-scroll-position-left .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-right-first {
3974
- box-shadow: none;
3975
- }
3976
- .semi-table-wrapper-rtl .semi-table-scroll-position-right .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last,
3977
- .semi-table-wrapper-rtl .semi-table-scroll-position-right .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-left-last {
3978
- box-shadow: none;
3979
- }
3980
- .semi-table-wrapper-rtl .semi-table-scroll-position-right .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first,
3981
- .semi-table-wrapper-rtl .semi-table-scroll-position-right .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-right-first {
3982
- box-shadow: -3px 0 0 0 var(--semi-color-shadow);
3983
- }
3984
- .semi-table-wrapper-rtl .semi-table-expand-icon {
3985
- margin-right: auto;
3986
- margin-left: 8px;
3987
- transform: scaleX(-1) translateY(2px);
3988
- }
3989
- .semi-table-wrapper-rtl .semi-spin {
3990
- direction: rtl;
3991
- }
3992
-
3993
- .semi-page {
3994
- display: flex;
3995
- list-style: none;
3996
- padding: 0;
3997
- align-items: center;
3998
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3999
- margin-block-start: 0;
4000
- margin-block-end: 0;
4001
- }
4002
- .semi-page-small {
4003
- font-size: 14px;
4004
- line-height: 20px;
4005
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4006
- font-weight: 400;
4007
- color: var(--semi-color-text-2);
4008
- padding: 0 0;
4009
- }
4010
- .semi-page-disabled {
4011
- cursor: not-allowed;
4012
- }
4013
- .semi-page-disabled .semi-page-total {
4014
- color: var(--semi-color-disabled-text);
4015
- }
4016
- .semi-page-item {
4017
- font-size: 14px;
4018
- line-height: 20px;
4019
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4020
- min-width: 32px;
4021
- border: 0px solid transparent;
4022
- cursor: pointer;
4023
- user-select: none;
4024
- height: 32px;
4025
- margin-left: 4px;
4026
- margin-right: 4px;
4027
- font-weight: 400;
4028
- color: var(--semi-color-text-0);
4029
- border-radius: var(--semi-border-radius-small);
4030
- text-align: center;
4031
- line-height: 32px;
4032
- display: flex;
4033
- align-items: center;
4034
- justify-content: center;
4035
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
4036
- transform: scale(var(--semi-transform_scale-none));
4037
- }
4038
- .semi-page-item:hover {
4039
- border-color: transparent;
4040
- background-color: var(--semi-color-fill-0);
4041
- color: var(--semi-color-text-0);
4042
- }
4043
- .semi-page-item-rest-opening {
4044
- background-color: var(--semi-color-fill-0);
4045
- color: var(--semi-color-text-0);
4046
- }
4047
- .semi-page-item:active {
4048
- border-color: transparent;
4049
- background-color: var(--semi-color-fill-1);
4050
- color: var(--semi-color-text-0);
4051
- }
4052
- .semi-page-item-active {
4053
- border-color: transparent;
4054
- color: var(--semi-color-primary);
4055
- font-weight: 600;
4056
- background-color: var(--semi-color-primary-light-default);
4057
- }
4058
- .semi-page-item-active:hover {
4059
- border-color: transparent;
4060
- color: var(--semi-color-primary);
4061
- background-color: var(--semi-color-primary-light-default);
4062
- }
4063
- .semi-page-item-disabled {
4064
- border-color: transparent;
4065
- color: var(--semi-color-disabled-text);
4066
- background-color: transparent;
4067
- cursor: not-allowed;
4068
- }
4069
- .semi-page-item-disabled:hover {
4070
- background-color: transparent;
4071
- }
4072
- .semi-page-item-small {
4073
- min-width: 44px;
4074
- margin: 0;
4075
- }
4076
- .semi-page-item-all-disabled {
4077
- border-color: transparent;
4078
- color: var(--semi-color-disabled-text);
4079
- background-color: transparent;
4080
- cursor: not-allowed;
4081
- }
4082
- .semi-page-item-all-disabled:hover {
4083
- background-color: transparent;
4084
- color: var(--semi-color-disabled-text);
4085
- }
4086
- .semi-page-item-all-disabled-active {
4087
- background-color: var(--semi-color-disabled-fill);
4088
- font-weight: 600;
4089
- }
4090
- .semi-page-item-all-disabled-active:hover {
4091
- background-color: var(--semi-color-disabled-fill);
4092
- }
4093
- .semi-page-total {
4094
- font-size: 14px;
4095
- line-height: 20px;
4096
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4097
- color: var(--semi-color-text-2);
4098
- }
4099
- .semi-page-prev, .semi-page-next {
4100
- color: var(--semi-color-tertiary);
4101
- cursor: pointer;
4102
- }
4103
- .semi-page-prev.semi-page-item-disabled, .semi-page-next.semi-page-item-disabled {
4104
- color: var(--semi-color-disabled-text);
4105
- cursor: not-allowed;
4106
- }
4107
- .semi-page-quickjump {
4108
- margin-left: 24px;
4109
- font-size: 14px;
4110
- line-height: 20px;
4111
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4112
- display: flex;
4113
- justify-content: center;
4114
- align-items: center;
4115
- flex-shrink: 0;
4116
- color: var(--semi-color-text-0);
4117
- }
4118
- .semi-page-quickjump-input-number {
4119
- max-width: 50px;
4120
- margin-left: 4px;
4121
- margin-right: 4px;
4122
- }
4123
- .semi-page-quickjump-disabled {
4124
- color: var(--semi-color-disabled-text);
4125
- }
4126
- .semi-page .semi-select {
4127
- user-select: none;
4128
- }
4129
-
4130
- .semi-select-dropdown {
4131
- user-select: none;
4132
- }
4133
-
4134
- .semi-page-rest-list {
4135
- padding-top: 4px;
4136
- padding-bottom: 4px;
4137
- }
4138
- .semi-page-rest-list > div {
4139
- position: relative;
4140
- }
4141
- .semi-page-rest-item {
4142
- height: 32px;
4143
- line-height: 32px;
4144
- display: flex;
4145
- justify-content: center;
4146
- box-sizing: border-box;
4147
- cursor: pointer;
4148
- }
4149
- .semi-page-rest-item:hover {
4150
- background-color: var(--semi-color-fill-0);
4151
- }
4152
- .semi-page-rest-item:active {
4153
- background-color: var(--semi-color-fill-1);
4154
- }
4155
-
4156
- .semi-rtl .semi-page,
4157
- .semi-portal-rtl .semi-page {
4158
- direction: rtl;
4159
- }
4160
- .semi-rtl .semi-page-item,
4161
- .semi-portal-rtl .semi-page-item {
4162
- margin-right: 4px;
4163
- margin-left: 4px;
4164
- }
4165
- .semi-rtl .semi-page-prev, .semi-rtl .semi-page-next,
4166
- .semi-portal-rtl .semi-page-prev,
4167
- .semi-portal-rtl .semi-page-next {
4168
- transform: scaleX(-1);
4169
- }
4170
-
4171
- .semi-codeHighlight-defaultTheme {
4172
- /**
4173
- * prism.js default theme for JavaScript, CSS and HTML
4174
- * Based on dabblet (http://dabblet.com)
4175
- * @author Lea Verou
4176
- */
4177
- }
4178
- .semi-codeHighlight-defaultTheme pre[class*=language-],
4179
- .semi-codeHighlight-defaultTheme code[class*=language-] {
4180
- color: var(--semi-color-text-0);
4181
- font-size: 13px;
4182
- text-shadow: none;
4183
- font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
4184
- direction: ltr;
4185
- text-align: left;
4186
- white-space: pre;
4187
- word-spacing: normal;
4188
- word-break: normal;
4189
- line-height: 1.5;
4190
- -moz-tab-size: 4;
4191
- -o-tab-size: 4;
4192
- tab-size: 4;
4193
- -moz-hyphens: none;
4194
- hyphens: none;
4195
- }
4196
- .semi-codeHighlight-defaultTheme pre[class*=language-]::selection,
4197
- .semi-codeHighlight-defaultTheme code[class*=language-]::selection,
4198
- .semi-codeHighlight-defaultTheme pre[class*=language-]::-moz-selection,
4199
- .semi-codeHighlight-defaultTheme code[class*=language-]::-moz-selection {
4200
- text-shadow: none;
4201
- background: #b3d4fc;
4202
- }
4203
- .semi-codeHighlight-defaultTheme pre[class*=language-] {
4204
- padding: 1em;
4205
- margin: 0.5em 0;
4206
- overflow: auto;
4207
- background: var(--semi-color-tertiary-light-default);
4208
- }
4209
- .semi-codeHighlight-defaultTheme :not(pre) > code[class*=language-] {
4210
- display: block;
4211
- border-radius: 0.3em;
4212
- color: #895fe2;
4213
- background: #f9f7f9;
4214
- }
4215
- .semi-codeHighlight-defaultTheme pre .namespace {
4216
- opacity: 0.7;
4217
- }
4218
- .semi-codeHighlight-defaultTheme pre .token.comment,
4219
- .semi-codeHighlight-defaultTheme pre .token.prolog,
4220
- .semi-codeHighlight-defaultTheme pre .token.doctype,
4221
- .semi-codeHighlight-defaultTheme pre .token.cdata {
4222
- color: #6b7075;
4223
- }
4224
- .semi-codeHighlight-defaultTheme pre .token.punctuation {
4225
- color: rgba(var(--semi-grey-8), 1);
4226
- }
4227
- .semi-codeHighlight-defaultTheme pre .token.property,
4228
- .semi-codeHighlight-defaultTheme pre .token.tag,
4229
- .semi-codeHighlight-defaultTheme pre .token.boolean,
4230
- .semi-codeHighlight-defaultTheme pre .token.number,
4231
- .semi-codeHighlight-defaultTheme pre .token.constant,
4232
- .semi-codeHighlight-defaultTheme pre .token.symbol,
4233
- .semi-codeHighlight-defaultTheme pre .token.deleted {
4234
- color: rgba(var(--semi-purple-6), 1);
4235
- }
4236
- .semi-codeHighlight-defaultTheme pre .token.selector,
4237
- .semi-codeHighlight-defaultTheme pre .token.attr-name,
4238
- .semi-codeHighlight-defaultTheme pre .token.string,
4239
- .semi-codeHighlight-defaultTheme pre .token.char,
4240
- .semi-codeHighlight-defaultTheme pre .token.builtin,
4241
- .semi-codeHighlight-defaultTheme pre .token.inserted {
4242
- color: rgba(var(--semi-green-6), 1);
4243
- }
4244
- .semi-codeHighlight-defaultTheme pre .token.operator,
4245
- .semi-codeHighlight-defaultTheme pre .token.entity,
4246
- .semi-codeHighlight-defaultTheme pre .token.url,
4247
- .semi-codeHighlight-defaultTheme pre .language-css .token.string,
4248
- .semi-codeHighlight-defaultTheme pre .style .token.string {
4249
- color: rgba(var(--semi-grey-8), 1);
4250
- }
4251
- .semi-codeHighlight-defaultTheme pre .token.atrule,
4252
- .semi-codeHighlight-defaultTheme pre .token.attr-value,
4253
- .semi-codeHighlight-defaultTheme pre .token.keyword {
4254
- color: rgba(var(--semi-purple-6), 1);
4255
- }
4256
- .semi-codeHighlight-defaultTheme pre .token.function {
4257
- color: rgba(var(--semi-violet-6), 1);
4258
- }
4259
- .semi-codeHighlight-defaultTheme pre .token.regex,
4260
- .semi-codeHighlight-defaultTheme pre .token.important,
4261
- .semi-codeHighlight-defaultTheme pre .token.variable {
4262
- color: #d0955f;
4263
- }
4264
- .semi-codeHighlight-defaultTheme pre .token.important,
4265
- .semi-codeHighlight-defaultTheme pre .token.bold {
4266
- font-weight: bold;
4267
- }
4268
- .semi-codeHighlight-defaultTheme pre .token.italic {
4269
- font-style: italic;
4270
- }
4271
- .semi-codeHighlight-defaultTheme pre .token.entity {
4272
- cursor: help;
4273
- }
4274
- .semi-codeHighlight-defaultTheme pre[data-line] {
4275
- position: relative;
4276
- }
4277
- .semi-codeHighlight-defaultTheme pre[class*=language-] > code[class*=language-] {
4278
- position: relative;
4279
- z-index: 1;
4280
- }
4281
- .semi-codeHighlight-defaultTheme .line-highlight {
4282
- position: absolute;
4283
- left: 0;
4284
- right: 0;
4285
- padding: inherit 0;
4286
- margin-top: 1em;
4287
- background: #ebf4ff;
4288
- box-shadow: inset 5px 0 0 #0064d2;
4289
- z-index: 0;
4290
- pointer-events: none;
4291
- line-height: inherit;
4292
- white-space: pre;
4293
- }
4294
- .semi-codeHighlight pre[class*=language-].line-numbers {
4295
- position: relative;
4296
- padding-left: 3.8em;
4297
- counter-reset: linenumber;
4298
- }
4299
- .semi-codeHighlight pre[class*=language-].line-numbers > code {
4300
- position: relative;
4301
- white-space: inherit;
4302
- }
4303
- .semi-codeHighlight .line-numbers .line-numbers-rows {
4304
- position: absolute;
4305
- pointer-events: none;
4306
- top: 0;
4307
- font-size: 100%;
4308
- left: -3.8em;
4309
- width: 3em; /* works for line-numbers below 1000 lines */
4310
- letter-spacing: -1px;
4311
- border-right: 1px solid #999;
4312
- -webkit-user-select: none;
4313
- -moz-user-select: none;
4314
- -ms-user-select: none;
4315
- user-select: none;
4316
- }
4317
- .semi-codeHighlight .line-numbers-rows > span {
4318
- display: block;
4319
- counter-increment: linenumber;
4320
- }
4321
- .semi-codeHighlight .line-numbers-rows > span:before {
4322
- content: counter(linenumber);
4323
- color: #999;
4324
- display: block;
4325
- padding-right: 0.8em;
4326
- text-align: right;
4327
- }
4328
-
4329
- .semi-markdownRender-simple-code {
4330
- background: var(--semi-color-fill-0);
4331
- color: var(--semi-color-text-1);
4332
- }
4333
- .semi-markdownRender ul, .semi-markdownRender li {
4334
- color: var(--semi-color-text-0);
4335
- }
4336
- .semi-markdownRender-component-image {
4337
- margin: 16px 16px 16px 16px;
4338
- max-width: 50%;
4339
- max-height: 500px;
4340
- display: flex;
4341
- flex-direction: column;
4342
- justify-content: center;
4343
- }
4344
- .semi-markdownRender-component-image-alt {
4345
- margin-top: 8px;
4346
- text-align: center;
4347
- color: var(--semi-color-tertiary);
4348
- }
4349
- .semi-markdownRender-component-header.semi-typography.semi-typography-h1 {
4350
- margin-top: 16px;
4351
- margin-bottom: 16px;
4352
- }
4353
- .semi-markdownRender-component-header.semi-typography.semi-typography-h2 {
4354
- margin-top: 16px;
4355
- margin-bottom: 16px;
4356
- }
4357
- .semi-markdownRender-component-header.semi-typography.semi-typography-h3 {
4358
- margin-top: 16px;
4359
- margin-bottom: 16px;
4360
- }
4361
- .semi-markdownRender-component-header.semi-typography.semi-typography-h4 {
4362
- margin-top: 16px;
4363
- margin-bottom: 16px;
4364
- }
4365
- .semi-markdownRender-component-header.semi-typography.semi-typography-h5 {
4366
- margin-top: 16px;
4367
- margin-bottom: 16px;
4368
- }
4369
- .semi-markdownRender-component-p strong {
4370
- font-weight: 600;
4371
- }
4372
-
4373
- .semi-chat {
4374
- padding-top: 12px;
4375
- padding-bottom: 12px;
4376
- display: flex;
4377
- flex-direction: column;
4378
- height: 100%;
4379
- max-width: 800px;
4380
- position: relative;
4381
- overflow: hidden;
4382
- }
4383
- .semi-chat-inner {
4384
- display: flex;
4385
- flex-direction: column;
4386
- height: 100%;
4387
- }
4388
- .semi-chat-dropArea {
4389
- position: absolute;
4390
- top: 0;
4391
- left: 0;
4392
- right: 0;
4393
- bottom: 0;
4394
- background: rgba(var(--semi-grey-2), 0.9);
4395
- z-index: 10;
4396
- border: 5px dotted var(--semi-color-border);
4397
- display: flex;
4398
- align-items: center;
4399
- justify-content: center;
4400
- border-radius: 16px;
4401
- }
4402
- .semi-chat-dropArea-text {
4403
- font-size: 48px;
4404
- }
4405
- .semi-chat-content {
4406
- overflow: hidden;
4407
- flex: 1 1;
4408
- position: relative;
4409
- }
4410
- .semi-chat-toast {
4411
- position: absolute;
4412
- top: 0;
4413
- left: 50%;
4414
- transform: translateX(-50%);
4415
- }
4416
- .semi-chat-container {
4417
- padding-left: 16px;
4418
- padding-right: 16px;
4419
- height: 100%;
4420
- overflow: scroll;
4421
- }
4422
- .semi-chat-container-scroll-hidden::-webkit-scrollbar {
4423
- display: none;
4424
- }
4425
- .semi-chat-action {
4426
- position: relative;
4427
- z-index: 1;
4428
- }
4429
- .semi-chat-action-content.semi-button {
4430
- position: absolute;
4431
- bottom: 0;
4432
- left: 50%;
4433
- transform: translateX(-50%);
4434
- display: flex;
4435
- justify-content: center;
4436
- align-items: center;
4437
- background: var(--semi-color-bg-0);
4438
- border: 1px solid var(--semi-color-border);
4439
- }
4440
- .semi-chat-action-content.semi-button-light:not(.semi-button-disabled):hover {
4441
- background: var(--semi-color-tertiary-light-hover);
4442
- border: 1px solid var(--semi-color-border);
4443
- }
4444
- .semi-chat-action-backBottom.semi-button {
4445
- width: 42px;
4446
- height: 42px;
4447
- border-radius: 50%;
4448
- }
4449
- .semi-chat-action-stop.semi-button {
4450
- user-select: none;
4451
- height: 42px;
4452
- border-radius: 21px;
4453
- }
4454
- .semi-chat-divider {
4455
- color: var(--semi-color-text-2);
4456
- font-size: 12px;
4457
- margin-top: 12px;
4458
- margin-bottom: 12px;
4459
- font-weight: 400;
4460
- }
4461
- .semi-chat-chatBox {
4462
- display: flex;
4463
- flex-direction: row;
4464
- margin-top: 8px;
4465
- margin-bottom: 8px;
4466
- column-gap: 12px;
4467
- }
4468
- .semi-chat-chatBox:hover .semi-chat-chatBox-action:not(.semi-chat-chatBox-action-hidden) {
4469
- visibility: visible;
4470
- }
4471
- .semi-chat-chatBox-right {
4472
- flex-direction: row-reverse;
4473
- }
4474
- .semi-chat-chatBox-right .semi-chat-chatBox-wrap {
4475
- align-items: flex-end;
4476
- }
4477
- .semi-chat-chatBox-avatar {
4478
- flex-shrink: 0;
4479
- width: 24px;
4480
- height: 24px;
4481
- }
4482
- .semi-chat-chatBox-avatar-hidden {
4483
- visibility: hidden;
4484
- }
4485
- .semi-chat-chatBox-title {
4486
- line-height: 20px;
4487
- font-size: 16px;
4488
- color: var(--semi-color-text-0);
4489
- font-weight: 400;
4490
- text-overflow: ellipsis;
4491
- }
4492
- .semi-chat-chatBox-action {
4493
- visibility: hidden;
4494
- display: flex;
4495
- align-items: center;
4496
- position: relative;
4497
- column-gap: 10px;
4498
- margin-left: 10px;
4499
- margin-right: 10px;
4500
- }
4501
- .semi-chat-chatBox-action-btn.semi-button {
4502
- height: fit-content;
4503
- width: fit-content;
4504
- }
4505
- .semi-chat-chatBox-action-btn.semi-button.semi-button-with-icon-only {
4506
- padding: 0;
4507
- }
4508
- .semi-chat-chatBox-action-icon-flip {
4509
- transform: scaleY(-1);
4510
- }
4511
- .semi-chat-chatBox-action-show {
4512
- visibility: visible;
4513
- }
4514
- .semi-chat-chatBox-action-delete-wrap {
4515
- display: inline-flex;
4516
- }
4517
- .semi-chat-chatBox-action.semi-chat-chatBox-action-hidden, .semi-chat-chatBox-action:hover.semi-chat-chatBox-action-hidden {
4518
- visibility: hidden;
4519
- }
4520
- .semi-chat-chatBox-action .semi-button-borderless:not(.semi-button-disabled):hover {
4521
- background-color: transparent;
4522
- }
4523
- .semi-chat-chatBox-action .semi-button-tertiary.semi-button-borderless {
4524
- color: var(--semi-color-text-2);
4525
- }
4526
- .semi-chat-chatBox-action .semi-button-tertiary.semi-button-borderless:hover {
4527
- color: var(--semi-color-text-0);
4528
- }
4529
- .semi-chat-chatBox-wrap {
4530
- display: flex;
4531
- flex-direction: column;
4532
- align-items: flex-start;
4533
- position: relative;
4534
- row-gap: 8px;
4535
- max-width: calc(100% - 12px - 24px);
4536
- }
4537
- .semi-chat-chatBox-content-bubble, .semi-chat-chatBox-content-userBubble {
4538
- padding: 8px 12px;
4539
- border-radius: var(--semi-border-radius-large);
4540
- background-color: var(--semi-color-fill-0);
4541
- max-width: 100%;
4542
- box-sizing: border-box;
4543
- }
4544
- .semi-chat-chatBox-content code {
4545
- white-space: pre-wrap;
4546
- }
4547
- .semi-chat-chatBox-content .semi-typography {
4548
- color: var(--semi-color-text-0);
4549
- }
4550
- .semi-chat-chatBox-content .semi-chat-attachment-file {
4551
- background: var(--semi-color-fill-2);
4552
- }
4553
- .semi-chat-chatBox-content .semi-chat-attachment-file, .semi-chat-chatBox-content .semi-chat-attachment-img {
4554
- margin-top: 4px;
4555
- margin-bottom: 4px;
4556
- margin-right: 4px;
4557
- }
4558
- .semi-chat-chatBox-content-user {
4559
- background: var(--semi-color-primary);
4560
- color: var(--semi-color-white);
4561
- }
4562
- .semi-chat-chatBox-content-user .semi-chat-attachment-file {
4563
- background: var(--semi-color-bg-0);
4564
- }
4565
- .semi-chat-chatBox-content-user .semi-typography, .semi-chat-chatBox-content-user .semi-typography code {
4566
- color: var(--semi-color-white);
4567
- }
4568
- .semi-chat-chatBox-content-user .semi-markdownRender ul, .semi-chat-chatBox-content-user .semi-markdownRender li {
4569
- color: var(--semi-color-white);
4570
- }
4571
- .semi-chat-chatBox-content-user .semi-typography a, .semi-chat-chatBox-content-user .semi-typography a:visited, .semi-chat-chatBox-content-user .semi-typography a:hover {
4572
- color: var(--semi-color-white);
4573
- }
4574
- .semi-chat-chatBox-content-error {
4575
- background: var(--semi-color-danger-hover);
4576
- }
4577
- .semi-chat-chatBox-content-error .semi-typography {
4578
- color: var(--semi-color-white);
4579
- }
4580
- .semi-chat-chatBox-content-loading {
4581
- display: flex;
4582
- align-items: baseline;
4583
- }
4584
- .semi-chat-chatBox-content-loading-item {
4585
- border-radius: 50%;
4586
- height: 8px;
4587
- width: 8px;
4588
- background-color: var(--semi-color-text-0);
4589
- margin: 6px 18px;
4590
- overflow: visible;
4591
- position: relative;
4592
- animation: semi-chat-loading-flashing 0.8s infinite alternate;
4593
- animation-delay: -0.2s;
4594
- animation-timing-function: ease;
4595
- }
4596
- .semi-chat-chatBox-content-loading-item::before {
4597
- content: "";
4598
- border-radius: 50%;
4599
- height: 8px;
4600
- width: 8px;
4601
- background-color: var(--semi-color-text-0);
4602
- position: absolute;
4603
- top: 0;
4604
- left: -15px;
4605
- animation: semi-chat-loading-flashing 0.8s infinite alternate;
4606
- animation-timing-function: ease;
4607
- animation-delay: -0.4s;
4608
- }
4609
- .semi-chat-chatBox-content-loading-item::after {
4610
- content: "";
4611
- border-radius: 50%;
4612
- height: 8px;
4613
- width: 8px;
4614
- background-color: var(--semi-color-text-0);
4615
- position: absolute;
4616
- top: 0;
4617
- left: 15px;
4618
- animation: semi-chat-loading-flashing 0.8s infinite alternate;
4619
- animation-delay: 0s;
4620
- animation-timing-function: ease;
4621
- }
4622
- .semi-chat-chatBox-content pre {
4623
- background-color: transparent;
4624
- }
4625
- .semi-chat-chatBox-content-code {
4626
- border-radius: var(--semi-border-radius-large);
4627
- overflow: hidden;
4628
- }
4629
- .semi-chat-chatBox-content-code .semi-codeHighlight pre {
4630
- word-break: break-all;
4631
- white-space: pre-wrap;
4632
- }
4633
- .semi-chat-chatBox-content-code-topSlot {
4634
- display: flex;
4635
- justify-content: space-between;
4636
- background-color: rgba(var(--semi-grey-4), 1);
4637
- align-items: center;
4638
- padding: 5px 8px;
4639
- color: rgba(var(--semi-white), 1);
4640
- font-size: 12px;
4641
- }
4642
- .semi-chat-chatBox-content-code-topSlot-copy {
4643
- min-width: 150px;
4644
- display: flex;
4645
- justify-content: flex-end;
4646
- }
4647
- .semi-chat-chatBox-content-code-topSlot-copy-wrapper {
4648
- display: flex;
4649
- align-items: center;
4650
- column-gap: 5px;
4651
- cursor: pointer;
4652
- background: transparent;
4653
- border: none;
4654
- color: rgba(var(--semi-white), 1);
4655
- line-height: 16px;
4656
- padding: 5px;
4657
- border-radius: var(--semi-border-radius-large);
4658
- }
4659
- .semi-chat-chatBox-content-code-topSlot-toCopy:hover {
4660
- background: rgba(var(--semi-grey-5), 1);
4661
- }
4662
- .semi-chat-chatBox-content-code .semi-codeHighlight-defaultTheme pre[class*=language-] {
4663
- margin: 0px;
4664
- background: var(--semi-color-bg-0);
4665
- }
4666
- .semi-chat-inputBox {
4667
- padding-left: 16px;
4668
- padding-right: 16px;
4669
- padding-top: 8px;
4670
- padding-bottom: 8px;
4671
- }
4672
- .semi-chat-inputBox-clearButton.semi-button {
4673
- border-radius: 50%;
4674
- width: 48px;
4675
- height: 48px;
4676
- margin-top: 4px;
4677
- margin-bottom: 4px;
4678
- }
4679
- .semi-chat-inputBox-clearButton.semi-button .semi-icon {
4680
- font-size: 30px;
4681
- }
4682
- .semi-chat-inputBox-clearButton.semi-button.semi-button-primary.semi-button-borderless {
4683
- color: var(--semi-color-text-2);
4684
- }
4685
- .semi-chat-inputBox-upload .semi-upload-file-list {
4686
- display: none;
4687
- }
4688
- .semi-chat-inputBox-uploadButton.semi-button {
4689
- width: 32px;
4690
- height: 32px;
4691
- }
4692
- .semi-chat-inputBox-uploadButton.semi-button.semi-button-primary.semi-button-borderless {
4693
- color: var(--semi-color-text-0);
4694
- }
4695
- .semi-chat-inputBox-sendButton.semi-button {
4696
- width: 32px;
4697
- height: 32px;
4698
- }
4699
- .semi-chat-inputBox-sendButton.semi-button-icon {
4700
- transform: rotate(45deg);
4701
- }
4702
- .semi-chat-inputBox-sendButton.semi-button.semi-button-disabled.semi-button-borderless {
4703
- color: var(--semi-color-primary-disabled);
4704
- }
4705
- .semi-chat-inputBox-inner {
4706
- display: flex;
4707
- flex-direction: row;
4708
- align-items: flex-end;
4709
- column-gap: 4px;
4710
- }
4711
- .semi-chat-inputBox-container {
4712
- display: flex;
4713
- flex-direction: row;
4714
- flex-grow: 1;
4715
- border-radius: 16px;
4716
- padding: 11px;
4717
- border: 1px solid var(--semi-color-border);
4718
- align-items: flex-end;
4719
- }
4720
- .semi-chat-inputBox-inputArea {
4721
- flex-grow: 1;
4722
- display: flex;
4723
- flex-direction: column;
4724
- }
4725
- .semi-chat-inputBox-textarea {
4726
- flex-grow: 1;
4727
- }
4728
- .semi-chat-inputBox-textarea.semi-input-textarea-wrapper, .semi-chat-inputBox-textarea.semi-input-textarea-wrapper:hover, .semi-chat-inputBox-textarea.semi-input-textarea-wrapper:active {
4729
- border: none;
4730
- background-color: transparent;
4731
- }
4732
- .semi-chat-attachment {
4733
- display: flex;
4734
- flex-direction: row;
4735
- flex-wrap: wrap;
4736
- column-gap: 10px;
4737
- row-gap: 5px;
4738
- margin-left: 12px;
4739
- margin-right: 12px;
4740
- }
4741
- .semi-chat-attachment-item {
4742
- position: relative;
4743
- }
4744
- .semi-chat-attachment-item:hover .semi-chat-inputBox-attachment-clear {
4745
- visibility: visible;
4746
- }
4747
- .semi-chat-attachment-img {
4748
- border-radius: var(--semi-border-radius-medium);
4749
- vertical-align: top;
4750
- }
4751
- .semi-chat-attachment-img img {
4752
- object-fit: cover;
4753
- }
4754
- .semi-chat-attachment a {
4755
- text-decoration: none;
4756
- color: inherit;
4757
- }
4758
- .semi-chat-attachment-clear {
4759
- position: absolute;
4760
- top: -8px;
4761
- right: -8px;
4762
- color: var(--semi-color-text-2);
4763
- }
4764
- .semi-chat-attachment-process.semi-progress-circle, .semi-chat-attachment-fail {
4765
- position: absolute;
4766
- top: 50%;
4767
- left: 50%;
4768
- transform: translate(-50%, -50%);
4769
- }
4770
- .semi-chat-attachment-fail {
4771
- color: var(--semi-color-danger);
4772
- }
4773
- .semi-chat-attachment-file {
4774
- display: inline-flex;
4775
- flex-direction: row;
4776
- align-items: center;
4777
- height: 50px;
4778
- column-gap: 5px;
4779
- padding: 5px;
4780
- border-radius: var(--semi-border-radius-medium);
4781
- background: var(--semi-color-fill-0);
4782
- text-decoration: none;
4783
- }
4784
- .semi-chat-attachment-file-icon {
4785
- color: var(--semi-color-text-2);
4786
- }
4787
- .semi-chat-attachment-file-info {
4788
- display: flex;
4789
- flex-direction: column;
4790
- }
4791
- .semi-chat-attachment-file-title {
4792
- font-size: 16px;
4793
- color: var(--semi-color-text-0);
4794
- max-width: 90px;
4795
- text-overflow: ellipsis;
4796
- overflow: hidden;
4797
- }
4798
- .semi-chat-attachment-file-metadata {
4799
- font-size: 14px;
4800
- color: var(--semi-color-text-2);
4801
- }
4802
- .semi-chat-attachment-file-type {
4803
- text-transform: uppercase;
4804
- }
4805
- .semi-chat .semi-typography a.semi-chat-attachment-file {
4806
- display: flex;
4807
- }
4808
- .semi-chat .semi-typography a.semi-chat-attachment-file .semi-chat-attachment-file-title {
4809
- color: var(--semi-color-text-0);
4810
- }
4811
- .semi-chat-hints {
4812
- display: flex;
4813
- flex-direction: column;
4814
- row-gap: 10px;
4815
- margin-top: 12px;
4816
- margin-bottom: 12px;
4817
- margin-left: 34px;
4818
- }
4819
- .semi-chat-hint-item {
4820
- cursor: pointer;
4821
- display: flex;
4822
- flex-direction: row;
4823
- column-gap: 20px;
4824
- width: fit-content;
4825
- background: transparent;
4826
- align-items: center;
4827
- border: 1px solid var(--semi-color-border);
4828
- padding: 8px 12px;
4829
- border-radius: var(--semi-border-radius-large);
4830
- }
4831
- .semi-chat-hint-item:hover {
4832
- background-color: var(--semi-color-fill-0);
4833
- }
4834
- .semi-chat-hint-content {
4835
- font-size: 14px;
4836
- color: var(--semi-color-text-1);
4837
- }
4838
- .semi-chat-hint-icon {
4839
- color: var(--semi-color-text-2);
4840
- }
4841
-
4842
- @keyframes semi-chat-loading-flashing {
4843
- 0% {
4844
- opacity: 1;
4845
- }
4846
- 50% {
4847
- opacity: 0.1;
4848
- }
4849
- to {
4850
- opacity: 1;
4851
- }
4852
- }
4853
- .semi-rtl .semi-chat,
4854
- .semi-portal-rtl .semi-chat {
4855
- direction: rtl;
4856
- }
4857
- .semi-rtl .semi-chat-hint-icon,
4858
- .semi-portal-rtl .semi-chat-hint-icon {
4859
- transform: scaleX(-1);
4860
- }
4861
- .semi-rtl .semi-chat-inputBox-sendButton-icon,
4862
- .semi-portal-rtl .semi-chat-inputBox-sendButton-icon {
4863
- transform: rotate(225deg);
4864
- }
4865
- .semi-rtl .semi-chat-chatBox-action-icon-redo,
4866
- .semi-portal-rtl .semi-chat-chatBox-action-icon-redo {
4867
- transform: scaleX(-1);
4868
- }
4869
-
4870
5
  .semi-ai-chat-dialogue {
4871
6
  display: flex;
4872
7
  flex-direction: column;
@@ -5497,48 +632,4 @@ p.semi-typography-extended,
5497
632
  .semi-rtl .semi-ai-chat-dialogue-wrapper-action-icon-redo,
5498
633
  .semi-portal-rtl .semi-ai-chat-dialogue-wrapper-action-icon-redo {
5499
634
  transform: scaleX(-1);
5500
- }
5501
-
5502
- .semi-icon {
5503
- display: inline-block;
5504
- font-style: normal;
5505
- line-height: 0;
5506
- text-align: center;
5507
- text-transform: none;
5508
- text-rendering: optimizeLegibility;
5509
- fill: currentColor;
5510
- }
5511
-
5512
- .semi-icon-extra-small {
5513
- font-size: 8px;
5514
- }
5515
-
5516
- .semi-icon-small {
5517
- font-size: 12px;
5518
- }
5519
-
5520
- .semi-icon-default {
5521
- font-size: 16px;
5522
- }
5523
-
5524
- .semi-icon-large {
5525
- font-size: 20px;
5526
- }
5527
-
5528
- .semi-icon-extra-large {
5529
- font-size: 24px;
5530
- }
5531
-
5532
- .semi-icon-spinning {
5533
- animation: 0.6s linear infinite semi-icon-animation-rotate;
5534
- animation-fill-mode: forwards;
5535
- }
5536
-
5537
- @keyframes semi-icon-animation-rotate {
5538
- from {
5539
- transform: rotate(0);
5540
- }
5541
- to {
5542
- transform: rotate(360deg);
5543
- }
5544
- }
635
+ }