@aifuxi/semi-theme-default 1.2.0 → 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 +6 -0
  2. package/README.md +10 -1
  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
package/dist/table.css CHANGED
@@ -1,3641 +1,6 @@
1
1
  /* shadow */
2
2
  /* sizing */
3
3
  /* 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
- body, :host {
703
- --semi-transition_duration-slowest:0ms;
704
- --semi-transition_duration-slower:0ms;
705
- --semi-transition_duration-slow:0ms;
706
- --semi-transition_duration-normal:0ms;
707
- --semi-transition_duration-fast:0ms;
708
- --semi-transition_duration-faster:0ms;
709
- --semi-transition_duration-fastest:0ms;
710
- --semi-transition_duration-none:0ms;
711
- --semi-transition_function-linear:linear;
712
- --semi-transition_function-ease:ease;
713
- --semi-transition_function-easeIn:ease-in;
714
- --semi-transition_function-easeOut:ease-out;
715
- --semi-transition_function-easeInIOut:ease-in-out;
716
- --semi-transition_delay-none: 0ms;
717
- --semi-transition_delay-slowest:0ms;
718
- --semi-transition_delay-slower:0ms;
719
- --semi-transition_delay-slow:0ms;
720
- --semi-transition_delay-normal:0ms;
721
- --semi-transition_delay-fast:0ms;
722
- --semi-transition_delay-faster:0ms;
723
- --semi-transition_delay-fastest:0ms;
724
- --semi-transform_scale-none:scale(1,1);
725
- --semi-transform_scale-small:scale(1,1);
726
- --semi-transform_scale-medium:scale(1,1);
727
- --semi-transform_scale-large:scale(1,1);
728
- --semi-transform-rotate-none:rotate(0deg);
729
- --semi-transform_rotate-clockwise90deg:rotate(90deg);
730
- --semi-transform_rotate-clockwise180deg:rotate(180deg);
731
- --semi-transform_rotate-clockwise270deg:rotate(270deg);
732
- --semi-transform_rotate-clockwise360deg:rotate(360deg);
733
- --semi-transform_rotate-anticlockwise90deg:rotate(-90deg);
734
- --semi-transform_rotate-anticlockwise180deg:rotate(-180deg);
735
- --semi-transform_rotate-anticlockwise270deg:rotate(-270deg);
736
- --semi-transform_rotate-anticlockwise360deg:rotate(-360deg);
737
- }
738
-
739
- .semi-portal {
740
- position: absolute;
741
- top: 0;
742
- left: 0;
743
- width: 100%;
744
- z-index: 1;
745
- }
746
- .semi-portal-inner {
747
- position: absolute;
748
- background-color: transparent;
749
- min-width: max-content;
750
- }
751
-
752
- .semi-button-split {
753
- display: inline-block;
754
- }
755
- .semi-button-split .semi-button {
756
- border-radius: 0;
757
- margin-right: 1px;
758
- }
759
- .semi-button-split .semi-button-first {
760
- border-top-left-radius: var(--semi-border-radius-small);
761
- border-bottom-left-radius: var(--semi-border-radius-small);
762
- }
763
- .semi-button-split .semi-button-last {
764
- border-top-right-radius: var(--semi-border-radius-small);
765
- border-bottom-right-radius: var(--semi-border-radius-small);
766
- margin-right: unset;
767
- }
768
- .semi-button-split:hover .semi-button-borderless:active {
769
- background-color: var(--semi-color-fill-1);
770
- }
771
-
772
- .semi-button {
773
- --semi-button-colorful-multiple-fill-0: rgba(var(--semi-ai-general-5-3));
774
- --semi-button-colorful-multiple-fill-1: rgba(var(--semi-ai-general-5-2));
775
- --semi-button-colorful-multiple-fill-2: rgba(var(--semi-ai-general-5-1));
776
- --semi-button-colorful-multiple-fill-3: rgba(var(--semi-ai-general-5-0));
777
- --semi-button-colorful-disabled-fill: var(--semi-color-disabled-text);
778
- --semi-button-colorful-fill-primary: var(--semi-color-ai-purple);
779
- --semi-button-colorful-fill-secondary: var(--semi-color-text-0);
780
- }
781
-
782
- .semi-button {
783
- box-shadow: none;
784
- height: 32px;
785
- display: inline-flex;
786
- align-items: center;
787
- justify-content: center;
788
- cursor: pointer;
789
- user-select: none;
790
- border: 0 transparent solid;
791
- border-radius: var(--semi-border-radius-small);
792
- padding-left: 12px;
793
- padding-right: 12px;
794
- padding-top: 6px;
795
- padding-bottom: 6px;
796
- font-family: inherit;
797
- font-size: 14px;
798
- line-height: 20px;
799
- font-weight: 600;
800
- outline: none;
801
- vertical-align: middle;
802
- white-space: nowrap;
803
- }
804
- .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 {
805
- outline: 2px solid var(--semi-color-primary-light-active);
806
- }
807
- .semi-button-content {
808
- display: flex;
809
- align-items: center;
810
- }
811
- .semi-button-danger {
812
- background-color: var(--semi-color-danger);
813
- color: rgba(var(--semi-white), 1);
814
- 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);
815
- transform: scale(var(--semi-transform_scale-none));
816
- }
817
- .semi-button-danger-disabled {
818
- background-color: var(--semi-color-disabled-bg);
819
- }
820
- .semi-button-danger-disabled.semi-button-outline {
821
- background-color: transparent;
822
- border: 1px solid var(--semi-color-border);
823
- }
824
- .semi-button-danger-disabled.semi-button-light {
825
- background-color: var(--semi-color-fill-0);
826
- }
827
- .semi-button-danger:hover {
828
- background-color: var(--semi-color-danger-hover);
829
- }
830
- .semi-button-danger:active {
831
- background-color: var(--semi-color-danger-active);
832
- }
833
- .semi-button-danger.semi-button-outline {
834
- background-color: transparent;
835
- border: 1px solid var(--semi-color-danger);
836
- }
837
- .semi-button-danger.semi-button-light, .semi-button-danger.semi-button-outline, .semi-button-danger.semi-button-borderless {
838
- color: var(--semi-color-danger);
839
- }
840
- .semi-button-danger:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
841
- outline: 2px solid var(--semi-color-danger-light-active);
842
- }
843
- .semi-button-warning {
844
- background-color: var(--semi-color-warning);
845
- color: rgba(var(--semi-white), 1);
846
- 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);
847
- transform: scale(var(--semi-transform_scale-none));
848
- }
849
- .semi-button-warning-disabled {
850
- background-color: var(--semi-color-disabled-bg);
851
- }
852
- .semi-button-warning-disabled.semi-button-outline {
853
- background-color: transparent;
854
- border: 1px solid var(--semi-color-border);
855
- }
856
- .semi-button-warning-disabled.semi-button-light {
857
- background-color: var(--semi-color-fill-0);
858
- }
859
- .semi-button-warning:hover {
860
- background-color: var(--semi-color-warning-hover);
861
- }
862
- .semi-button-warning:active {
863
- background-color: var(--semi-color-warning-active);
864
- }
865
- .semi-button-warning.semi-button-outline {
866
- background-color: transparent;
867
- border: 1px solid var(--semi-color-warning);
868
- }
869
- .semi-button-warning.semi-button-light, .semi-button-warning.semi-button-outline, .semi-button-warning.semi-button-borderless {
870
- color: var(--semi-color-warning);
871
- }
872
- .semi-button-warning:not(.semi-button-borderless):not(.semi-button-light):focus-visible {
873
- outline: 2px solid var(--semi-color-warning-light-active);
874
- }
875
- .semi-button-tertiary {
876
- background-color: var(--semi-color-tertiary);
877
- color: rgba(var(--semi-white), 1);
878
- 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);
879
- transform: scale(var(--semi-transform_scale-none));
880
- }
881
- .semi-button-tertiary.semi-button-colorful.semi-button-solid {
882
- background: var(--semi-ai-general-0);
883
- }
884
- .semi-button-tertiary.semi-button-colorful.semi-button-solid:hover {
885
- background: var(--semi-ai-general-1);
886
- }
887
- .semi-button-tertiary.semi-button-colorful.semi-button-solid:active {
888
- background: var(--semi-ai-general-2);
889
- }
890
- .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)) {
891
- background: var(--semi-color-ai-general);
892
- background-clip: text;
893
- color: transparent;
894
- }
895
- .semi-button-tertiary-disabled {
896
- background-color: var(--semi-color-disabled-bg);
897
- }
898
- .semi-button-tertiary-disabled.semi-button-outline {
899
- background-color: transparent;
900
- border: 1px solid var(--semi-color-border);
901
- }
902
- .semi-button-tertiary-disabled.semi-button-light {
903
- background-color: var(--semi-color-fill-0);
904
- }
905
- .semi-button-tertiary:hover {
906
- background-color: var(--semi-color-tertiary-hover);
907
- }
908
- .semi-button-tertiary:active {
909
- background-color: var(--semi-color-tertiary-active);
910
- }
911
- .semi-button-tertiary.semi-button-outline {
912
- background-color: transparent;
913
- border: 1px solid var(--semi-color-border);
914
- }
915
- .semi-button-tertiary.semi-button-light, .semi-button-tertiary.semi-button-outline, .semi-button-tertiary.semi-button-borderless {
916
- color: var(--semi-color-text-1);
917
- }
918
- .semi-button-primary {
919
- background-color: var(--semi-color-primary);
920
- color: rgba(var(--semi-white), 1);
921
- 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);
922
- transform: scale(var(--semi-transform_scale-none));
923
- }
924
- .semi-button-primary.semi-button-colorful.semi-button-solid {
925
- background: var(--semi-color-ai-general);
926
- }
927
- .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
928
- background: var(--semi-color-ai-general-hover);
929
- }
930
- .semi-button-primary.semi-button-colorful.semi-button-solid:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
931
- background: var(--semi-color-ai-general-active);
932
- }
933
- .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)) {
934
- background: var(--semi-color-ai-general);
935
- background-clip: text;
936
- color: transparent;
937
- }
938
- .semi-button-primary.semi-button-colorful.semi-button-outline {
939
- color: var(--semi-color-ai-purple);
940
- border-color: var(--semi-color-ai-purple);
941
- }
942
- .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)) {
943
- background: var(--semi-color-ai-general);
944
- background-clip: text;
945
- color: transparent;
946
- }
947
- .semi-button-primary-disabled {
948
- background-color: var(--semi-color-disabled-bg);
949
- }
950
- .semi-button-primary-disabled.semi-button-light {
951
- background: var(--semi-color-fill-0);
952
- }
953
- .semi-button-primary-disabled.semi-button-outline {
954
- background-color: transparent;
955
- border: 1px solid var(--semi-color-border);
956
- }
957
- .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
958
- background-color: var(--semi-color-primary-hover);
959
- }
960
- .semi-button-primary.semi-button-outline {
961
- background-color: transparent;
962
- border: 1px solid var(--semi-color-border);
963
- }
964
- .semi-button-primary:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):active {
965
- background-color: var(--semi-color-primary-active);
966
- }
967
- .semi-button-primary.semi-button-light, .semi-button-primary.semi-button-outline, .semi-button-primary.semi-button-borderless {
968
- color: var(--semi-color-primary);
969
- }
970
- .semi-button-secondary {
971
- background-color: var(--semi-color-secondary);
972
- outline-color: var(--semi-color-secondary);
973
- color: rgba(var(--semi-white), 1);
974
- 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);
975
- transform: scale(var(--semi-transform_scale-none));
976
- }
977
- .semi-button-secondary-disabled {
978
- background-color: var(--semi-color-disabled-bg);
979
- }
980
- .semi-button-secondary-disabled.semi-button-outline {
981
- background-color: transparent;
982
- border: 1px solid var(--semi-color-border);
983
- }
984
- .semi-button-secondary-disabled.semi-button-light {
985
- background-color: var(--semi-color-fill-0);
986
- }
987
- .semi-button-secondary.semi-button-outline {
988
- background-color: transparent;
989
- border: 1px solid var(--semi-color-border);
990
- }
991
- .semi-button-secondary:hover {
992
- background-color: var(--semi-color-secondary-hover);
993
- }
994
- .semi-button-secondary:active {
995
- background-color: var(--semi-color-secondary-active);
996
- }
997
- .semi-button-secondary.semi-button-light, .semi-button-secondary.semi-button-outline, .semi-button-secondary.semi-button-borderless {
998
- color: var(--semi-color-secondary);
999
- }
1000
- .semi-button-disabled {
1001
- color: var(--semi-color-disabled-text);
1002
- cursor: not-allowed;
1003
- }
1004
- .semi-button-disabled:not(.semi-button-borderless):not(.semi-button-light):not(.semi-button-outline):hover {
1005
- color: var(--semi-color-disabled-text);
1006
- }
1007
- .semi-button-disabled.semi-button-light, .semi-button-disabled.semi-button-borderless {
1008
- color: var(--semi-color-disabled-text);
1009
- }
1010
- .semi-button-disabled.semi-button-outline {
1011
- color: var(--semi-color-disabled-text);
1012
- }
1013
- .semi-button-borderless {
1014
- background-color: transparent;
1015
- border: 0 transparent solid;
1016
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
1017
- transform: scale(var(--semi-transform_scale-none));
1018
- }
1019
- .semi-button-borderless:not(.semi-button-disabled):hover {
1020
- background-color: var(--semi-color-fill-0);
1021
- border: 0 transparent solid;
1022
- }
1023
- .semi-button-borderless:not(.semi-button-disabled):active {
1024
- background-color: var(--semi-color-fill-1);
1025
- border: 0 transparent solid;
1026
- }
1027
- .semi-button-outline {
1028
- background-color: transparent;
1029
- }
1030
- .semi-button-outline:not(.semi-button-disabled):hover {
1031
- background-color: var(--semi-color-fill-0);
1032
- }
1033
- .semi-button-outline:not(.semi-button-disabled):active {
1034
- background-color: var(--semi-color-fill-1);
1035
- }
1036
- .semi-button-light {
1037
- background-color: var(--semi-color-fill-0);
1038
- border: 0 transparent solid;
1039
- 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);
1040
- transform: scale(var(--semi-transform_scale-none));
1041
- }
1042
- .semi-button-light:not(.semi-button-disabled):hover {
1043
- background-color: var(--semi-color-fill-1);
1044
- border: 0 transparent solid;
1045
- }
1046
- .semi-button-light:not(.semi-button-disabled):active {
1047
- background-color: var(--semi-color-fill-2);
1048
- border: 0 transparent solid;
1049
- }
1050
- .semi-button-size-small {
1051
- height: 24px;
1052
- padding-top: 2px;
1053
- padding-bottom: 2px;
1054
- padding-left: 12px;
1055
- padding-right: 12px;
1056
- font-size: 14px;
1057
- line-height: 20px;
1058
- font-weight: 600;
1059
- }
1060
- .semi-button-size-large {
1061
- height: 40px;
1062
- padding-top: 10px;
1063
- padding-bottom: 10px;
1064
- padding-left: 16px;
1065
- padding-right: 16px;
1066
- font-size: 14px;
1067
- line-height: 20px;
1068
- font-weight: 600;
1069
- }
1070
- .semi-button-block {
1071
- width: 100%;
1072
- }
1073
- .semi-button-group {
1074
- display: flex;
1075
- flex-wrap: wrap;
1076
- }
1077
- .semi-button-group > .semi-button {
1078
- margin: 0;
1079
- padding-left: 0;
1080
- padding-right: 0;
1081
- border-radius: 0;
1082
- }
1083
- .semi-button-group > .semi-button .semi-button-content {
1084
- padding-left: 12px;
1085
- padding-right: 12px;
1086
- }
1087
- .semi-button-group > .semi-button-size-large .semi-button-content {
1088
- padding-left: 16px;
1089
- padding-right: 16px;
1090
- }
1091
- .semi-button-group > .semi-button-size-small .semi-button-content {
1092
- padding-left: 12px;
1093
- padding-right: 12px;
1094
- }
1095
- .semi-button-group > .semi-button.semi-button-with-icon-only {
1096
- padding-left: 0;
1097
- padding-right: 0;
1098
- }
1099
- .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
1100
- padding-left: 8px;
1101
- padding-right: 8px;
1102
- }
1103
- .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
1104
- padding-left: 4px;
1105
- padding-right: 4px;
1106
- }
1107
- .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
1108
- padding-left: 12px;
1109
- padding-right: 12px;
1110
- }
1111
- .semi-button-group > .semi-button:first-child {
1112
- border-top-left-radius: var(--semi-border-radius-small);
1113
- border-bottom-left-radius: var(--semi-border-radius-small);
1114
- }
1115
- .semi-button-group > .semi-button:last-child {
1116
- border-top-right-radius: var(--semi-border-radius-small);
1117
- border-bottom-right-radius: var(--semi-border-radius-small);
1118
- }
1119
- .semi-button-group > .semi-button-outline:not(:last-child) {
1120
- border-right-color: transparent;
1121
- margin-right: -1px;
1122
- }
1123
- .semi-button-group-line {
1124
- display: inline-flex;
1125
- align-items: center;
1126
- background-color: var(--semi-color-border);
1127
- }
1128
- .semi-button-group-line-primary {
1129
- background-color: var(--semi-color-primary);
1130
- }
1131
- .semi-button-group-line-secondary {
1132
- background-color: var(--semi-color-secondary);
1133
- }
1134
- .semi-button-group-line-tertiary {
1135
- background-color: var(--semi-color-tertiary);
1136
- }
1137
- .semi-button-group-line-warning {
1138
- background-color: var(--semi-color-warning);
1139
- }
1140
- .semi-button-group-line-danger {
1141
- background-color: var(--semi-color-danger);
1142
- }
1143
- .semi-button-group-line-disabled {
1144
- background-color: var(--semi-color-disabled-bg);
1145
- }
1146
- .semi-button-group-line-light {
1147
- background-color: var(--semi-color-fill-0);
1148
- }
1149
- .semi-button-group-line-borderless {
1150
- background-color: transparent;
1151
- }
1152
- .semi-button-group-line::before {
1153
- display: block;
1154
- content: "";
1155
- width: 1px;
1156
- height: 20px;
1157
- background-color: var(--semi-color-border);
1158
- }
1159
-
1160
- .semi-rtl .semi-button,
1161
- .semi-portal-rtl .semi-button {
1162
- direction: rtl;
1163
- padding-left: 12px;
1164
- padding-right: 12px;
1165
- }
1166
- .semi-rtl .semi-button-size-small,
1167
- .semi-portal-rtl .semi-button-size-small {
1168
- padding-left: 12px;
1169
- padding-right: 12px;
1170
- }
1171
- .semi-rtl .semi-button-size-large,
1172
- .semi-portal-rtl .semi-button-size-large {
1173
- padding-left: 16px;
1174
- padding-right: 16px;
1175
- }
1176
- .semi-rtl .semi-button-group,
1177
- .semi-portal-rtl .semi-button-group {
1178
- direction: rtl;
1179
- }
1180
- .semi-rtl .semi-button-group > .semi-button,
1181
- .semi-portal-rtl .semi-button-group > .semi-button {
1182
- padding-left: 0;
1183
- padding-right: 0;
1184
- }
1185
- .semi-rtl .semi-button-group > .semi-button .semi-button-content,
1186
- .semi-portal-rtl .semi-button-group > .semi-button .semi-button-content {
1187
- padding-left: 12px;
1188
- padding-right: 12px;
1189
- }
1190
- .semi-rtl .semi-button-group > .semi-button-size-large .semi-button-content,
1191
- .semi-portal-rtl .semi-button-group > .semi-button-size-large .semi-button-content {
1192
- padding-left: 16px;
1193
- padding-right: 16px;
1194
- }
1195
- .semi-rtl .semi-button-group > .semi-button-size-small .semi-button-content,
1196
- .semi-portal-rtl .semi-button-group > .semi-button-size-small .semi-button-content {
1197
- padding-left: 12px;
1198
- padding-right: 12px;
1199
- }
1200
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only,
1201
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only {
1202
- padding-left: 0;
1203
- padding-right: 0;
1204
- }
1205
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content,
1206
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
1207
- padding-left: 8px;
1208
- padding-right: 8px;
1209
- }
1210
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
1211
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
1212
- padding-left: 4px;
1213
- padding-right: 4px;
1214
- }
1215
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
1216
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
1217
- padding-left: 12px;
1218
- padding-right: 12px;
1219
- }
1220
- .semi-rtl .semi-button-group > .semi-button:first-child,
1221
- .semi-portal-rtl .semi-button-group > .semi-button:first-child {
1222
- border-top-left-radius: 0;
1223
- border-bottom-left-radius: 0;
1224
- border-top-right-radius: var(--semi-border-radius-small);
1225
- border-bottom-right-radius: var(--semi-border-radius-small);
1226
- }
1227
- .semi-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content,
1228
- .semi-portal-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content {
1229
- border-left: 1px var(--semi-color-border) solid;
1230
- border-right: 0;
1231
- }
1232
- .semi-rtl .semi-button-group > .semi-button:last-child,
1233
- .semi-portal-rtl .semi-button-group > .semi-button:last-child {
1234
- border-top-right-radius: 0;
1235
- border-bottom-right-radius: 0;
1236
- border-top-left-radius: var(--semi-border-radius-small);
1237
- border-bottom-left-radius: var(--semi-border-radius-small);
1238
- }
1239
- .semi-rtl .semi-button.semi-button-with-icon-only,
1240
- .semi-portal-rtl .semi-button.semi-button-with-icon-only {
1241
- padding-left: 8px;
1242
- padding-right: 8px;
1243
- }
1244
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
1245
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
1246
- padding-left: 4px;
1247
- padding-right: 4px;
1248
- }
1249
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
1250
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
1251
- padding-left: 12px;
1252
- padding-right: 12px;
1253
- }
1254
- .semi-rtl .semi-button-content-left,
1255
- .semi-portal-rtl .semi-button-content-left {
1256
- margin-left: 8px;
1257
- margin-right: 0;
1258
- }
1259
- .semi-rtl .semi-button-content-right,
1260
- .semi-portal-rtl .semi-button-content-right {
1261
- margin-right: 8px;
1262
- margin-left: 0;
1263
- }
1264
-
1265
- .semi-checkbox {
1266
- box-sizing: border-box;
1267
- position: relative;
1268
- display: flex;
1269
- align-items: flex-start;
1270
- font-size: 14px;
1271
- line-height: 20px;
1272
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1273
- cursor: pointer;
1274
- 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);
1275
- transform: scale(var(--semi-transform_scale-none));
1276
- column-gap: 8px;
1277
- }
1278
- .semi-checkbox input[type=checkbox] {
1279
- position: absolute;
1280
- left: 0;
1281
- top: 0;
1282
- width: 100%;
1283
- height: 100%;
1284
- margin: 0;
1285
- opacity: 0;
1286
- }
1287
- .semi-checkbox-content {
1288
- flex: 1;
1289
- display: flex;
1290
- flex-direction: column;
1291
- row-gap: 4px;
1292
- }
1293
- .semi-checkbox-addon {
1294
- display: flex;
1295
- flex: 1;
1296
- align-items: center;
1297
- color: var(--semi-color-text-0);
1298
- line-height: 20px;
1299
- user-select: none;
1300
- }
1301
- .semi-checkbox:hover .semi-checkbox-inner-display {
1302
- background: var(--semi-color-fill-0);
1303
- box-shadow: inset 0 0 0 1px var(--semi-color-focus-border);
1304
- }
1305
- .semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1306
- background: var(--semi-color-primary-hover);
1307
- box-shadow: none;
1308
- }
1309
- .semi-checkbox:active .semi-checkbox-inner-display {
1310
- background: var(--semi-color-fill-1);
1311
- }
1312
- .semi-checkbox:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1313
- background: var(--semi-color-primary-active);
1314
- box-shadow: none;
1315
- }
1316
- .semi-checkbox.semi-checkbox-disabled:hover .semi-checkbox-inner-display, .semi-checkbox.semi-checkbox-disabled:active .semi-checkbox-inner-display {
1317
- background: var(--semi-color-disabled-fill);
1318
- box-shadow: inset 0 0 0 1px var(--semi-color-border);
1319
- }
1320
- .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 {
1321
- color: var(--semi-color-white);
1322
- background: var(--semi-color-primary-disabled);
1323
- box-shadow: none;
1324
- }
1325
- .semi-checkbox-inner {
1326
- position: relative;
1327
- display: flex;
1328
- align-items: center;
1329
- width: 16px;
1330
- height: 20px;
1331
- user-select: none;
1332
- cursor: pointer;
1333
- }
1334
- .semi-checkbox-inner-display {
1335
- box-sizing: border-box;
1336
- position: relative;
1337
- width: 16px;
1338
- height: 16px;
1339
- margin: 0;
1340
- background: transparent;
1341
- 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);
1342
- box-shadow: inset 0 0 0 1px var(--semi-color-text-3);
1343
- border-radius: var(--semi-border-radius-extra-small);
1344
- }
1345
- .semi-checkbox-inner-display .semi-icon {
1346
- font-size: 16px;
1347
- }
1348
- .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1349
- background: var(--semi-color-primary);
1350
- color: var(--semi-color-white);
1351
- box-shadow: inset 0 0 0 1px var(--semi-color-primary);
1352
- border-radius: var(--semi-border-radius-extra-small);
1353
- }
1354
- .semi-checkbox-inner-checked > .semi-checkbox-addon {
1355
- color: var(--semi-color-text-0);
1356
- }
1357
- .semi-checkbox:hover .semi-checkbox-inner-display {
1358
- background: var(--semi-color-fill-0);
1359
- }
1360
- .semi-checkbox:hover.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1361
- background: var(--semi-color-primary-hover);
1362
- box-shadow: none;
1363
- color: var(--semi-color-white);
1364
- }
1365
- .semi-checkbox:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1366
- background: var(--semi-color-primary-hover);
1367
- border-color: var(--semi-color-primary-hover);
1368
- color: var(--semi-color-white);
1369
- }
1370
- .semi-checkbox:hover.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
1371
- background: var(--semi-color-white);
1372
- }
1373
- .semi-checkbox:active .semi-checkbox-inner-display {
1374
- background: var(--semi-color-fill-1);
1375
- }
1376
- .semi-checkbox:active.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1377
- background: var(--semi-color-primary-active);
1378
- border-color: var(--semi-color-primary-active);
1379
- color: var(--semi-color-white);
1380
- box-shadow: none;
1381
- }
1382
- .semi-checkbox:active .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1383
- background: var(--semi-color-primary-active);
1384
- border-color: var(--semi-color-primary-active);
1385
- color: var(--semi-color-white);
1386
- }
1387
- .semi-checkbox:active.semi-checkbox-cardType.semi-checkbox-unChecked.semi-checkbox-cardType_enable .semi-checkbox-inner-display {
1388
- background: var(--semi-color-white);
1389
- }
1390
- .semi-checkbox-cardType {
1391
- flex-wrap: nowrap;
1392
- align-items: flex-start;
1393
- border-radius: 3px;
1394
- padding: 12px 16px;
1395
- background: transparent;
1396
- border: 1px solid transparent;
1397
- }
1398
- .semi-checkbox-cardType .semi-checkbox-inner {
1399
- position: relative;
1400
- flex-shrink: 0;
1401
- }
1402
- .semi-checkbox-cardType .semi-checkbox-inner-display {
1403
- background: var(--semi-color-white);
1404
- }
1405
- .semi-checkbox-cardType .semi-checkbox-inner-pureCardType {
1406
- opacity: 0;
1407
- width: 0;
1408
- }
1409
- .semi-checkbox-cardType .semi-checkbox-addon {
1410
- font-weight: 600;
1411
- font-size: 14px;
1412
- line-height: 20px;
1413
- color: var(--semi-color-text-0);
1414
- }
1415
- .semi-checkbox-cardType .semi-checkbox-extra {
1416
- font-weight: normal;
1417
- font-size: 14px;
1418
- line-height: 20px;
1419
- color: var(--semi-color-text-2);
1420
- }
1421
- .semi-checkbox-cardType .semi-checkbox-extra.semi-checkbox-cardType_extra_noChildren {
1422
- margin-top: 0;
1423
- }
1424
- .semi-checkbox-cardType:hover {
1425
- background: var(--semi-color-fill-0);
1426
- }
1427
- .semi-checkbox-cardType:active {
1428
- background: var(--semi-color-fill-1);
1429
- }
1430
- .semi-checkbox-cardType_checked {
1431
- background: var(--semi-color-primary-light-default);
1432
- border: 1px solid var(--semi-color-primary);
1433
- }
1434
- .semi-checkbox-cardType_checked:hover {
1435
- background: var(--semi-color-primary-light-default);
1436
- border-color: var(--semi-color-primary-hover);
1437
- }
1438
- .semi-checkbox-cardType_checked:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1439
- box-shadow: none;
1440
- }
1441
- .semi-checkbox-cardType_checked:active {
1442
- background: var(--semi-color-primary-light-default);
1443
- border-color: var(--semi-color-primary-active);
1444
- }
1445
- .semi-checkbox-cardType_disabled:active {
1446
- background: transparent;
1447
- }
1448
- .semi-checkbox-cardType_disabled:hover {
1449
- background: transparent;
1450
- }
1451
- .semi-checkbox-cardType_checked_disabled.semi-checkbox-cardType {
1452
- background: var(--semi-color-primary-light-default);
1453
- border: 1px solid var(--semi-color-primary-disabled);
1454
- }
1455
- .semi-checkbox-cardType_checked_disabled.semi-checkbox-cardType:hover .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1456
- box-shadow: none;
1457
- }
1458
- .semi-checkbox-indeterminate .semi-checkbox-inner-display, .semi-checkbox-checked .semi-checkbox-inner-display {
1459
- background: var(--semi-color-primary);
1460
- color: var(--semi-color-white);
1461
- box-shadow: inset 0 0 0 1px var(--semi-color-primary);
1462
- border-radius: var(--semi-border-radius-extra-small);
1463
- }
1464
- .semi-checkbox-indeterminate .semi-checkbox-inner-display:hover, .semi-checkbox-checked .semi-checkbox-inner-display:hover {
1465
- background: var(--semi-color-primary-hover);
1466
- border-color: var(--semi-color-primary-hover);
1467
- color: var(--semi-color-white);
1468
- }
1469
- .semi-checkbox-indeterminate .semi-checkbox-inner-display:active, .semi-checkbox-checked .semi-checkbox-inner-display:active {
1470
- background: var(--semi-color-primary-active);
1471
- border-color: var(--semi-color-primary-active);
1472
- color: var(--semi-color-white);
1473
- }
1474
- .semi-checkbox-indeterminate .semi-checkbox-inner-addon, .semi-checkbox-checked .semi-checkbox-inner-addon {
1475
- color: var(--semi-color-text-0);
1476
- }
1477
- .semi-checkbox-disabled {
1478
- cursor: not-allowed;
1479
- }
1480
- .semi-checkbox-disabled .semi-checkbox-inner {
1481
- cursor: not-allowed;
1482
- }
1483
- .semi-checkbox-disabled .semi-checkbox-inner-display {
1484
- color: var(--semi-color-white);
1485
- background: var(--semi-color-disabled-fill);
1486
- box-shadow: inset 0 0 0 1px var(--semi-color-border);
1487
- }
1488
- .semi-checkbox-disabled .semi-checkbox-inner-display:hover {
1489
- color: var(--semi-color-white);
1490
- background: transparent;
1491
- }
1492
- .semi-checkbox-disabled .semi-checkbox-inner-checked {
1493
- color: var(--semi-color-white);
1494
- }
1495
- .semi-checkbox-disabled .semi-checkbox-inner-checked .semi-checkbox-inner-display {
1496
- opacity: 0.75;
1497
- background: var(--semi-color-primary-disabled);
1498
- box-shadow: inset 0 0 0 1px var(--semi-color-primary-disabled);
1499
- }
1500
- .semi-checkbox-disabled .semi-checkbox-inner-checked .semi-checkbox-inner-display:hover {
1501
- color: var(--semi-color-white);
1502
- background: var(--semi-color-primary-disabled);
1503
- }
1504
- .semi-checkbox-disabled .semi-checkbox-addon {
1505
- color: var(--semi-color-disabled-text);
1506
- }
1507
- .semi-checkbox-disabled .semi-checkbox-extra {
1508
- color: var(--semi-color-disabled-text);
1509
- }
1510
- .semi-checkbox.semi-checkbox-disabled.semi-checkbox-indeterminate .semi-checkbox-inner-display {
1511
- opacity: 0.75;
1512
- background: var(--semi-color-primary-disabled);
1513
- box-shadow: inset 0 0 0 1px var(--semi-color-primary-disabled);
1514
- color: var(--semi-color-white);
1515
- }
1516
- .semi-checkbox-extra {
1517
- flex-shrink: 0;
1518
- flex-grow: 1;
1519
- flex-basis: 100%;
1520
- box-sizing: border-box;
1521
- color: var(--semi-color-text-2);
1522
- }
1523
- .semi-checkbox-focus {
1524
- outline: 2px solid var(--semi-color-primary-light-active);
1525
- }
1526
- .semi-checkbox-focus-border {
1527
- box-shadow: inset 0 0 0 1px var(--semi-color-focus-border);
1528
- }
1529
-
1530
- .semi-checkboxGroup {
1531
- font-size: 14px;
1532
- line-height: 20px;
1533
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1534
- line-height: 14px;
1535
- }
1536
- .semi-checkboxGroup .semi-checkbox.semi-checkbox-vertical {
1537
- margin-bottom: 16px;
1538
- }
1539
- .semi-checkboxGroup-horizontal {
1540
- display: flex;
1541
- flex-wrap: wrap;
1542
- gap: 16px;
1543
- }
1544
- .semi-checkboxGroup-horizontal .semi-checkbox {
1545
- display: inline-flex;
1546
- }
1547
- .semi-checkboxGroup-vertical {
1548
- display: flex;
1549
- flex-direction: column;
1550
- row-gap: 12px;
1551
- }
1552
- .semi-checkboxGroup-vertical-cardType {
1553
- row-gap: 16px;
1554
- }
1555
- .semi-checkboxGroup-vertical-pureCardType .semi-checkbox {
1556
- column-gap: 0;
1557
- }
1558
-
1559
- .semi-rtl .semi-checkbox,
1560
- .semi-portal-rtl .semi-checkbox {
1561
- direction: rtl;
1562
- }
1563
- .semi-rtl .semi-checkbox input[type=checkbox],
1564
- .semi-portal-rtl .semi-checkbox input[type=checkbox] {
1565
- left: auto;
1566
- right: 0;
1567
- }
1568
- .semi-rtl .semi-checkboxGroup,
1569
- .semi-portal-rtl .semi-checkboxGroup {
1570
- direction: rtl;
1571
- }
1572
-
1573
- .semi-dropdown {
1574
- font-size: 14px;
1575
- line-height: 20px;
1576
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1577
- }
1578
- .semi-dropdown-wrapper {
1579
- overflow-y: auto;
1580
- box-shadow: var(--semi-shadow-elevated);
1581
- position: relative;
1582
- z-index: 1050;
1583
- border-radius: var(--semi-border-radius-medium);
1584
- background: var(--semi-color-bg-3);
1585
- backdrop-filter: none;
1586
- opacity: 0;
1587
- }
1588
- .semi-dropdown-wrapper-show {
1589
- opacity: 1;
1590
- }
1591
- .semi-dropdown-trigger {
1592
- display: inline-block;
1593
- }
1594
- .semi-dropdown-menu {
1595
- list-style: none;
1596
- padding: 4px 0;
1597
- margin: 0;
1598
- }
1599
- .semi-dropdown-title {
1600
- color: var(--semi-color-text-2);
1601
- padding-top: 8px;
1602
- padding-bottom: 4px;
1603
- padding-left: 16px;
1604
- padding-right: 16px;
1605
- font-size: 12px;
1606
- line-height: 16px;
1607
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1608
- cursor: default;
1609
- }
1610
- .semi-dropdown-title-withTick {
1611
- padding-left: 31px;
1612
- }
1613
- .semi-dropdown-item {
1614
- padding: 8px 16px;
1615
- color: var(--semi-color-text-0);
1616
- max-width: 280px;
1617
- display: flex;
1618
- align-items: center;
1619
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeOut) 0ms;
1620
- border-radius: 0px;
1621
- }
1622
- .semi-dropdown-item-hover {
1623
- background-color: var(--semi-color-fill-0);
1624
- }
1625
- .semi-dropdown-item:not(.semi-dropdown-item-active):hover {
1626
- background-color: var(--semi-color-fill-0);
1627
- cursor: pointer;
1628
- }
1629
- .semi-dropdown-item:not(.semi-dropdown-item-active):active {
1630
- background-color: var(--semi-color-fill-1);
1631
- }
1632
- .semi-dropdown-item:focus-visible {
1633
- background-color: var(--semi-color-fill-0);
1634
- outline: 0;
1635
- }
1636
- .semi-dropdown-item-icon {
1637
- display: inline-flex;
1638
- align-items: center;
1639
- margin-right: 8px;
1640
- }
1641
- .semi-dropdown-item-danger {
1642
- color: var(--semi-color-danger);
1643
- }
1644
- .semi-dropdown-item-secondary {
1645
- color: var(--semi-color-secondary);
1646
- }
1647
- .semi-dropdown-item-warning {
1648
- color: var(--semi-color-warning);
1649
- }
1650
- .semi-dropdown-item-tertiary {
1651
- color: var(--semi-color-tertiary);
1652
- }
1653
- .semi-dropdown-item-primary {
1654
- color: var(--semi-color-primary);
1655
- }
1656
- .semi-dropdown-item-withTick {
1657
- padding-left: 12px;
1658
- }
1659
- .semi-dropdown-item > .semi-icon {
1660
- flex-shrink: 0;
1661
- margin-right: 9px;
1662
- font-size: 12px;
1663
- }
1664
- .semi-dropdown-item-active {
1665
- font-weight: 600;
1666
- }
1667
- .semi-dropdown-item.semi-dropdown-item-disabled {
1668
- color: var(--semi-color-disabled-text);
1669
- cursor: not-allowed;
1670
- }
1671
- .semi-dropdown-item.semi-dropdown-item-disabled:hover, .semi-dropdown-item.semi-dropdown-item-disabled:active {
1672
- cursor: not-allowed;
1673
- background-color: transparent;
1674
- }
1675
- .semi-dropdown-divider {
1676
- display: block;
1677
- height: 1px;
1678
- width: 100%;
1679
- min-width: 100%;
1680
- clear: both;
1681
- background: var(--semi-color-border);
1682
- margin: 4px 0;
1683
- }
1684
-
1685
- .semi-rtl .semi-dropdown-wrapper,
1686
- .semi-portal-rtl .semi-dropdown-wrapper {
1687
- direction: rtl;
1688
- }
1689
- .semi-rtl .semi-dropdown-title-withTick,
1690
- .semi-portal-rtl .semi-dropdown-title-withTick {
1691
- padding-left: 0;
1692
- padding-right: 31px;
1693
- }
1694
- .semi-rtl .semi-dropdown-item-withTick,
1695
- .semi-portal-rtl .semi-dropdown-item-withTick {
1696
- padding-left: auto;
1697
- padding-right: 12px;
1698
- }
1699
- .semi-rtl .semi-dropdown-item > .semi-icon,
1700
- .semi-portal-rtl .semi-dropdown-item > .semi-icon {
1701
- margin-right: 0;
1702
- margin-left: 9px;
1703
- }
1704
-
1705
- @keyframes semi-input-active {
1706
- from {
1707
- transform: scale(1);
1708
- }
1709
- to {
1710
- transform: scale(0.97);
1711
- }
1712
- }
1713
- @keyframes semi-input-inactive {
1714
- from {
1715
- transform: scale(0.97);
1716
- }
1717
- to {
1718
- transform: scale(1);
1719
- }
1720
- }
1721
- .semi-input {
1722
- 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);
1723
- transform: scale(var(--semi-transform_scale-none));
1724
- }
1725
-
1726
- .semi-input-wrapper {
1727
- display: inline-block;
1728
- position: relative;
1729
- vertical-align: middle;
1730
- box-shadow: none;
1731
- font-size: 14px;
1732
- line-height: 20px;
1733
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1734
- background-color: var(--semi-color-fill-0);
1735
- border: 1px transparent solid;
1736
- border-radius: var(--semi-border-radius-small);
1737
- width: 100%;
1738
- outline: none;
1739
- cursor: text;
1740
- box-sizing: border-box;
1741
- color: var(--semi-color-text-0);
1742
- 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);
1743
- transform: scale(var(--semi-transform_scale-none));
1744
- }
1745
- .semi-input-wrapper-default {
1746
- height: 32px;
1747
- font-size: 14px;
1748
- line-height: 20px;
1749
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1750
- line-height: 30px;
1751
- }
1752
- .semi-input-wrapper-small {
1753
- height: 24px;
1754
- font-size: 14px;
1755
- line-height: 20px;
1756
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1757
- line-height: 22px;
1758
- }
1759
- .semi-input-wrapper-large {
1760
- height: 40px;
1761
- font-size: 16px;
1762
- line-height: 22px;
1763
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
1764
- line-height: 38px;
1765
- }
1766
- .semi-input-wrapper:hover {
1767
- background-color: var(--semi-color-fill-1);
1768
- border-color: transparent;
1769
- }
1770
- .semi-input-wrapper-focus {
1771
- background-color: var(--semi-color-fill-0);
1772
- border: var(--semi-color-focus-border) solid 1px;
1773
- }
1774
- .semi-input-wrapper-focus:hover {
1775
- background-color: var(--semi-color-fill-0);
1776
- border-color: var(--semi-color-focus-border);
1777
- }
1778
- .semi-input-wrapper-focus:active {
1779
- background-color: var(--semi-color-fill-2);
1780
- border-color: var(--semi-color-focus-border);
1781
- }
1782
- .semi-input-wrapper.semi-input-readonly {
1783
- cursor: default;
1784
- }
1785
- .semi-input-wrapper-error {
1786
- background-color: var(--semi-color-danger-light-default);
1787
- border-color: var(--semi-color-danger-light-default);
1788
- }
1789
- .semi-input-wrapper-error:hover {
1790
- background-color: var(--semi-color-danger-light-hover);
1791
- border-color: var(--semi-color-danger-light-hover);
1792
- }
1793
- .semi-input-wrapper-error.semi-input-wrapper-focus {
1794
- background-color: var(--semi-color-danger-light-default);
1795
- border-color: var(--semi-color-danger);
1796
- }
1797
- .semi-input-wrapper-error:active {
1798
- background-color: var(--semi-color-danger-light-active);
1799
- border-color: var(--semi-color-danger);
1800
- }
1801
- .semi-input-wrapper-warning {
1802
- background-color: var(--semi-color-warning-light-default);
1803
- border-color: var(--semi-color-warning-light-default);
1804
- }
1805
- .semi-input-wrapper-warning:hover {
1806
- background-color: var(--semi-color-warning-light-hover);
1807
- border-color: var(--semi-color-warning-light-hover);
1808
- }
1809
- .semi-input-wrapper-warning.semi-input-wrapper-focus {
1810
- background-color: var(--semi-color-warning-light-default);
1811
- border-color: var(--semi-color-warning);
1812
- }
1813
- .semi-input-wrapper-warning:active {
1814
- background-color: var(--semi-color-warning-light-active);
1815
- border-color: var(--semi-color-warning);
1816
- }
1817
- .semi-input-wrapper__with-prefix {
1818
- display: inline-flex;
1819
- align-items: center;
1820
- }
1821
- .semi-input-wrapper__with-prefix .semi-input {
1822
- padding-left: 0;
1823
- }
1824
- .semi-input-wrapper__with-suffix {
1825
- display: inline-flex;
1826
- align-items: center;
1827
- }
1828
- .semi-input-wrapper__with-suffix .semi-input {
1829
- padding-right: 0;
1830
- }
1831
- .semi-input-wrapper-clearable, .semi-input-wrapper-modebtn {
1832
- display: inline-flex;
1833
- align-items: center;
1834
- }
1835
- .semi-input-wrapper-hidden {
1836
- border: none;
1837
- }
1838
- .semi-input-wrapper .semi-icon {
1839
- color: var(--semi-color-text-2);
1840
- }
1841
- .semi-input-wrapper .semi-input-clearbtn,
1842
- .semi-input-wrapper .semi-input-modebtn {
1843
- color: var(--semi-color-primary-hover);
1844
- }
1845
- .semi-input-wrapper .semi-input-clearbtn > svg,
1846
- .semi-input-wrapper .semi-input-modebtn > svg {
1847
- pointer-events: none;
1848
- }
1849
- .semi-input-wrapper .semi-input-clearbtn:hover,
1850
- .semi-input-wrapper .semi-input-modebtn:hover {
1851
- cursor: pointer;
1852
- }
1853
- .semi-input-wrapper .semi-input-clearbtn:hover .semi-icon,
1854
- .semi-input-wrapper .semi-input-modebtn:hover .semi-icon {
1855
- color: var(--semi-color-primary-hover);
1856
- }
1857
- .semi-input-wrapper .semi-input-clearbtn:focus-visible,
1858
- .semi-input-wrapper .semi-input-modebtn:focus-visible {
1859
- border-radius: var(--semi-border-radius-small);
1860
- outline: 2px solid var(--semi-color-primary-light-active);
1861
- outline-offset: -1px;
1862
- }
1863
- .semi-input-wrapper__with-suffix-icon.semi-input-wrapper-clearable:not(.semi-input-wrapper__with-suffix-hidden) .semi-input-clearbtn {
1864
- min-width: 24px;
1865
- justify-content: flex-end;
1866
- }
1867
- .semi-input-wrapper-modebtn.semi-input-wrapper-clearable .semi-input-clearbtn {
1868
- min-width: 16px;
1869
- justify-content: center;
1870
- }
1871
- .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input {
1872
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1873
- }
1874
- .semi-input-wrapper.semi-input-wrapper__with-append-only .semi-input:not(:last-child) {
1875
- border-right-style: none;
1876
- border-radius: 0;
1877
- }
1878
- .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input {
1879
- border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
1880
- }
1881
- .semi-input-wrapper.semi-input-wrapper__with-prepend-only .semi-input:not(:last-child) {
1882
- border-right-style: none;
1883
- }
1884
- .semi-input-wrapper.semi-input-wrapper__with-prepend, .semi-input-wrapper.semi-input-wrapper__with-append {
1885
- display: inline-flex;
1886
- align-items: center;
1887
- background-color: transparent;
1888
- }
1889
- .semi-input-wrapper.semi-input-wrapper__with-prepend:hover, .semi-input-wrapper.semi-input-wrapper__with-append:hover {
1890
- background-color: transparent;
1891
- }
1892
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-focus {
1893
- border: 1px transparent solid;
1894
- background-color: transparent;
1895
- }
1896
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input {
1897
- background-color: var(--semi-color-fill-0);
1898
- border: 1px transparent solid;
1899
- }
1900
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover {
1901
- background-color: var(--semi-color-fill-1);
1902
- }
1903
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:hover ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:hover ~ .semi-input-modebtn {
1904
- background-color: var(--semi-color-fill-1);
1905
- }
1906
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus {
1907
- border: 1px var(--semi-color-focus-border) solid;
1908
- background-color: var(--semi-color-fill-0);
1909
- }
1910
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn {
1911
- border-right-style: none;
1912
- }
1913
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus.semi-input-sibling-modebtn + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus.semi-input-sibling-modebtn + .semi-input-clearbtn {
1914
- border-right-style: none;
1915
- }
1916
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn {
1917
- box-sizing: border-box;
1918
- background-color: var(--semi-color-fill-0);
1919
- }
1920
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn {
1921
- border: 1px var(--semi-color-focus-border) solid;
1922
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1923
- border-left-style: none;
1924
- }
1925
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus + .semi-input-clearbtn:not(:last-child), .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus + .semi-input-clearbtn:not(:last-child) {
1926
- border-radius: 0;
1927
- }
1928
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn {
1929
- border: 1px var(--semi-color-focus-border) solid;
1930
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1931
- border-left-style: none;
1932
- }
1933
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:focus ~ .semi-input-modebtn:not(:last-child), .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:focus ~ .semi-input-modebtn:not(:last-child) {
1934
- border-radius: 0;
1935
- }
1936
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active {
1937
- background-color: var(--semi-color-fill-2);
1938
- }
1939
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input:active ~ .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input:active ~ .semi-input-modebtn {
1940
- background-color: var(--semi-color-fill-2);
1941
- }
1942
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover {
1943
- background-color: var(--semi-color-fill-0);
1944
- }
1945
- .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append .semi-input-modebtn:hover:last-child {
1946
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1947
- }
1948
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error {
1949
- border-color: transparent;
1950
- }
1951
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input {
1952
- background-color: var(--semi-color-danger-light-default);
1953
- border-color: var(--semi-color-danger-light-default);
1954
- }
1955
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover {
1956
- background-color: var(--semi-color-danger-light-hover);
1957
- border-color: var(--semi-color-danger-light-hover);
1958
- }
1959
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:hover + .semi-input-modebtn {
1960
- background-color: var(--semi-color-danger-light-hover);
1961
- }
1962
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus {
1963
- background-color: var(--semi-color-danger-light-default);
1964
- border-color: var(--semi-color-danger);
1965
- }
1966
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:focus + .semi-input-modebtn {
1967
- background-color: var(--semi-color-danger-light-default);
1968
- border-color: var(--semi-color-danger);
1969
- }
1970
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active {
1971
- background-color: var(--semi-color-danger-light-active);
1972
- }
1973
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input:active + .semi-input-modebtn {
1974
- background-color: var(--semi-color-danger-light-active);
1975
- border-color: var(--semi-color-danger);
1976
- }
1977
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover {
1978
- background-color: var(--semi-color-danger-light-default);
1979
- }
1980
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-error .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-error .semi-input-modebtn:hover:last-child {
1981
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
1982
- }
1983
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning {
1984
- border-color: transparent;
1985
- }
1986
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input {
1987
- background-color: var(--semi-color-warning-light-default);
1988
- border-color: var(--semi-color-warning-light-default);
1989
- }
1990
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover {
1991
- background-color: var(--semi-color-warning-light-hover);
1992
- border-color: var(--semi-color-warning-light-hover);
1993
- }
1994
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:hover + .semi-input-modebtn {
1995
- background-color: var(--semi-color-warning-light-hover);
1996
- }
1997
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus {
1998
- background-color: var(--semi-color-warning-light-default);
1999
- border-color: var(--semi-color-warning);
2000
- }
2001
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:focus + .semi-input-modebtn {
2002
- background-color: var(--semi-color-warning-light-default);
2003
- border-color: var(--semi-color-warning);
2004
- }
2005
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active {
2006
- background-color: var(--semi-color-warning-light-active);
2007
- }
2008
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input:active + .semi-input-modebtn {
2009
- background-color: var(--semi-color-warning-light-active);
2010
- border-color: var(--semi-color-warning);
2011
- }
2012
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover {
2013
- background-color: var(--semi-color-warning-light-default);
2014
- }
2015
- .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-prepend.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-clearbtn:hover:last-child, .semi-input-wrapper.semi-input-wrapper__with-append.semi-input-wrapper-warning .semi-input-modebtn:hover:last-child {
2016
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
2017
- }
2018
- .semi-input-wrapper-disabled {
2019
- cursor: not-allowed;
2020
- color: var(--semi-color-disabled-text);
2021
- background-color: var(--semi-color-disabled-fill);
2022
- -webkit-text-fill-color: var(--semi-color-disabled-text);
2023
- }
2024
- .semi-input-wrapper-disabled:hover {
2025
- background-color: var(--semi-color-disabled-fill);
2026
- }
2027
- .semi-input-wrapper-disabled .semi-input-append,
2028
- .semi-input-wrapper-disabled .semi-input-prepend,
2029
- .semi-input-wrapper-disabled .semi-input-suffix,
2030
- .semi-input-wrapper-disabled .semi-input-prefix,
2031
- .semi-input-wrapper-disabled .semi-icon {
2032
- color: var(--semi-color-disabled-text);
2033
- }
2034
-
2035
- .semi-input {
2036
- border: none;
2037
- outline: none;
2038
- width: 100%;
2039
- color: inherit;
2040
- padding-left: 12px;
2041
- padding-right: 12px;
2042
- background-color: transparent;
2043
- box-sizing: border-box;
2044
- }
2045
- .semi-input:placeholder-shown {
2046
- text-overflow: ellipsis;
2047
- }
2048
- .semi-input[type=password]::-ms-reveal, .semi-input[type=password]::-ms-clear {
2049
- display: none;
2050
- }
2051
- .semi-input[type=search]::-webkit-search-cancel-button {
2052
- display: none;
2053
- }
2054
- .semi-input::placeholder {
2055
- color: var(--semi-color-text-2);
2056
- }
2057
- .semi-input-large {
2058
- height: 38px;
2059
- font-size: 16px;
2060
- line-height: 22px;
2061
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2062
- line-height: 38px;
2063
- }
2064
- .semi-input-small {
2065
- height: 22px;
2066
- font-size: 14px;
2067
- line-height: 20px;
2068
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2069
- line-height: 22px;
2070
- }
2071
- .semi-input-default {
2072
- height: 30px;
2073
- font-size: 14px;
2074
- line-height: 20px;
2075
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2076
- line-height: 30px;
2077
- }
2078
- .semi-input-disabled {
2079
- cursor: not-allowed;
2080
- color: inherit;
2081
- }
2082
- .semi-input-inset-label {
2083
- margin: 0 12px;
2084
- font-weight: 600;
2085
- color: var(--semi-color-text-2);
2086
- flex-shrink: 0;
2087
- white-space: nowrap;
2088
- }
2089
- .semi-input-prefix, .semi-input-suffix {
2090
- display: flex;
2091
- justify-content: center;
2092
- align-items: center;
2093
- }
2094
- .semi-input-prefix-text, .semi-input-suffix-text {
2095
- margin: 0 12px;
2096
- color: var(--semi-color-text-2);
2097
- font-weight: 600;
2098
- white-space: nowrap;
2099
- }
2100
- .semi-input-prefix-icon, .semi-input-suffix-icon {
2101
- color: var(--semi-color-text-2);
2102
- margin: 0 8px;
2103
- }
2104
- .semi-input-suffix {
2105
- display: flex;
2106
- justify-content: center;
2107
- align-items: center;
2108
- }
2109
- .semi-input-clearbtn, .semi-input-modebtn {
2110
- display: flex;
2111
- align-items: center;
2112
- height: 100%;
2113
- justify-content: center;
2114
- min-width: 32px;
2115
- }
2116
- .semi-input-clearbtn + .semi-input-suffix + .semi-input-suffix-text {
2117
- margin-left: 0;
2118
- }
2119
- .semi-input-clearbtn + .semi-input-suffix + .semi-input-suffix-icon {
2120
- margin-left: 0;
2121
- }
2122
- .semi-input-suffix-hidden {
2123
- display: none;
2124
- }
2125
- .semi-input-prepend, .semi-input-append {
2126
- height: 100%;
2127
- display: flex;
2128
- align-items: center;
2129
- background-color: var(--semi-color-fill-0);
2130
- color: var(--semi-color-text-2);
2131
- font-size: 14px;
2132
- line-height: 20px;
2133
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2134
- flex-shrink: 0;
2135
- }
2136
- .semi-input-prepend-icon, .semi-input-prepend-text, .semi-input-append-icon, .semi-input-append-text {
2137
- padding: 0 12px;
2138
- }
2139
- .semi-input-append {
2140
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
2141
- border-left: 1px transparent solid;
2142
- }
2143
- .semi-input-prepend {
2144
- border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
2145
- border-right: 1px transparent solid;
2146
- }
2147
- .semi-input-disabled::placeholder {
2148
- color: var(--semi-color-disabled-text);
2149
- }
2150
- .semi-input-group {
2151
- display: inline-flex;
2152
- align-items: center;
2153
- align-content: center;
2154
- flex-wrap: wrap;
2155
- }
2156
- .semi-input-group .semi-select,
2157
- .semi-input-group .semi-tagInput,
2158
- .semi-input-group .semi-cascader,
2159
- .semi-input-group .semi-tree-select, .semi-input-group > .semi-input-wrapper {
2160
- border-radius: 0;
2161
- }
2162
- .semi-input-group .semi-select:first-child,
2163
- .semi-input-group .semi-tagInput:first-child,
2164
- .semi-input-group .semi-cascader:first-child,
2165
- .semi-input-group .semi-tree-select:first-child, .semi-input-group > .semi-input-wrapper:first-child {
2166
- border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
2167
- }
2168
- .semi-input-group .semi-select:last-child,
2169
- .semi-input-group .semi-tagInput:last-child,
2170
- .semi-input-group .semi-cascader:last-child,
2171
- .semi-input-group .semi-tree-select:last-child, .semi-input-group > .semi-input-wrapper:last-child {
2172
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
2173
- }
2174
- .semi-input-group .semi-select:not(:last-child),
2175
- .semi-input-group .semi-tagInput:not(:last-child),
2176
- .semi-input-group .semi-cascader:not(:last-child),
2177
- .semi-input-group .semi-tree-select:not(:last-child), .semi-input-group > .semi-input-wrapper:not(:last-child) {
2178
- position: relative;
2179
- }
2180
- .semi-input-group .semi-select:not(:last-child)::after,
2181
- .semi-input-group .semi-tagInput:not(:last-child)::after,
2182
- .semi-input-group .semi-cascader:not(:last-child)::after,
2183
- .semi-input-group .semi-tree-select:not(:last-child)::after, .semi-input-group > .semi-input-wrapper:not(:last-child)::after {
2184
- content: "";
2185
- background-color: var(--semi-color-border);
2186
- width: 1px;
2187
- position: absolute;
2188
- right: -1px;
2189
- top: 1px;
2190
- bottom: 1px;
2191
- }
2192
- .semi-input-group .semi-select {
2193
- overflow-y: visible;
2194
- }
2195
- .semi-input-group .semi-input-number .semi-input-wrapper,
2196
- .semi-input-group .semi-input-number .semi-datepicker-range-input,
2197
- .semi-input-group .semi-datepicker .semi-input-wrapper,
2198
- .semi-input-group .semi-datepicker .semi-datepicker-range-input,
2199
- .semi-input-group .semi-timepicker .semi-input-wrapper,
2200
- .semi-input-group .semi-timepicker .semi-datepicker-range-input,
2201
- .semi-input-group .semi-autocomplete .semi-input-wrapper,
2202
- .semi-input-group .semi-autocomplete .semi-datepicker-range-input {
2203
- border-radius: 0;
2204
- }
2205
- .semi-input-group .semi-input-number:first-child .semi-input-wrapper,
2206
- .semi-input-group .semi-input-number:first-child .semi-datepicker-range-input,
2207
- .semi-input-group .semi-datepicker:first-child .semi-input-wrapper,
2208
- .semi-input-group .semi-datepicker:first-child .semi-datepicker-range-input,
2209
- .semi-input-group .semi-timepicker:first-child .semi-input-wrapper,
2210
- .semi-input-group .semi-timepicker:first-child .semi-datepicker-range-input,
2211
- .semi-input-group .semi-autocomplete:first-child .semi-input-wrapper,
2212
- .semi-input-group .semi-autocomplete:first-child .semi-datepicker-range-input {
2213
- border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
2214
- }
2215
- .semi-input-group .semi-input-number:last-child .semi-input-wrapper,
2216
- .semi-input-group .semi-input-number:last-child .semi-datepicker-range-input,
2217
- .semi-input-group .semi-datepicker:last-child .semi-input-wrapper,
2218
- .semi-input-group .semi-datepicker:last-child .semi-datepicker-range-input,
2219
- .semi-input-group .semi-timepicker:last-child .semi-input-wrapper,
2220
- .semi-input-group .semi-timepicker:last-child .semi-datepicker-range-input,
2221
- .semi-input-group .semi-autocomplete:last-child .semi-input-wrapper,
2222
- .semi-input-group .semi-autocomplete:last-child .semi-datepicker-range-input {
2223
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
2224
- }
2225
- .semi-input-group .semi-input-number:not(:last-child),
2226
- .semi-input-group .semi-datepicker:not(:last-child),
2227
- .semi-input-group .semi-timepicker:not(:last-child),
2228
- .semi-input-group .semi-autocomplete:not(:last-child) {
2229
- position: relative;
2230
- }
2231
- .semi-input-group .semi-input-number:not(:last-child)::after,
2232
- .semi-input-group .semi-datepicker:not(:last-child)::after,
2233
- .semi-input-group .semi-timepicker:not(:last-child)::after,
2234
- .semi-input-group .semi-autocomplete:not(:last-child)::after {
2235
- content: "";
2236
- background-color: var(--semi-color-border);
2237
- width: 1px;
2238
- position: absolute;
2239
- right: -1px;
2240
- top: 1px;
2241
- bottom: 1px;
2242
- }
2243
- .semi-input-group-wrapper-with-top-label {
2244
- margin-top: 16px;
2245
- margin-bottom: 16px;
2246
- }
2247
- .semi-input-group-wrapper-with-top-label .semi-input-group {
2248
- display: flex;
2249
- }
2250
- .semi-input-group-wrapper-with-top-label .semi-input-group .semi-form-field {
2251
- margin-top: 0;
2252
- margin-bottom: 0;
2253
- }
2254
-
2255
- .semi-input-only_border {
2256
- background: transparent;
2257
- border-color: var(--semi-color-border);
2258
- }
2259
- .semi-input-only_border:hover {
2260
- background: transparent;
2261
- border-color: var(--semi-color-border);
2262
- }
2263
- .semi-input-only_border:focus-within {
2264
- background: transparent;
2265
- }
2266
-
2267
- .semi-input-borderless:not(:focus-within):not(:hover) {
2268
- background-color: transparent;
2269
- border-color: transparent;
2270
- }
2271
- .semi-input-borderless:focus-within:not(:active) {
2272
- background-color: transparent;
2273
- }
2274
- .semi-input-borderless.semi-input-wrapper-error:not(:focus-within) {
2275
- border-color: var(--semi-color-danger);
2276
- }
2277
- .semi-input-borderless.semi-input-wrapper-warning:not(:focus-within) {
2278
- border-color: var(--semi-color-warning);
2279
- }
2280
-
2281
- .semi-rtl .semi-input-wrapper,
2282
- .semi-portal-rtl .semi-input-wrapper {
2283
- direction: rtl;
2284
- }
2285
- .semi-rtl .semi-input-wrapper__with-prefix .semi-input,
2286
- .semi-portal-rtl .semi-input-wrapper__with-prefix .semi-input {
2287
- padding-left: auto;
2288
- padding-right: 0;
2289
- }
2290
- .semi-rtl .semi-input-wrapper__with-suffix .semi-input,
2291
- .semi-portal-rtl .semi-input-wrapper__with-suffix .semi-input {
2292
- padding-right: auto;
2293
- padding-left: 0;
2294
- }
2295
- .semi-rtl .semi-input,
2296
- .semi-portal-rtl .semi-input {
2297
- padding-left: 12px;
2298
- padding-right: 12px;
2299
- }
2300
- .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
2301
- .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text,
2302
- .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
2303
- .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text {
2304
- margin-left: auto;
2305
- margin-right: 0;
2306
- }
2307
- .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
2308
- .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon,
2309
- .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
2310
- .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon {
2311
- margin-left: auto;
2312
- margin-right: 0;
2313
- }
2314
- .semi-rtl .semi-input-append,
2315
- .semi-portal-rtl .semi-input-append {
2316
- border-left: 0;
2317
- border-right: 1px transparent solid;
2318
- }
2319
- .semi-rtl .semi-input-prepend,
2320
- .semi-portal-rtl .semi-input-prepend {
2321
- border-right: 0;
2322
- border-left: 1px transparent solid;
2323
- }
2324
- .semi-rtl .semi-input-group .semi-select:not(:last-child)::after,
2325
- .semi-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
2326
- .semi-rtl .semi-input-group .semi-tree-select:not(:last-child)::after, .semi-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after,
2327
- .semi-portal-rtl .semi-input-group .semi-select:not(:last-child)::after,
2328
- .semi-portal-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
2329
- .semi-portal-rtl .semi-input-group .semi-tree-select:not(:last-child)::after,
2330
- .semi-portal-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after {
2331
- right: auto;
2332
- left: -1px;
2333
- }
2334
- .semi-rtl .semi-input-group .semi-input-number:not(:last-child)::after,
2335
- .semi-portal-rtl .semi-input-group .semi-input-number:not(:last-child)::after {
2336
- right: auto;
2337
- left: -1px;
2338
- }
2339
- .semi-rtl .semi-input-textarea-wrapper,
2340
- .semi-portal-rtl .semi-input-textarea-wrapper {
2341
- direction: rtl;
2342
- }
2343
- .semi-rtl .semi-input-textarea-counter,
2344
- .semi-portal-rtl .semi-input-textarea-counter {
2345
- text-align: left;
2346
- }
2347
- .semi-rtl .semi-input-textarea-showClear,
2348
- .semi-portal-rtl .semi-input-textarea-showClear {
2349
- padding-right: 0;
2350
- padding-left: 36px;
2351
- }
2352
-
2353
- .semi-input-number {
2354
- display: inline-flex;
2355
- align-items: center;
2356
- box-sizing: border-box;
2357
- 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);
2358
- transform: scale(var(--semi-transform_scale-none));
2359
- }
2360
- .semi-input-number-suffix-btns {
2361
- display: inline-flex;
2362
- flex-direction: column;
2363
- margin-left: 4px;
2364
- border: 1px solid var(--semi-color-border);
2365
- border-radius: var(--semi-border-radius-small);
2366
- background-color: var(--semi-color-bg-2);
2367
- box-sizing: border-box;
2368
- }
2369
- .semi-input-number-suffix-btns > .semi-input-number-button {
2370
- height: 50%;
2371
- width: 14px;
2372
- padding: 0;
2373
- margin: 0;
2374
- display: inline-flex;
2375
- align-items: center;
2376
- justify-content: center;
2377
- user-select: none;
2378
- border-radius: 0;
2379
- color: var(--semi-color-text-2);
2380
- }
2381
- .semi-input-number-suffix-btns > .semi-input-number-button-up:not(.semi-input-number-button-up-not-allowed):hover, .semi-input-number-suffix-btns > .semi-input-number-button-down:not(.semi-input-number-button-down-not-allowed):hover {
2382
- cursor: pointer;
2383
- background-color: var(--semi-color-fill-0);
2384
- }
2385
- .semi-input-number-suffix-btns > .semi-input-number-button-up:not(.semi-input-number-button-up-not-allowed):active, .semi-input-number-suffix-btns > .semi-input-number-button-down:not(.semi-input-number-button-down-not-allowed):active {
2386
- cursor: pointer;
2387
- background-color: var(--semi-color-fill-1);
2388
- }
2389
- .semi-input-number-suffix-btns > .semi-input-number-button-up.semi-input-number-button-up-disabled, .semi-input-number-suffix-btns > .semi-input-number-button-down.semi-input-number-button-down-disabled {
2390
- background-color: var(--semi-color-disabled-fill);
2391
- color: var(--semi-color-disabled-text);
2392
- }
2393
- .semi-input-number-suffix-btns > .semi-input-number-button-up.semi-input-number-button-up-not-allowed, .semi-input-number-suffix-btns > .semi-input-number-button-down.semi-input-number-button-down-not-allowed {
2394
- cursor: not-allowed;
2395
- }
2396
- .semi-input-number-suffix-btns-inner-hover {
2397
- border-color: var(--semi-color-fill-2);
2398
- }
2399
- .semi-input-number-suffix-btns-inner {
2400
- margin-left: 8px;
2401
- border-radius: var(--semi-border-radius-small);
2402
- overflow: hidden;
2403
- }
2404
- .semi-input-number .semi-input-clearbtn + .semi-input-suffix {
2405
- margin-left: -4px;
2406
- }
2407
- .semi-input-number .semi-input-clearbtn + .semi-input-suffix .semi-input-number-suffix-btns-inner {
2408
- margin-left: 0;
2409
- }
2410
- .semi-input-number-size-default .semi-input-number-suffix-btns {
2411
- height: 32px;
2412
- }
2413
- .semi-input-number-size-default .semi-input-number-suffix-btns-inner {
2414
- height: 30px;
2415
- }
2416
- .semi-input-number-size-large .semi-input-number-suffix-btns {
2417
- height: 40px;
2418
- }
2419
- .semi-input-number-size-large .semi-input-number-suffix-btns-inner {
2420
- height: 38px;
2421
- }
2422
- .semi-input-number-size-small .semi-input-number-suffix-btns {
2423
- height: 24px;
2424
- }
2425
- .semi-input-number-size-small .semi-input-number-suffix-btns-inner {
2426
- height: 22px;
2427
- }
2428
-
2429
- .semi-input-number:not(:focus-within):not(:hover) .semi-input-borderless + .semi-input-number-suffix-btns {
2430
- opacity: 0;
2431
- }
2432
-
2433
- .semi-rtl .semi-input-number,
2434
- .semi-portal-rtl .semi-input-number {
2435
- direction: rtl;
2436
- }
2437
- .semi-rtl .semi-input-number-suffix-btns,
2438
- .semi-portal-rtl .semi-input-number-suffix-btns {
2439
- margin-left: auto;
2440
- margin-right: 4px;
2441
- }
2442
- .semi-rtl .semi-input-number-suffix-btns-inner,
2443
- .semi-portal-rtl .semi-input-number-suffix-btns-inner {
2444
- margin-left: auto;
2445
- margin-right: 8px;
2446
- }
2447
- .semi-rtl .semi-input-number .semi-input-clearbtn + .semi-input-suffix,
2448
- .semi-portal-rtl .semi-input-number .semi-input-clearbtn + .semi-input-suffix {
2449
- margin-left: auto;
2450
- margin-right: -4px;
2451
- }
2452
- .semi-rtl .semi-input-number .semi-input-clearbtn + .semi-input-suffix .semi-input-number-suffix-btns-inner,
2453
- .semi-portal-rtl .semi-input-number .semi-input-clearbtn + .semi-input-suffix .semi-input-number-suffix-btns-inner {
2454
- margin-left: auto;
2455
- margin-right: 0;
2456
- }
2457
-
2458
- .semi-page {
2459
- display: flex;
2460
- list-style: none;
2461
- padding: 0;
2462
- align-items: center;
2463
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2464
- margin-block-start: 0;
2465
- margin-block-end: 0;
2466
- }
2467
- .semi-page-small {
2468
- font-size: 14px;
2469
- line-height: 20px;
2470
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2471
- font-weight: 400;
2472
- color: var(--semi-color-text-2);
2473
- padding: 0 0;
2474
- }
2475
- .semi-page-disabled {
2476
- cursor: not-allowed;
2477
- }
2478
- .semi-page-disabled .semi-page-total {
2479
- color: var(--semi-color-disabled-text);
2480
- }
2481
- .semi-page-item {
2482
- font-size: 14px;
2483
- line-height: 20px;
2484
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2485
- min-width: 32px;
2486
- border: 0px solid transparent;
2487
- cursor: pointer;
2488
- user-select: none;
2489
- height: 32px;
2490
- margin-left: 4px;
2491
- margin-right: 4px;
2492
- font-weight: 400;
2493
- color: var(--semi-color-text-0);
2494
- border-radius: var(--semi-border-radius-small);
2495
- text-align: center;
2496
- line-height: 32px;
2497
- display: flex;
2498
- align-items: center;
2499
- justify-content: center;
2500
- 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);
2501
- transform: scale(var(--semi-transform_scale-none));
2502
- }
2503
- .semi-page-item:hover {
2504
- border-color: transparent;
2505
- background-color: var(--semi-color-fill-0);
2506
- color: var(--semi-color-text-0);
2507
- }
2508
- .semi-page-item-rest-opening {
2509
- background-color: var(--semi-color-fill-0);
2510
- color: var(--semi-color-text-0);
2511
- }
2512
- .semi-page-item:active {
2513
- border-color: transparent;
2514
- background-color: var(--semi-color-fill-1);
2515
- color: var(--semi-color-text-0);
2516
- }
2517
- .semi-page-item-active {
2518
- border-color: transparent;
2519
- color: var(--semi-color-primary);
2520
- font-weight: 600;
2521
- background-color: var(--semi-color-primary-light-default);
2522
- }
2523
- .semi-page-item-active:hover {
2524
- border-color: transparent;
2525
- color: var(--semi-color-primary);
2526
- background-color: var(--semi-color-primary-light-default);
2527
- }
2528
- .semi-page-item-disabled {
2529
- border-color: transparent;
2530
- color: var(--semi-color-disabled-text);
2531
- background-color: transparent;
2532
- cursor: not-allowed;
2533
- }
2534
- .semi-page-item-disabled:hover {
2535
- background-color: transparent;
2536
- }
2537
- .semi-page-item-small {
2538
- min-width: 44px;
2539
- margin: 0;
2540
- }
2541
- .semi-page-item-all-disabled {
2542
- border-color: transparent;
2543
- color: var(--semi-color-disabled-text);
2544
- background-color: transparent;
2545
- cursor: not-allowed;
2546
- }
2547
- .semi-page-item-all-disabled:hover {
2548
- background-color: transparent;
2549
- color: var(--semi-color-disabled-text);
2550
- }
2551
- .semi-page-item-all-disabled-active {
2552
- background-color: var(--semi-color-disabled-fill);
2553
- font-weight: 600;
2554
- }
2555
- .semi-page-item-all-disabled-active:hover {
2556
- background-color: var(--semi-color-disabled-fill);
2557
- }
2558
- .semi-page-total {
2559
- font-size: 14px;
2560
- line-height: 20px;
2561
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2562
- color: var(--semi-color-text-2);
2563
- }
2564
- .semi-page-prev, .semi-page-next {
2565
- color: var(--semi-color-tertiary);
2566
- cursor: pointer;
2567
- }
2568
- .semi-page-prev.semi-page-item-disabled, .semi-page-next.semi-page-item-disabled {
2569
- color: var(--semi-color-disabled-text);
2570
- cursor: not-allowed;
2571
- }
2572
- .semi-page-quickjump {
2573
- margin-left: 24px;
2574
- font-size: 14px;
2575
- line-height: 20px;
2576
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2577
- display: flex;
2578
- justify-content: center;
2579
- align-items: center;
2580
- flex-shrink: 0;
2581
- color: var(--semi-color-text-0);
2582
- }
2583
- .semi-page-quickjump-input-number {
2584
- max-width: 50px;
2585
- margin-left: 4px;
2586
- margin-right: 4px;
2587
- }
2588
- .semi-page-quickjump-disabled {
2589
- color: var(--semi-color-disabled-text);
2590
- }
2591
- .semi-page .semi-select {
2592
- user-select: none;
2593
- }
2594
-
2595
- .semi-select-dropdown {
2596
- user-select: none;
2597
- }
2598
-
2599
- .semi-page-rest-list {
2600
- padding-top: 4px;
2601
- padding-bottom: 4px;
2602
- }
2603
- .semi-page-rest-list > div {
2604
- position: relative;
2605
- }
2606
- .semi-page-rest-item {
2607
- height: 32px;
2608
- line-height: 32px;
2609
- display: flex;
2610
- justify-content: center;
2611
- box-sizing: border-box;
2612
- cursor: pointer;
2613
- }
2614
- .semi-page-rest-item:hover {
2615
- background-color: var(--semi-color-fill-0);
2616
- }
2617
- .semi-page-rest-item:active {
2618
- background-color: var(--semi-color-fill-1);
2619
- }
2620
-
2621
- .semi-rtl .semi-page,
2622
- .semi-portal-rtl .semi-page {
2623
- direction: rtl;
2624
- }
2625
- .semi-rtl .semi-page-item,
2626
- .semi-portal-rtl .semi-page-item {
2627
- margin-right: 4px;
2628
- margin-left: 4px;
2629
- }
2630
- .semi-rtl .semi-page-prev, .semi-rtl .semi-page-next,
2631
- .semi-portal-rtl .semi-page-prev,
2632
- .semi-portal-rtl .semi-page-next {
2633
- transform: scaleX(-1);
2634
- }
2635
-
2636
- .semi-radio {
2637
- box-sizing: border-box;
2638
- font-size: 14px;
2639
- line-height: 20px;
2640
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2641
- position: relative;
2642
- display: inline-flex;
2643
- column-gap: 8px;
2644
- 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);
2645
- min-height: 20px;
2646
- min-width: 16px;
2647
- cursor: pointer;
2648
- vertical-align: bottom;
2649
- text-align: left;
2650
- }
2651
- .semi-radio.semi-radio-vertical {
2652
- display: block;
2653
- }
2654
- .semi-radio input[type=checkbox],
2655
- .semi-radio input[type=radio] {
2656
- position: absolute;
2657
- left: 0;
2658
- top: 0;
2659
- opacity: 0;
2660
- width: 100%;
2661
- height: 100%;
2662
- margin: 0;
2663
- cursor: pointer;
2664
- }
2665
- .semi-radio:hover .semi-radio-inner-display {
2666
- background: var(--semi-color-fill-0);
2667
- border: solid 1px var(--semi-color-focus-border);
2668
- }
2669
- .semi-radio:hover.semi-radio-cardRadioGroup .semi-radio-inner-display {
2670
- background: var(--semi-color-white);
2671
- }
2672
- .semi-radio:hover .semi-radio-inner-checked .semi-radio-inner-display {
2673
- background: var(--semi-color-primary-hover);
2674
- border-color: var(--semi-color-primary-hover);
2675
- }
2676
- .semi-radio:active .semi-radio-inner-display {
2677
- background: var(--semi-color-fill-1);
2678
- }
2679
- .semi-radio:active.semi-radio-cardRadioGroup .semi-radio-inner-display {
2680
- background: var(--semi-color-white);
2681
- }
2682
- .semi-radio:active .semi-radio-inner-checked .semi-radio-inner-display {
2683
- background: var(--semi-color-primary-active);
2684
- border-color: var(--semi-color-primary-active);
2685
- }
2686
- .semi-radio-buttonRadioComponent {
2687
- padding: 4px;
2688
- background: var(--semi-color-fill-0);
2689
- border-radius: var(--semi-border-radius-small);
2690
- }
2691
- .semi-radio-buttonRadioGroup {
2692
- position: relative;
2693
- padding: 4px;
2694
- border-radius: var(--semi-border-radius-small);
2695
- line-height: 16px;
2696
- }
2697
- .semi-radio-buttonRadioGroup:not(:last-child) {
2698
- padding-right: 0;
2699
- }
2700
- .semi-radio-buttonRadioGroup-small {
2701
- padding: 2px 4px;
2702
- line-height: 16px;
2703
- }
2704
- .semi-radio-buttonRadioGroup-large {
2705
- padding: 4px;
2706
- line-height: 20px;
2707
- }
2708
- .semi-radio-cardRadioGroup {
2709
- flex-wrap: nowrap;
2710
- border-radius: var(--semi-border-radius-small);
2711
- padding: 12px 16px;
2712
- background: transparent;
2713
- border: 1px solid transparent;
2714
- 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);
2715
- }
2716
- .semi-radio-cardRadioGroup .semi-radio-inner {
2717
- flex-shrink: 0;
2718
- }
2719
- .semi-radio-cardRadioGroup .semi-radio-inner-display {
2720
- background: var(--semi-color-white);
2721
- }
2722
- .semi-radio-cardRadioGroup .semi-radio-addon {
2723
- font-weight: 600;
2724
- font-size: 14px;
2725
- line-height: 20px;
2726
- color: var(--semi-color-text-0);
2727
- }
2728
- .semi-radio-cardRadioGroup .semi-radio-extra {
2729
- font-weight: normal;
2730
- font-size: 14px;
2731
- line-height: 20px;
2732
- color: var(--semi-color-text-2);
2733
- padding-left: 0;
2734
- }
2735
- .semi-radio-cardRadioGroup:active {
2736
- background: var(--semi-color-fill-1);
2737
- }
2738
- .semi-radio-cardRadioGroup_checked {
2739
- background: var(--semi-color-primary-light-default);
2740
- border: 1px solid var(--semi-color-primary);
2741
- }
2742
- .semi-radio-cardRadioGroup_checked:hover {
2743
- border: 1px solid var(--semi-color-primary-hover);
2744
- }
2745
- .semi-radio-cardRadioGroup_checked:hover .semi-radio-inner-checked .semi-radio-inner-display {
2746
- border-color: var(--semi-color-primary-hover);
2747
- }
2748
- .semi-radio-cardRadioGroup_checked:active {
2749
- background: var(--semi-color-primary-light-default);
2750
- border: 1px solid var(--semi-color-primary-active);
2751
- }
2752
- .semi-radio-cardRadioGroup_checked:active .semi-radio-inner-checked .semi-radio-inner-display {
2753
- border-color: var(--semi-color-primary-active);
2754
- }
2755
- .semi-radio-cardRadioGroup_checked:active .semi-radio-inner-checked:hover .semi-radio-inner-display {
2756
- background: var(--semi-color-primary-active);
2757
- }
2758
- .semi-radio-cardRadioGroup_hover {
2759
- background: var(--semi-color-fill-0);
2760
- }
2761
- .semi-radio-cardRadioGroup_disabled:active {
2762
- background: transparent;
2763
- }
2764
- .semi-radio-cardRadioGroup_checked_disabled.semi-radio-cardRadioGroup {
2765
- background: var(--semi-color-primary-light-default);
2766
- border: 1px solid var(--semi-color-primary-disabled);
2767
- }
2768
- .semi-radio-cardRadioGroup_checked_disabled.semi-radio-cardRadioGroup .semi-radio-inner-checked .semi-radio-inner-display {
2769
- border-color: var(--semi-color-primary-disabled);
2770
- }
2771
- .semi-radio-cardRadioGroup_checked_disabled.semi-radio-cardRadioGroup:hover .semi-radio-inner-checked .semi-radio-inner-display {
2772
- border-color: var(--semi-color-primary-disabled);
2773
- }
2774
- .semi-radio.semi-radio-disabled:hover .semi-radio-inner-display, .semi-radio.semi-radio-disabled:active .semi-radio-inner-display {
2775
- background: var(--semi-color-disabled-fill);
2776
- border: solid 1px var(--semi-color-border);
2777
- }
2778
- .semi-radio.semi-radio-disabled:hover .semi-radio-inner-checked .semi-radio-inner-display, .semi-radio.semi-radio-disabled:active .semi-radio-inner-checked .semi-radio-inner-display {
2779
- color: rgba(var(--semi-white), 1);
2780
- background: var(--semi-color-primary-disabled);
2781
- border-color: var(--semi-color-primary-disabled);
2782
- }
2783
- .semi-radio-inner {
2784
- display: inline-flex;
2785
- margin-top: 2px;
2786
- position: relative;
2787
- width: 16px;
2788
- height: 16px;
2789
- vertical-align: sub;
2790
- user-select: none;
2791
- }
2792
- .semi-radio-inner-display {
2793
- display: inline-flex;
2794
- align-items: center;
2795
- justify-content: center;
2796
- box-sizing: border-box;
2797
- width: 16px;
2798
- height: 16px;
2799
- border: solid 1px var(--semi-color-text-3);
2800
- border-radius: 16px;
2801
- background: transparent;
2802
- 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);
2803
- }
2804
- .semi-radio-inner-display .semi-icon {
2805
- width: 100%;
2806
- height: 100%;
2807
- font-size: 14px;
2808
- }
2809
- .semi-radio-content {
2810
- display: flex;
2811
- flex-direction: column;
2812
- row-gap: 4px;
2813
- }
2814
- .semi-radio:hover .semi-radio-inner-display {
2815
- background: var(--semi-color-fill-0);
2816
- }
2817
- .semi-radio:active .semi-radio-inner-display {
2818
- background: var(--semi-color-fill-1);
2819
- }
2820
- .semi-radio-addon {
2821
- user-select: none;
2822
- color: var(--semi-color-text-0);
2823
- display: inline-flex;
2824
- align-items: center;
2825
- }
2826
- .semi-radio-addon-buttonRadio {
2827
- text-align: center;
2828
- border-radius: var(--semi-border-radius-small);
2829
- font-weight: 600;
2830
- color: var(--semi-color-text-1);
2831
- font-size: 12px;
2832
- padding: 4px 16px;
2833
- 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);
2834
- }
2835
- .semi-radio-addon-buttonRadio-hover {
2836
- font-weight: 600;
2837
- background: var(--semi-color-fill-1);
2838
- }
2839
- .semi-radio-addon-buttonRadio-checked {
2840
- font-weight: 600;
2841
- background: var(--semi-color-bg-3);
2842
- color: var(--semi-color-primary);
2843
- }
2844
- .semi-radio-addon-buttonRadio-disabled {
2845
- cursor: not-allowed;
2846
- color: var(--semi-color-disabled-text);
2847
- }
2848
- .semi-radio-addon-buttonRadio-small {
2849
- font-size: 12px;
2850
- padding: 2px 16px;
2851
- }
2852
- .semi-radio-addon-buttonRadio-large {
2853
- font-size: 14px;
2854
- padding: 6px 24px;
2855
- }
2856
- .semi-radio .semi-radio-inner-checked:hover .semi-radio-inner-display {
2857
- background: var(--semi-color-primary-hover);
2858
- }
2859
- .semi-radio .semi-radio-inner-checked:active .semi-radio-inner-display {
2860
- background: var(--semi-color-primary-active);
2861
- }
2862
- .semi-radio .semi-radio-inner-checked .semi-radio-inner-display {
2863
- border: solid 1px var(--semi-color-primary);
2864
- background: var(--semi-color-primary);
2865
- color: rgba(var(--semi-white), 1);
2866
- border-radius: 16px;
2867
- }
2868
- .semi-radio .semi-radio-inner-checked > .semi-radio-addon {
2869
- color: var(--semi-color-text-0);
2870
- }
2871
- .semi-radio .semi-radio-inner-buttonRadio,
2872
- .semi-radio .semi-radio-inner-pureCardRadio {
2873
- position: absolute;
2874
- top: 0;
2875
- left: 0;
2876
- width: 100%;
2877
- height: 100%;
2878
- margin-top: 0;
2879
- z-index: -1;
2880
- opacity: 0;
2881
- }
2882
- .semi-radio-disabled, .semi-radio-disabled:hover {
2883
- cursor: not-allowed;
2884
- }
2885
- .semi-radio-disabled .semi-radio-inner {
2886
- cursor: not-allowed;
2887
- }
2888
- .semi-radio-disabled .semi-radio-inner-display {
2889
- opacity: 0.75;
2890
- background: var(--semi-color-disabled-fill);
2891
- border-color: var(--semi-color-border);
2892
- }
2893
- .semi-radio-disabled .semi-radio-inner-display:hover {
2894
- background: transparent;
2895
- }
2896
- .semi-radio-disabled .semi-radio-inner-checked .semi-radio-inner-display {
2897
- color: rgba(var(--semi-white), 1);
2898
- background: var(--semi-color-primary-disabled);
2899
- border-color: var(--semi-color-primary-disabled);
2900
- }
2901
- .semi-radio-disabled .semi-radio-inner-checked .semi-radio-inner-display:hover {
2902
- color: rgba(var(--semi-white), 1);
2903
- background: var(--semi-color-primary-disabled);
2904
- border-color: var(--semi-color-primary-disabled);
2905
- }
2906
- .semi-radio-disabled .semi-radio-addon {
2907
- color: var(--semi-color-disabled-text);
2908
- }
2909
- .semi-radio-disabled .semi-radio-extra {
2910
- color: var(--semi-color-disabled-text);
2911
- }
2912
- .semi-radio-extra {
2913
- color: var(--semi-color-text-2);
2914
- box-sizing: border-box;
2915
- }
2916
- .semi-radio-focus {
2917
- outline: 2px solid var(--semi-color-primary-light-active);
2918
- }
2919
- .semi-radio-focus-border {
2920
- border: solid 1px var(--semi-color-focus-border);
2921
- }
2922
-
2923
- .semi-radioGroup {
2924
- font-size: 14px;
2925
- line-height: 20px;
2926
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2927
- }
2928
- .semi-radioGroup-vertical {
2929
- display: flex;
2930
- flex-direction: column;
2931
- row-gap: 12px;
2932
- }
2933
- .semi-radioGroup-vertical-default .semi-radio {
2934
- display: flex;
2935
- }
2936
- .semi-radioGroup-vertical-card .semi-radio {
2937
- display: flex;
2938
- }
2939
- .semi-radioGroup-horizontal {
2940
- display: inline-flex;
2941
- flex-wrap: wrap;
2942
- vertical-align: bottom;
2943
- gap: 16px;
2944
- }
2945
- .semi-radioGroup-buttonRadio {
2946
- display: inline-block;
2947
- background: var(--semi-color-fill-0);
2948
- border-radius: var(--semi-border-radius-small);
2949
- vertical-align: middle;
2950
- }
2951
-
2952
- .semi-rtl .semi-radio,
2953
- .semi-portal-rtl .semi-radio {
2954
- direction: rtl;
2955
- }
2956
- .semi-rtl .semi-radio input[type=checkbox],
2957
- .semi-rtl .semi-radio input[type=radio],
2958
- .semi-portal-rtl .semi-radio input[type=checkbox],
2959
- .semi-portal-rtl .semi-radio input[type=radio] {
2960
- left: auto;
2961
- right: 0;
2962
- }
2963
- .semi-rtl .semi-radio-buttonRadioGroup:not(:last-child),
2964
- .semi-portal-rtl .semi-radio-buttonRadioGroup:not(:last-child) {
2965
- padding-left: 0;
2966
- }
2967
- .semi-rtl .semi-radioGroup,
2968
- .semi-portal-rtl .semi-radioGroup {
2969
- direction: rtl;
2970
- }
2971
-
2972
- .semi-select-option {
2973
- font-size: 14px;
2974
- line-height: 20px;
2975
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
2976
- word-break: break-all;
2977
- padding-left: 12px;
2978
- padding-right: 12px;
2979
- padding-top: 8px;
2980
- padding-bottom: 8px;
2981
- color: var(--semi-color-text-0);
2982
- border-radius: 0px;
2983
- position: relative;
2984
- display: flex;
2985
- flex-wrap: nowrap;
2986
- align-items: center;
2987
- cursor: pointer;
2988
- box-sizing: border-box;
2989
- transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
2990
- }
2991
- .semi-select-option-icon {
2992
- width: 12px;
2993
- color: transparent;
2994
- margin-right: 8px;
2995
- display: flex;
2996
- justify-content: center;
2997
- align-content: center;
2998
- }
2999
- .semi-select-option-text {
3000
- display: flex;
3001
- flex-wrap: wrap;
3002
- white-space: pre;
3003
- }
3004
- .semi-select-option-keyword {
3005
- color: var(--semi-color-primary);
3006
- background-color: inherit;
3007
- font-weight: 600;
3008
- }
3009
- .semi-select-option:active {
3010
- background-color: var(--semi-color-fill-1);
3011
- }
3012
- .semi-select-option-empty {
3013
- cursor: not-allowed;
3014
- color: var(--semi-color-disabled-text);
3015
- justify-content: center;
3016
- }
3017
- .semi-select-option-empty:hover {
3018
- background-color: inherit;
3019
- }
3020
- .semi-select-option-empty:active {
3021
- background-color: inherit;
3022
- }
3023
- .semi-select-option-disabled {
3024
- color: var(--semi-color-disabled-text);
3025
- cursor: not-allowed;
3026
- }
3027
- .semi-select-option-disabled:hover {
3028
- background-color: var(--semi-color-fill-0);
3029
- }
3030
- .semi-select-option-selected {
3031
- font-weight: 600;
3032
- background: transparent;
3033
- }
3034
- .semi-select-option-selected .semi-select-option-icon {
3035
- color: var(--semi-color-text-2);
3036
- }
3037
- .semi-select-option-focused {
3038
- background-color: var(--semi-color-fill-0);
3039
- }
3040
-
3041
- .semi-select {
3042
- box-sizing: border-box;
3043
- border-radius: var(--semi-border-radius-small);
3044
- border: 1px solid transparent;
3045
- height: 32px;
3046
- font-weight: 400;
3047
- background-color: var(--semi-color-fill-0);
3048
- display: inline-flex;
3049
- vertical-align: middle;
3050
- position: relative;
3051
- outline: none;
3052
- cursor: pointer;
3053
- 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);
3054
- transform: scale(var(--semi-transform_scale-none));
3055
- max-height: 300px;
3056
- overflow-y: auto;
3057
- }
3058
- .semi-select:hover {
3059
- background-color: var(--semi-color-fill-1);
3060
- border: 1px solid transparent;
3061
- }
3062
- .semi-select:focus {
3063
- border: 1px solid var(--semi-color-focus-border);
3064
- background-color: var(--semi-color-fill-0);
3065
- outline: 0;
3066
- }
3067
- .semi-select:active {
3068
- background-color: var(--semi-color-fill-2);
3069
- }
3070
- .semi-select-small {
3071
- height: 24px;
3072
- line-height: 24px;
3073
- }
3074
- .semi-select-large {
3075
- min-height: 40px;
3076
- line-height: 40px;
3077
- }
3078
- .semi-select-large .semi-select-selection {
3079
- font-size: 16px;
3080
- line-height: 22px;
3081
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3082
- }
3083
- .semi-select-open, .semi-select-focus {
3084
- border: 1px solid var(--semi-color-focus-border);
3085
- outline: 0;
3086
- }
3087
- .semi-select-open:hover, .semi-select-focus:hover {
3088
- background-color: var(--semi-color-fill-0);
3089
- border: 1px solid var(--semi-color-focus-border);
3090
- }
3091
- .semi-select-open:active, .semi-select-focus:active {
3092
- background-color: var(--semi-color-fill-2);
3093
- border: 1px solid var(--semi-color-focus-border);
3094
- }
3095
- .semi-select-warning {
3096
- background-color: var(--semi-color-warning-light-default);
3097
- border-color: var(--semi-color-warning-light-default);
3098
- }
3099
- .semi-select-warning:hover {
3100
- background-color: var(--semi-color-warning-light-hover);
3101
- border-color: var(--semi-color-warning-light-hover);
3102
- }
3103
- .semi-select-warning:focus {
3104
- background-color: var(--semi-color-warning-light-default);
3105
- border-color: var(--semi-color-warning);
3106
- }
3107
- .semi-select-warning:active {
3108
- background-color: var(--semi-color-warning-light-active);
3109
- border-color: var(--semi-color-warning-light-active);
3110
- }
3111
- .semi-select-error {
3112
- background-color: var(--semi-color-danger-light-default);
3113
- border-color: var(--semi-color-danger-light-default);
3114
- }
3115
- .semi-select-error:hover {
3116
- background-color: var(--semi-color-danger-light-hover);
3117
- border-color: var(--semi-color-danger-light-hover);
3118
- }
3119
- .semi-select-error:focus {
3120
- background-color: var(--semi-color-danger-light-default);
3121
- border-color: var(--semi-color-danger);
3122
- }
3123
- .semi-select-error:active {
3124
- background-color: var(--semi-color-danger-light-active);
3125
- border-color: var(--semi-color-danger-light-active);
3126
- }
3127
- .semi-select-disabled {
3128
- cursor: not-allowed;
3129
- background-color: var(--semi-color-disabled-fill);
3130
- }
3131
- .semi-select-disabled:hover {
3132
- background-color: var(--semi-color-disabled-fill);
3133
- }
3134
- .semi-select-disabled:focus {
3135
- border: 1px solid transparent;
3136
- background-color: var(--semi-color-disabled-fill);
3137
- }
3138
- .semi-select-disabled .semi-select-selection,
3139
- .semi-select-disabled .semi-select-selection-placeholder {
3140
- color: var(--semi-color-disabled-text);
3141
- cursor: not-allowed;
3142
- }
3143
- .semi-select-disabled .semi-select-arrow,
3144
- .semi-select-disabled .semi-select-prefix,
3145
- .semi-select-disabled .semi-select-suffix {
3146
- color: var(--semi-color-disabled-text);
3147
- }
3148
- .semi-select-disabled .semi-tag {
3149
- color: var(--semi-color-disabled-text);
3150
- background-color: transparent;
3151
- }
3152
- .semi-select-selection {
3153
- font-size: 14px;
3154
- line-height: 20px;
3155
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3156
- height: 100%;
3157
- display: flex;
3158
- align-items: center;
3159
- flex-grow: 1;
3160
- overflow: hidden;
3161
- margin-left: 12px;
3162
- cursor: pointer;
3163
- color: var(--semi-color-text-0);
3164
- }
3165
- .semi-select-selection-text {
3166
- width: 100%;
3167
- overflow: hidden;
3168
- text-overflow: ellipsis;
3169
- }
3170
- .semi-select-selection-text-inactive {
3171
- display: flex;
3172
- opacity: 0.4;
3173
- }
3174
- .semi-select-selection-text-hide {
3175
- display: none;
3176
- }
3177
- .semi-select-selection-placeholder {
3178
- color: var(--semi-color-text-2);
3179
- }
3180
- .semi-select-selection .semi-tag {
3181
- margin-top: 1px;
3182
- margin-right: 4px;
3183
- margin-bottom: 1px;
3184
- }
3185
- .semi-select-selection .semi-tag:nth-of-type(1) {
3186
- margin-left: 0;
3187
- }
3188
- .semi-select-selection .semi-tag-group {
3189
- height: inherit;
3190
- }
3191
- .semi-select-selection .semi-tag-group .semi-tag {
3192
- margin-top: 1px;
3193
- margin-right: 4px;
3194
- margin-bottom: 1px;
3195
- }
3196
- .semi-select-content-wrapper {
3197
- white-space: nowrap;
3198
- overflow: hidden;
3199
- display: flex;
3200
- align-items: center;
3201
- height: 100%;
3202
- }
3203
- .semi-select-content-wrapper-collapse {
3204
- display: inline-flex;
3205
- flex-shrink: 0;
3206
- width: 100%;
3207
- }
3208
- .semi-select-content-wrapper-collapse .semi-overflow-list-overflow {
3209
- max-width: 100%;
3210
- min-width: 50px;
3211
- }
3212
- .semi-select-content-wrapper-collapse > .semi-select-content-wrapper-collapse-tag {
3213
- background-color: transparent;
3214
- }
3215
- .semi-select-content-wrapper-collapse > .semi-select-content-wrapper-collapse-N {
3216
- background-color: transparent;
3217
- padding: 4px;
3218
- color: var(--semi-color-text-0);
3219
- font-size: 12px;
3220
- }
3221
- .semi-select-multiple {
3222
- height: auto;
3223
- }
3224
- .semi-select-multiple .semi-select-selection {
3225
- margin-left: 4px;
3226
- }
3227
- .semi-select-multiple .semi-select-content-wrapper {
3228
- width: 100%;
3229
- min-height: 30px;
3230
- flex-wrap: wrap;
3231
- }
3232
- .semi-select-multiple .semi-select-content-wrapper-empty {
3233
- margin-left: 8px;
3234
- }
3235
- .semi-select-multiple .semi-select-content-wrapper .semi-tag-group {
3236
- display: flex;
3237
- align-items: center;
3238
- }
3239
- .semi-select-multiple .semi-select-content-wrapper-one-line {
3240
- flex-wrap: nowrap;
3241
- }
3242
- .semi-select-multiple .semi-select-content-wrapper-one-line .semi-tag-group {
3243
- flex-wrap: nowrap;
3244
- justify-content: flex-start;
3245
- overflow: hidden;
3246
- flex-shrink: 0;
3247
- }
3248
- .semi-select-multiple .semi-select-inline-label-wrapper {
3249
- flex-shrink: 0;
3250
- }
3251
- .semi-select-multiple.semi-select-large .semi-select-content-wrapper {
3252
- min-height: 38px;
3253
- }
3254
- .semi-select-multiple.semi-select-small .semi-select-content-wrapper {
3255
- min-height: 22px;
3256
- }
3257
- .semi-select-arrow {
3258
- display: flex;
3259
- align-items: center;
3260
- justify-content: center;
3261
- width: 32px;
3262
- color: var(--semi-color-text-2);
3263
- flex-shrink: 0;
3264
- transform: rotate(var(--semi-transform-rotate-none));
3265
- }
3266
- .semi-select-arrow-empty {
3267
- display: flex;
3268
- width: 12px;
3269
- }
3270
- .semi-select-prefix, .semi-select-suffix {
3271
- display: flex;
3272
- justify-content: center;
3273
- align-items: center;
3274
- }
3275
- .semi-select-prefix-text, .semi-select-suffix-text {
3276
- margin: 0px 12px;
3277
- color: var(--semi-color-text-2);
3278
- font-size: 14px;
3279
- line-height: 20px;
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
- }
3283
- .semi-select-prefix-icon, .semi-select-suffix-icon {
3284
- color: var(--semi-color-text-2);
3285
- margin: 0px 8px;
3286
- }
3287
- .semi-select-suffix {
3288
- display: flex;
3289
- justify-content: center;
3290
- align-items: center;
3291
- }
3292
- .semi-select-clear {
3293
- display: flex;
3294
- justify-content: center;
3295
- align-items: center;
3296
- width: 32px;
3297
- color: var(--semi-color-text-2);
3298
- flex-shrink: 0;
3299
- }
3300
- .semi-select-clear:hover {
3301
- color: var(--semi-color-primary);
3302
- }
3303
- .semi-select-inset-label-wrapper {
3304
- display: inline;
3305
- }
3306
- .semi-select-inset-label {
3307
- margin: 0px 12px;
3308
- font-weight: 600;
3309
- font-size: 14px;
3310
- line-height: 20px;
3311
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3312
- color: var(--semi-color-text-2);
3313
- flex-shrink: 0;
3314
- white-space: nowrap;
3315
- }
3316
- .semi-select-create-tips {
3317
- color: var(--semi-color-text-2);
3318
- margin-right: 4px;
3319
- }
3320
-
3321
- .semi-select-with-prefix .semi-select-selection {
3322
- margin-left: 0;
3323
- }
3324
-
3325
- .semi-select-single.semi-select-filterable .semi-select-content-wrapper {
3326
- flex-grow: 1;
3327
- height: 100%;
3328
- overflow: hidden;
3329
- position: relative;
3330
- }
3331
- .semi-select-single.semi-select-filterable .semi-input-wrapper {
3332
- position: absolute;
3333
- top: 0;
3334
- left: 0;
3335
- height: 100%;
3336
- width: 100%;
3337
- border: none;
3338
- background-color: transparent;
3339
- }
3340
- .semi-select-single.semi-select-filterable .semi-input-wrapper-focus {
3341
- border: none;
3342
- }
3343
- .semi-select-single.semi-select-filterable .semi-input {
3344
- padding-left: 0;
3345
- padding-right: 0;
3346
- height: 100%;
3347
- }
3348
-
3349
- .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper {
3350
- flex-grow: 1;
3351
- height: 100%;
3352
- overflow: hidden;
3353
- position: relative;
3354
- }
3355
- .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
3356
- height: 24px;
3357
- line-height: 24px;
3358
- }
3359
- .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-default {
3360
- height: 24px;
3361
- }
3362
- .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
3363
- position: absolute;
3364
- top: 0;
3365
- left: 0;
3366
- height: 100%;
3367
- }
3368
- .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper .semi-input-default {
3369
- height: 100%;
3370
- }
3371
- .semi-select-multiple.semi-select-filterable .semi-input-wrapper {
3372
- height: 100%;
3373
- width: 100%;
3374
- border: none;
3375
- background-color: transparent;
3376
- }
3377
- .semi-select-multiple.semi-select-filterable .semi-input-wrapper-focus {
3378
- border: none;
3379
- }
3380
- .semi-select-multiple.semi-select-filterable .semi-input {
3381
- padding-left: 0;
3382
- padding-right: 0;
3383
- }
3384
-
3385
- .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large {
3386
- height: 24px;
3387
- line-height: 24px;
3388
- }
3389
- .semi-select-multiple.semi-select-filterable.semi-select-large .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper-large .semi-input-large {
3390
- height: 24px;
3391
- }
3392
-
3393
- .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper {
3394
- height: 20px;
3395
- line-height: 20px;
3396
- }
3397
- .semi-select-multiple.semi-select-filterable.semi-select-small .semi-select-content-wrapper:not(.semi-select-content-wrapper-empty) .semi-input-wrapper .semi-input-small {
3398
- height: 20px;
3399
- }
3400
-
3401
- .semi-select-option-list-wrapper {
3402
- padding-top: 4px;
3403
- padding-bottom: 4px;
3404
- padding-left: 0px;
3405
- padding-right: 0px;
3406
- }
3407
-
3408
- .semi-select-option-list {
3409
- overflow-x: hidden;
3410
- overflow-y: auto;
3411
- }
3412
- .semi-select-option-list-chosen .semi-select-option-icon {
3413
- display: flex;
3414
- }
3415
-
3416
- .semi-select-group {
3417
- color: var(--semi-color-text-2);
3418
- padding-top: 12px;
3419
- margin-top: 4px;
3420
- padding-bottom: 4px;
3421
- padding-left: 32px;
3422
- padding-right: 16px;
3423
- font-size: 12px;
3424
- line-height: 16px;
3425
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
3426
- cursor: default;
3427
- }
3428
- .semi-select-group:not(:nth-of-type(1)) {
3429
- border-top: 1px solid var(--semi-color-border);
3430
- }
3431
-
3432
- .semi-select-loading-wrapper {
3433
- padding-left: 16px;
3434
- padding-right: 16px;
3435
- padding-top: 8px;
3436
- padding-bottom: 8px;
3437
- cursor: not-allowed;
3438
- height: 20px;
3439
- box-sizing: content-box;
3440
- }
3441
-
3442
- .semi-select-borderless:not(:focus-within):not(:hover) {
3443
- background-color: transparent;
3444
- border-color: transparent;
3445
- }
3446
- .semi-select-borderless:not(:focus-within):not(:hover) .semi-select-arrow {
3447
- opacity: 0;
3448
- }
3449
- .semi-select-borderless:focus-within:not(:active) {
3450
- background-color: transparent;
3451
- }
3452
- .semi-select-borderless.semi-select-error:not(:focus-within) {
3453
- border-color: var(--semi-color-danger);
3454
- }
3455
- .semi-select-borderless.semi-select-warning:not(:focus-within) {
3456
- border-color: var(--semi-color-warning);
3457
- }
3458
- .semi-select-borderless.semi-select-error:focus-within {
3459
- border-color: var(--semi-color-danger);
3460
- }
3461
- .semi-select-borderless.semi-select-warning:focus-within {
3462
- border-color: var(--semi-color-warning);
3463
- }
3464
-
3465
- .semi-select-dropdown-search-wrapper {
3466
- padding-top: 8px;
3467
- padding-right: 12px;
3468
- padding-bottom: 8px;
3469
- padding-top: 8px;
3470
- padding-left: 12px;
3471
- border-bottom: 1px solid transparent;
3472
- }
3473
-
3474
- .semi-rtl .semi-select,
3475
- .semi-portal-rtl .semi-select {
3476
- direction: rtl;
3477
- }
3478
- .semi-rtl .semi-select-selection,
3479
- .semi-portal-rtl .semi-select-selection {
3480
- margin-left: 0;
3481
- margin-right: 12px;
3482
- }
3483
- .semi-rtl .semi-select-selection .semi-tag:nth-of-type(1),
3484
- .semi-portal-rtl .semi-select-selection .semi-tag:nth-of-type(1) {
3485
- margin-right: 0;
3486
- }
3487
- .semi-rtl .semi-select-selection .semi-tag-group .semi-tag,
3488
- .semi-portal-rtl .semi-select-selection .semi-tag-group .semi-tag {
3489
- margin-left: 4px;
3490
- margin-right: 0;
3491
- }
3492
- .semi-rtl .semi-select-multiple .semi-select-selection,
3493
- .semi-portal-rtl .semi-select-multiple .semi-select-selection {
3494
- margin-left: 0;
3495
- margin-right: 4px;
3496
- }
3497
- .semi-rtl .semi-select-multiple .semi-select-content-wrapper-empty,
3498
- .semi-portal-rtl .semi-select-multiple .semi-select-content-wrapper-empty {
3499
- margin-left: 0;
3500
- margin-right: 8px;
3501
- }
3502
- .semi-rtl .semi-select-create-tips,
3503
- .semi-portal-rtl .semi-select-create-tips {
3504
- margin-right: 0;
3505
- margin-left: 4px;
3506
- }
3507
- .semi-rtl .semi-select-with-prefix .semi-select-selection,
3508
- .semi-portal-rtl .semi-select-with-prefix .semi-select-selection {
3509
- margin-left: auto;
3510
- margin-right: 0;
3511
- }
3512
- .semi-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper,
3513
- .semi-portal-rtl .semi-select-single.semi-select-filterable .semi-input-wrapper {
3514
- left: auto;
3515
- right: 0;
3516
- }
3517
- .semi-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper,
3518
- .semi-portal-rtl .semi-select-multiple.semi-select-filterable .semi-select-content-wrapper-empty .semi-input-wrapper {
3519
- left: auto;
3520
- right: 0;
3521
- }
3522
- .semi-rtl .semi-select-group,
3523
- .semi-portal-rtl .semi-select-group {
3524
- padding-left: 32px;
3525
- padding-right: 16px;
3526
- }
3527
- .semi-rtl .semi-select-option-icon,
3528
- .semi-portal-rtl .semi-select-option-icon {
3529
- margin-right: 0;
3530
- margin-left: 8px;
3531
- }
3532
-
3533
- .semi-spin {
3534
- position: relative;
3535
- display: inline-block;
3536
- width: 20px;
3537
- height: 20px;
3538
- }
3539
- @keyframes semi-animation-rotate {
3540
- from {
3541
- transform: rotate(0);
3542
- }
3543
- to {
3544
- transform: rotate(360deg);
3545
- }
3546
- }
3547
- .semi-spin-wrapper {
3548
- text-align: center;
3549
- position: absolute;
3550
- width: 100%;
3551
- transform: translateY(-50%);
3552
- top: 50%;
3553
- color: var(--semi-color-primary);
3554
- }
3555
- .semi-spin-wrapper > svg {
3556
- display: inline;
3557
- animation: 600ms linear infinite semi-animation-rotate;
3558
- animation-fill-mode: forwards;
3559
- vertical-align: top;
3560
- width: 20px;
3561
- height: 20px;
3562
- }
3563
- .semi-spin-animate {
3564
- display: inline-flex;
3565
- animation: 1600ms linear infinite semi-animation-rotate;
3566
- animation-fill-mode: forwards;
3567
- }
3568
- .semi-spin-children {
3569
- opacity: 0.5;
3570
- user-select: none;
3571
- }
3572
- .semi-spin-block {
3573
- display: block;
3574
- }
3575
- .semi-spin-block::after {
3576
- content: "";
3577
- position: absolute;
3578
- top: 0;
3579
- left: 0;
3580
- width: 100%;
3581
- height: 100%;
3582
- z-index: 1;
3583
- }
3584
- .semi-spin-block .semi-spin-wrapper {
3585
- display: block;
3586
- }
3587
- .semi-spin-block.semi-spin {
3588
- height: auto;
3589
- width: auto;
3590
- }
3591
- .semi-spin-hidden::after {
3592
- content: none;
3593
- }
3594
- .semi-spin-hidden > .semi-spin-children {
3595
- opacity: 1;
3596
- user-select: auto;
3597
- }
3598
-
3599
- .semi-spin-small {
3600
- width: 14px;
3601
- height: 14px;
3602
- }
3603
- .semi-spin-small > .semi-spin-wrapper svg {
3604
- width: 14px;
3605
- height: 14px;
3606
- }
3607
-
3608
- .semi-spin-middle {
3609
- width: 20px;
3610
- height: 20px;
3611
- }
3612
- .semi-spin-middle > .semi-spin-wrapper svg {
3613
- width: 20px;
3614
- height: 20px;
3615
- }
3616
-
3617
- .semi-spin-large {
3618
- width: 32px;
3619
- height: 32px;
3620
- }
3621
- .semi-spin-large > .semi-spin-wrapper svg {
3622
- width: 32px;
3623
- height: 32px;
3624
- }
3625
-
3626
- .semi-spin-container {
3627
- overflow: hidden;
3628
- }
3629
-
3630
- .semi-rtl .semi-spin,
3631
- .semi-portal-rtl .semi-spin {
3632
- direction: rtl;
3633
- }
3634
- .semi-rtl .semi-spin-container,
3635
- .semi-portal-rtl .semi-spin-container {
3636
- direction: rtl;
3637
- }
3638
-
3639
4
  .semi-table-panel-operation {
3640
5
  background-color: var(--semi-color-primary);
3641
6
  padding-left: 16px;
@@ -4286,733 +651,4 @@ body, :host {
4286
651
  }
4287
652
  .semi-table-wrapper-rtl .semi-spin {
4288
653
  direction: rtl;
4289
- }
4290
-
4291
- @keyframes semi-tooltip-zoomIn {
4292
- from {
4293
- opacity: 0;
4294
- transform: scale(0.8, 0.8);
4295
- }
4296
- 50% {
4297
- opacity: 1;
4298
- }
4299
- }
4300
- @keyframes semi-tooltip-bounceIn {
4301
- from {
4302
- opacity: 0;
4303
- transform: scale(0.6, 0.6);
4304
- }
4305
- 70% {
4306
- opacity: 1;
4307
- transform: scale(1.01, 1.01);
4308
- }
4309
- to {
4310
- opacity: 1;
4311
- transform: scale(1, 1);
4312
- animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
4313
- }
4314
- }
4315
- @keyframes semi-tooltip-zoomOut {
4316
- from {
4317
- opacity: 1;
4318
- }
4319
- 60% {
4320
- opacity: 0;
4321
- transform: scale(0.8, 0.8);
4322
- }
4323
- to {
4324
- opacity: 0;
4325
- }
4326
- }
4327
- .semi-tooltip-wrapper {
4328
- position: relative;
4329
- background-color: rgba(var(--semi-grey-7), 1);
4330
- backdrop-filter: none;
4331
- color: var(--semi-color-bg-0);
4332
- border-radius: var(--semi-border-radius-medium);
4333
- padding-top: 8px;
4334
- padding-right: 12px;
4335
- padding-bottom: 8px;
4336
- padding-left: 12px;
4337
- font-size: 14px;
4338
- left: 0;
4339
- top: 0;
4340
- word-wrap: break-word;
4341
- overflow-wrap: break-word;
4342
- font-size: 14px;
4343
- line-height: 20px;
4344
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4345
- opacity: 0;
4346
- max-width: 240px;
4347
- }
4348
- .semi-tooltip-wrapper-show {
4349
- opacity: 1;
4350
- }
4351
- .semi-tooltip-content {
4352
- min-width: 0;
4353
- }
4354
- .semi-tooltip-trigger {
4355
- display: inline-block;
4356
- width: auto;
4357
- height: auto;
4358
- }
4359
- .semi-tooltip-with-arrow {
4360
- display: flex;
4361
- align-items: center;
4362
- justify-content: center;
4363
- box-sizing: border-box;
4364
- }
4365
- .semi-tooltip-animation-show {
4366
- animation: semi-tooltip-zoomIn 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
4367
- animation-fill-mode: forwards;
4368
- }
4369
- .semi-tooltip-animation-hide {
4370
- animation: semi-tooltip-zoomOut 100ms cubic-bezier(0.215, 0.61, 0.355, 1);
4371
- animation-fill-mode: forwards;
4372
- }
4373
-
4374
- .semi-tooltip-wrapper .semi-tooltip-icon-arrow {
4375
- height: 7px;
4376
- width: 24px;
4377
- position: absolute;
4378
- color: rgba(var(--semi-grey-7), 1);
4379
- }
4380
- .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-icon-arrow {
4381
- left: var(--semi-tooltip-arrow-offset-x, 50%);
4382
- transform: translateX(-50%);
4383
- bottom: -6px;
4384
- }
4385
- .semi-tooltip-wrapper[x-placement=top].semi-tooltip-with-arrow,
4386
- .semi-tooltip-wrapper[x-placement=top] .semi-tooltip-with-arrow {
4387
- min-width: 36px;
4388
- }
4389
- .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-icon-arrow {
4390
- bottom: -6px;
4391
- left: 6px;
4392
- }
4393
- .semi-tooltip-wrapper[x-placement=topLeft].semi-tooltip-with-arrow,
4394
- .semi-tooltip-wrapper[x-placement=topLeft] .semi-tooltip-with-arrow {
4395
- min-width: 36px;
4396
- }
4397
- .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-icon-arrow {
4398
- bottom: -6px;
4399
- right: 6px;
4400
- }
4401
- .semi-tooltip-wrapper[x-placement=topRight].semi-tooltip-with-arrow,
4402
- .semi-tooltip-wrapper[x-placement=topRight] .semi-tooltip-with-arrow {
4403
- min-width: 36px;
4404
- }
4405
- .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-icon-arrow {
4406
- width: 7px;
4407
- height: 24px;
4408
- right: -6px;
4409
- top: 5px;
4410
- }
4411
- .semi-tooltip-wrapper[x-placement=leftTop].semi-tooltip-with-arrow,
4412
- .semi-tooltip-wrapper[x-placement=leftTop] .semi-tooltip-with-arrow {
4413
- min-height: 34px;
4414
- }
4415
- .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-icon-arrow {
4416
- width: 7px;
4417
- height: 24px;
4418
- right: -6px;
4419
- top: var(--semi-tooltip-arrow-offset-y, 50%);
4420
- transform: translateY(-50%);
4421
- }
4422
- .semi-tooltip-wrapper[x-placement=left].semi-tooltip-with-arrow,
4423
- .semi-tooltip-wrapper[x-placement=left] .semi-tooltip-with-arrow {
4424
- min-height: 34px;
4425
- }
4426
- .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-icon-arrow {
4427
- width: 7px;
4428
- height: 24px;
4429
- right: -6px;
4430
- bottom: 5px;
4431
- }
4432
- .semi-tooltip-wrapper[x-placement=leftBottom].semi-tooltip-with-arrow,
4433
- .semi-tooltip-wrapper[x-placement=leftBottom] .semi-tooltip-with-arrow {
4434
- min-height: 34px;
4435
- }
4436
- .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-icon-arrow {
4437
- width: 7px;
4438
- height: 24px;
4439
- left: -6px;
4440
- top: 5px;
4441
- transform: rotate(180deg);
4442
- }
4443
- .semi-tooltip-wrapper[x-placement=rightTop].semi-tooltip-with-arrow,
4444
- .semi-tooltip-wrapper[x-placement=rightTop] .semi-tooltip-with-arrow {
4445
- min-height: 34px;
4446
- }
4447
- .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-icon-arrow {
4448
- width: 7px;
4449
- height: 24px;
4450
- left: -6px;
4451
- top: var(--semi-tooltip-arrow-offset-y, 50%);
4452
- transform: translateY(-50%) rotate(180deg);
4453
- }
4454
- .semi-tooltip-wrapper[x-placement=right].semi-tooltip-with-arrow,
4455
- .semi-tooltip-wrapper[x-placement=right] .semi-tooltip-with-arrow {
4456
- min-height: 34px;
4457
- }
4458
- .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-icon-arrow {
4459
- width: 7px;
4460
- height: 24px;
4461
- left: -6px;
4462
- bottom: 5px;
4463
- transform: rotate(180deg);
4464
- }
4465
- .semi-tooltip-wrapper[x-placement=rightBottom].semi-tooltip-with-arrow,
4466
- .semi-tooltip-wrapper[x-placement=rightBottom] .semi-tooltip-with-arrow {
4467
- min-height: 34px;
4468
- }
4469
- .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-icon-arrow {
4470
- top: -6px;
4471
- left: 6px;
4472
- transform: rotate(180deg);
4473
- }
4474
- .semi-tooltip-wrapper[x-placement=bottomLeft].semi-tooltip-with-arrow,
4475
- .semi-tooltip-wrapper[x-placement=bottomLeft] .semi-tooltip-with-arrow {
4476
- min-width: 36px;
4477
- }
4478
- .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-icon-arrow {
4479
- top: -6px;
4480
- left: var(--semi-tooltip-arrow-offset-x, 50%);
4481
- transform: translateX(-50%) rotate(180deg);
4482
- }
4483
- .semi-tooltip-wrapper[x-placement=bottom].semi-tooltip-with-arrow,
4484
- .semi-tooltip-wrapper[x-placement=bottom] .semi-tooltip-with-arrow {
4485
- min-width: 36px;
4486
- }
4487
- .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-icon-arrow {
4488
- right: 6px;
4489
- top: -6px;
4490
- transform: rotate(180deg);
4491
- }
4492
- .semi-tooltip-wrapper[x-placement=bottomRight].semi-tooltip-with-arrow,
4493
- .semi-tooltip-wrapper[x-placement=bottomRight] .semi-tooltip-with-arrow {
4494
- min-width: 36px;
4495
- }
4496
-
4497
- .semi-rtl .semi-tooltip-wrapper,
4498
- .semi-portal-rtl .semi-tooltip-wrapper {
4499
- direction: rtl;
4500
- padding-right: 12px;
4501
- padding-left: 12px;
4502
- left: auto;
4503
- right: 0;
4504
- }
4505
-
4506
- .semi-icon {
4507
- display: inline-block;
4508
- font-style: normal;
4509
- line-height: 0;
4510
- text-align: center;
4511
- text-transform: none;
4512
- text-rendering: optimizeLegibility;
4513
- fill: currentColor;
4514
- }
4515
-
4516
- .semi-icon-extra-small {
4517
- font-size: 8px;
4518
- }
4519
-
4520
- .semi-icon-small {
4521
- font-size: 12px;
4522
- }
4523
-
4524
- .semi-icon-default {
4525
- font-size: 16px;
4526
- }
4527
-
4528
- .semi-icon-large {
4529
- font-size: 20px;
4530
- }
4531
-
4532
- .semi-icon-extra-large {
4533
- font-size: 24px;
4534
- }
4535
-
4536
- .semi-icon-spinning {
4537
- animation: 0.6s linear infinite semi-icon-animation-rotate;
4538
- animation-fill-mode: forwards;
4539
- }
4540
-
4541
- @keyframes semi-icon-animation-rotate {
4542
- from {
4543
- transform: rotate(0);
4544
- }
4545
- to {
4546
- transform: rotate(360deg);
4547
- }
4548
- }
4549
- @keyframes semi-animation-rotate {
4550
- from {
4551
- transform: rotate(0);
4552
- }
4553
- to {
4554
- transform: rotate(360deg);
4555
- }
4556
- }
4557
- .semi-button.semi-button-with-icon {
4558
- display: inline-flex;
4559
- align-items: center;
4560
- }
4561
- .semi-button.semi-button-with-icon .semi-button-content {
4562
- display: flex;
4563
- align-items: center;
4564
- justify-content: center;
4565
- }
4566
- .semi-button.semi-button-loading {
4567
- pointer-events: none;
4568
- cursor: not-allowed;
4569
- }
4570
- .semi-button.semi-button-loading .semi-button-content > svg, .semi-button.semi-button-loading .semi-button-content-loading-icon {
4571
- width: 16px;
4572
- height: 16px;
4573
- animation: 600ms linear infinite semi-animation-rotate;
4574
- animation-fill-mode: forwards;
4575
- }
4576
- .semi-button.semi-button-with-icon-only {
4577
- padding-left: 8px;
4578
- padding-right: 8px;
4579
- padding-top: 8px;
4580
- padding-bottom: 8px;
4581
- height: 32px;
4582
- width: 32px;
4583
- justify-content: center;
4584
- align-items: center;
4585
- }
4586
- .semi-button.semi-button-with-icon-only.semi-button-size-small {
4587
- padding-left: 4px;
4588
- padding-right: 4px;
4589
- padding-top: 4px;
4590
- padding-bottom: 4px;
4591
- height: 24px;
4592
- width: 24px;
4593
- }
4594
- .semi-button.semi-button-with-icon-only.semi-button-size-large {
4595
- padding-left: 12px;
4596
- padding-right: 12px;
4597
- padding-top: 12px;
4598
- padding-bottom: 12px;
4599
- height: 40px;
4600
- width: 40px;
4601
- }
4602
- .semi-button-content-left {
4603
- margin-right: 8px;
4604
- display: flex;
4605
- align-items: center;
4606
- }
4607
- .semi-button-content-right {
4608
- margin-left: 8px;
4609
- display: flex;
4610
- align-items: center;
4611
- }
4612
-
4613
- .semi-rtl .semi-button,
4614
- .semi-portal-rtl .semi-button {
4615
- direction: rtl;
4616
- padding-left: 12px;
4617
- padding-right: 12px;
4618
- }
4619
- .semi-rtl .semi-button-size-small,
4620
- .semi-portal-rtl .semi-button-size-small {
4621
- padding-left: 12px;
4622
- padding-right: 12px;
4623
- }
4624
- .semi-rtl .semi-button-size-large,
4625
- .semi-portal-rtl .semi-button-size-large {
4626
- padding-left: 16px;
4627
- padding-right: 16px;
4628
- }
4629
- .semi-rtl .semi-button-group,
4630
- .semi-portal-rtl .semi-button-group {
4631
- direction: rtl;
4632
- }
4633
- .semi-rtl .semi-button-group > .semi-button,
4634
- .semi-portal-rtl .semi-button-group > .semi-button {
4635
- padding-left: 0;
4636
- padding-right: 0;
4637
- }
4638
- .semi-rtl .semi-button-group > .semi-button .semi-button-content,
4639
- .semi-portal-rtl .semi-button-group > .semi-button .semi-button-content {
4640
- padding-left: 12px;
4641
- padding-right: 12px;
4642
- }
4643
- .semi-rtl .semi-button-group > .semi-button-size-large .semi-button-content,
4644
- .semi-portal-rtl .semi-button-group > .semi-button-size-large .semi-button-content {
4645
- padding-left: 16px;
4646
- padding-right: 16px;
4647
- }
4648
- .semi-rtl .semi-button-group > .semi-button-size-small .semi-button-content,
4649
- .semi-portal-rtl .semi-button-group > .semi-button-size-small .semi-button-content {
4650
- padding-left: 12px;
4651
- padding-right: 12px;
4652
- }
4653
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only,
4654
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only {
4655
- padding-left: 0;
4656
- padding-right: 0;
4657
- }
4658
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content,
4659
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only .semi-button-content {
4660
- padding-left: 8px;
4661
- padding-right: 8px;
4662
- }
4663
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content,
4664
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-small .semi-button-content {
4665
- padding-left: 4px;
4666
- padding-right: 4px;
4667
- }
4668
- .semi-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content,
4669
- .semi-portal-rtl .semi-button-group > .semi-button.semi-button-with-icon-only.semi-button-size-large .semi-button-content {
4670
- padding-left: 12px;
4671
- padding-right: 12px;
4672
- }
4673
- .semi-rtl .semi-button-group > .semi-button:first-child,
4674
- .semi-portal-rtl .semi-button-group > .semi-button:first-child {
4675
- border-top-left-radius: 0;
4676
- border-bottom-left-radius: 0;
4677
- border-top-right-radius: var(--semi-border-radius-small);
4678
- border-bottom-right-radius: var(--semi-border-radius-small);
4679
- }
4680
- .semi-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content,
4681
- .semi-portal-rtl .semi-button-group > .semi-button:not(:last-child) .semi-button-content {
4682
- border-left: 1px var(--semi-color-border) solid;
4683
- border-right: 0;
4684
- }
4685
- .semi-rtl .semi-button-group > .semi-button:last-child,
4686
- .semi-portal-rtl .semi-button-group > .semi-button:last-child {
4687
- border-top-right-radius: 0;
4688
- border-bottom-right-radius: 0;
4689
- border-top-left-radius: var(--semi-border-radius-small);
4690
- border-bottom-left-radius: var(--semi-border-radius-small);
4691
- }
4692
- .semi-rtl .semi-button.semi-button-with-icon-only,
4693
- .semi-portal-rtl .semi-button.semi-button-with-icon-only {
4694
- padding-left: 8px;
4695
- padding-right: 8px;
4696
- }
4697
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small,
4698
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-small {
4699
- padding-left: 4px;
4700
- padding-right: 4px;
4701
- }
4702
- .semi-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large,
4703
- .semi-portal-rtl .semi-button.semi-button-with-icon-only.semi-button-size-large {
4704
- padding-left: 12px;
4705
- padding-right: 12px;
4706
- }
4707
- .semi-rtl .semi-button-content-left,
4708
- .semi-portal-rtl .semi-button-content-left {
4709
- margin-left: 8px;
4710
- margin-right: 0;
4711
- }
4712
- .semi-rtl .semi-button-content-right,
4713
- .semi-portal-rtl .semi-button-content-right {
4714
- margin-right: 8px;
4715
- margin-left: 0;
4716
- }
4717
-
4718
- .semi-input-textarea-wrapper {
4719
- box-sizing: border-box;
4720
- display: inline-block;
4721
- position: relative;
4722
- width: 100%;
4723
- border: 1px transparent solid;
4724
- border-radius: var(--semi-border-radius-small);
4725
- vertical-align: bottom;
4726
- background-color: var(--semi-color-fill-0);
4727
- 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);
4728
- }
4729
- .semi-input-textarea-wrapper-resizeX {
4730
- display: inline-block;
4731
- width: fit-content;
4732
- max-width: 100%;
4733
- }
4734
- .semi-input-textarea-wrapper:hover {
4735
- background-color: var(--semi-color-fill-1);
4736
- }
4737
- .semi-input-textarea-wrapper-focus {
4738
- background-color: var(--semi-color-fill-0);
4739
- border: 1px var(--semi-color-focus-border) solid;
4740
- }
4741
- .semi-input-textarea-wrapper-focus:hover, .semi-input-textarea-wrapper-focus:active {
4742
- background-color: var(--semi-color-fill-0);
4743
- }
4744
- .semi-input-textarea-wrapper:active {
4745
- background-color: var(--semi-color-fill-2);
4746
- }
4747
- .semi-input-textarea-wrapper .semi-input-clearbtn {
4748
- position: absolute;
4749
- top: 0;
4750
- min-width: 24px;
4751
- color: var(--semi-color-text-2);
4752
- right: 4px;
4753
- height: 32px;
4754
- display: flex;
4755
- align-items: center;
4756
- justify-content: center;
4757
- }
4758
- .semi-input-textarea-wrapper .semi-input-clearbtn > svg {
4759
- pointer-events: none;
4760
- }
4761
- .semi-input-textarea-wrapper .semi-input-clearbtn:hover {
4762
- cursor: pointer;
4763
- }
4764
- .semi-input-textarea-wrapper .semi-input-clearbtn:hover .semi-icon {
4765
- color: var(--semi-color-primary-hover);
4766
- }
4767
- .semi-input-textarea-wrapper .semi-input-clearbtn-hidden {
4768
- visibility: hidden;
4769
- }
4770
- .semi-input-textarea-wrapper-disabled, .semi-input-textarea-wrapper-readonly {
4771
- cursor: not-allowed;
4772
- color: var(--semi-color-disabled-text);
4773
- background-color: var(--semi-color-disabled-fill);
4774
- }
4775
- .semi-input-textarea-wrapper-disabled:hover, .semi-input-textarea-wrapper-readonly:hover {
4776
- background-color: var(--semi-color-disabled-fill);
4777
- }
4778
- .semi-input-textarea-wrapper-disabled::placeholder, .semi-input-textarea-wrapper-readonly::placeholder {
4779
- color: var(--semi-color-disabled-text);
4780
- }
4781
- .semi-input-textarea-wrapper-readonly {
4782
- cursor: text;
4783
- }
4784
- .semi-input-textarea-wrapper-error {
4785
- background-color: var(--semi-color-danger-light-default);
4786
- border-color: var(--semi-color-danger-light-default);
4787
- }
4788
- .semi-input-textarea-wrapper-error:hover {
4789
- background-color: var(--semi-color-danger-light-hover);
4790
- border-color: var(--semi-color-danger-light-hover);
4791
- }
4792
- .semi-input-textarea-wrapper-error.semi-input-textarea-wrapper-focus {
4793
- background-color: var(--semi-color-danger-light-default);
4794
- border-color: var(--semi-color-danger);
4795
- }
4796
- .semi-input-textarea-wrapper-error:active {
4797
- background-color: var(--semi-color-danger-light-active);
4798
- border-color: var(--semi-color-danger);
4799
- }
4800
- .semi-input-textarea-wrapper-warning {
4801
- background-color: var(--semi-color-warning-light-default);
4802
- border-color: var(--semi-color-warning-light-default);
4803
- }
4804
- .semi-input-textarea-wrapper-warning:hover {
4805
- background-color: var(--semi-color-warning-light-hover);
4806
- border-color: var(--semi-color-warning-light-hover);
4807
- }
4808
- .semi-input-textarea-wrapper-warning.semi-input-textarea-wrapper-focus {
4809
- background-color: var(--semi-color-warning-light-default);
4810
- border-color: var(--semi-color-warning);
4811
- }
4812
- .semi-input-textarea-wrapper-warning:active {
4813
- background-color: var(--semi-color-warning-light-active);
4814
- border-color: var(--semi-color-warning);
4815
- }
4816
-
4817
- .semi-input-textarea {
4818
- position: relative;
4819
- resize: none;
4820
- padding: 5px 12px;
4821
- box-shadow: none;
4822
- font-size: 14px;
4823
- line-height: 20px;
4824
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4825
- background-color: transparent;
4826
- border: 0 solid transparent;
4827
- vertical-align: bottom;
4828
- width: 100%;
4829
- outline: none;
4830
- cursor: text;
4831
- box-sizing: border-box;
4832
- color: var(--semi-color-text-0);
4833
- }
4834
- .semi-input-textarea:hover {
4835
- border-color: transparent;
4836
- }
4837
- .semi-input-textarea::placeholder {
4838
- color: var(--semi-color-text-2);
4839
- }
4840
- .semi-input-textarea-showClear {
4841
- padding-right: 36px;
4842
- }
4843
- .semi-input-textarea-disabled, .semi-input-textarea-readonly {
4844
- cursor: not-allowed;
4845
- color: var(--semi-color-disabled-text);
4846
- background-color: transparent;
4847
- }
4848
- .semi-input-textarea-disabled:hover, .semi-input-textarea-readonly:hover {
4849
- background-color: transparent;
4850
- }
4851
- .semi-input-textarea-disabled::placeholder, .semi-input-textarea-readonly::placeholder {
4852
- color: var(--semi-color-disabled-text);
4853
- }
4854
- .semi-input-textarea-readonly {
4855
- cursor: text;
4856
- }
4857
- .semi-input-textarea-autosize {
4858
- overflow: hidden;
4859
- resize: none;
4860
- }
4861
- .semi-input-textarea-counter {
4862
- font-size: 12px;
4863
- line-height: 16px;
4864
- font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
4865
- display: flex;
4866
- flex-direction: column;
4867
- justify-content: center;
4868
- padding: 3px 12px 5px 12px;
4869
- min-height: 24px;
4870
- text-align: right;
4871
- color: var(--semi-color-text-2);
4872
- }
4873
- .semi-input-textarea-counter-exceed {
4874
- color: var(--semi-color-danger);
4875
- }
4876
-
4877
- .semi-input-textarea-borderless:not(:focus-within):not(:hover) {
4878
- background-color: transparent;
4879
- border-color: transparent;
4880
- }
4881
- .semi-input-textarea-borderless:focus-within:not(:active) {
4882
- background-color: transparent;
4883
- }
4884
- .semi-input-textarea-borderless.semi-input-textarea-wrapper-error:not(:focus-within) {
4885
- border-color: var(--semi-color-danger);
4886
- }
4887
- .semi-input-textarea-borderless.semi-input-textarea-wrapper-warning:not(:focus-within) {
4888
- border-color: var(--semi-color-warning);
4889
- }
4890
- .semi-input-textarea-borderless.semi-input-textarea-wrapper-error .semi-input-textarea-counter {
4891
- color: var(--semi-color-danger);
4892
- }
4893
- .semi-input-textarea-borderless.semi-input-textarea-wrapper-warning .semi-input-textarea-counter {
4894
- color: var(--semi-color-warning);
4895
- }
4896
-
4897
- .semi-input-textarea-wrapper-withLineNumber {
4898
- display: flex;
4899
- padding: 0;
4900
- align-items: flex-start;
4901
- }
4902
- .semi-input-textarea-wrapper-withLineNumber.semi-input-textarea-wrapper-resizeX {
4903
- display: inline-flex;
4904
- width: fit-content;
4905
- max-width: 100%;
4906
- }
4907
- .semi-input-textarea-wrapper-withLineNumber.semi-input-textarea-wrapper-resizeX .semi-input-textarea-content {
4908
- flex: 0 0 auto;
4909
- }
4910
- .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea-lineNumber {
4911
- flex-shrink: 0;
4912
- padding: 5px 12px;
4913
- background-color: var(--semi-color-fill-1);
4914
- border-right: 1px solid var(--semi-color-border);
4915
- color: var(--semi-color-text-2);
4916
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
4917
- font-size: inherit;
4918
- line-height: 1.5;
4919
- text-align: right;
4920
- user-select: none;
4921
- min-width: 36px;
4922
- border-radius: var(--semi-border-radius-small) 0 0 var(--semi-border-radius-small);
4923
- overflow-y: auto;
4924
- overflow-x: hidden;
4925
- scrollbar-width: none;
4926
- -ms-overflow-style: none;
4927
- }
4928
- .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea-lineNumber::-webkit-scrollbar {
4929
- display: none;
4930
- }
4931
- .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea-content {
4932
- display: flex;
4933
- flex: 1;
4934
- min-width: 0;
4935
- }
4936
- .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea-lineNumber-item {
4937
- display: flex;
4938
- align-items: flex-start;
4939
- justify-content: flex-end;
4940
- box-sizing: border-box;
4941
- }
4942
- .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea {
4943
- border-radius: 0 var(--semi-border-radius-small) var(--semi-border-radius-small) 0;
4944
- line-height: 1.5;
4945
- flex: 1;
4946
- }
4947
-
4948
- .semi-rtl .semi-input-wrapper,
4949
- .semi-portal-rtl .semi-input-wrapper {
4950
- direction: rtl;
4951
- }
4952
- .semi-rtl .semi-input-wrapper__with-prefix .semi-input,
4953
- .semi-portal-rtl .semi-input-wrapper__with-prefix .semi-input {
4954
- padding-left: auto;
4955
- padding-right: 0;
4956
- }
4957
- .semi-rtl .semi-input-wrapper__with-suffix .semi-input,
4958
- .semi-portal-rtl .semi-input-wrapper__with-suffix .semi-input {
4959
- padding-right: auto;
4960
- padding-left: 0;
4961
- }
4962
- .semi-rtl .semi-input,
4963
- .semi-portal-rtl .semi-input {
4964
- padding-left: 12px;
4965
- padding-right: 12px;
4966
- }
4967
- .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
4968
- .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text,
4969
- .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-text,
4970
- .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-text {
4971
- margin-left: auto;
4972
- margin-right: 0;
4973
- }
4974
- .semi-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
4975
- .semi-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon,
4976
- .semi-portal-rtl .semi-input-clearbtn + .semi-rtl .semi-input-suffix + .semi-input-suffix-icon,
4977
- .semi-portal-rtl .semi-input-clearbtn + .semi-portal-rtl .semi-input-suffix + .semi-input-suffix-icon {
4978
- margin-left: auto;
4979
- margin-right: 0;
4980
- }
4981
- .semi-rtl .semi-input-append,
4982
- .semi-portal-rtl .semi-input-append {
4983
- border-left: 0;
4984
- border-right: 1px transparent solid;
4985
- }
4986
- .semi-rtl .semi-input-prepend,
4987
- .semi-portal-rtl .semi-input-prepend {
4988
- border-right: 0;
4989
- border-left: 1px transparent solid;
4990
- }
4991
- .semi-rtl .semi-input-group .semi-select:not(:last-child)::after,
4992
- .semi-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
4993
- .semi-rtl .semi-input-group .semi-tree-select:not(:last-child)::after, .semi-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after,
4994
- .semi-portal-rtl .semi-input-group .semi-select:not(:last-child)::after,
4995
- .semi-portal-rtl .semi-input-group .semi-cascader:not(:last-child)::after,
4996
- .semi-portal-rtl .semi-input-group .semi-tree-select:not(:last-child)::after,
4997
- .semi-portal-rtl .semi-input-group > .semi-input-wrapper:not(:last-child)::after {
4998
- right: auto;
4999
- left: -1px;
5000
- }
5001
- .semi-rtl .semi-input-group .semi-input-number:not(:last-child)::after,
5002
- .semi-portal-rtl .semi-input-group .semi-input-number:not(:last-child)::after {
5003
- right: auto;
5004
- left: -1px;
5005
- }
5006
- .semi-rtl .semi-input-textarea-wrapper,
5007
- .semi-portal-rtl .semi-input-textarea-wrapper {
5008
- direction: rtl;
5009
- }
5010
- .semi-rtl .semi-input-textarea-counter,
5011
- .semi-portal-rtl .semi-input-textarea-counter {
5012
- text-align: left;
5013
- }
5014
- .semi-rtl .semi-input-textarea-showClear,
5015
- .semi-portal-rtl .semi-input-textarea-showClear {
5016
- padding-right: 0;
5017
- padding-left: 36px;
5018
- }
654
+ }