@kaiheila/ui-components 0.1.9 → 0.1.10

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 (3) hide show
  1. package/dist/main.css +1565 -1565
  2. package/dist/ui-components.js +7187 -7187
  3. package/package.json +1 -1
package/dist/main.css CHANGED
@@ -1,1565 +1,1565 @@
1
- input,
2
- textarea {
3
- outline: none;
4
- }
5
- .custom-scroll-bar {
6
- overflow-x: hidden;
7
- overflow-y: scroll;
8
- overflow-y: overlay;
9
- scrollbar-width: thin;
10
- scrollbar-color: var(--color-bbb) transparent;
11
- }
12
- .custom-scroll-bar::-webkit-scrollbar {
13
- width: 0;
14
- }
15
- .custom-scroll-bar:hover::-webkit-scrollbar {
16
- width: 8px;
17
- }
18
- .custom-scroll-bar::-webkit-scrollbar-track {
19
- background-color: transparent;
20
- }
21
- .custom-scroll-bar::-webkit-scrollbar-thumb {
22
- border: 2px solid transparent;
23
- background-color: var(--color-bbb);
24
- border-radius: 4px;
25
- background-clip: content-box;
26
- }
27
-
28
- @font-face {
29
- font-family: "xy-iconfont";
30
- /* Project id 2850126 */
31
- src: url(data:font/woff2;base64,d09GMgABAAAAAAVcAAsAAAAACywAAAUNAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDfAqGbIYGATYCJAMwCxoABCAFhQsHggAb6gkjEaaLciPZPzV50IxBAokg2BjEAI0ZA25YRAUWZsaAIEADJLhAAQAAAABBPMn1ztvdO3/KsdQnVUqJJdXmBuc0U2NHavegPn1AN5nkBJSoAcMtkSVMTxAAS3O2R1R7F2EKm5x90myvlINCclS6WlObCzh2kYBGxyqiDWyQSoT2XWk8oARCl6lSbCtca5yuMvDaCbwEAZzkUo1qbNZA4D1p+NwECMegUQXC+jJp/GA3sLNeTIlAsDutdU80yDYsoNarawBb3beXL6jFDgqLRrtMtzENfeDC+6b3PZp4CPoNNgUBOyvAAmggc2Z+GVceHYH2SzLROPOihmJia4PA+xEez/t+tn7eVcGFEwdLbP/wLBg0CgGxotndYO2yuXbNYOpD6A/ECRgAxAEYCMQOGATEBhgMxAoYAsQCGArEAIYB0YDhQBRgBIwnbJjTCaGAL/AbmYTGHoRDdKIN/kMUYjVut/Hx8fVy2KMSVNLgsVVosKKvt9J68CJE5RhWNuIq1Djb6PWIJBt2yZHbuFo8V7LI0BNSRWTo07jzUqUIGxHcTaRVkMNUzuhGxAq9Bg5utCEQEsaMh1KOgxsfyL3hkT4NehmX9Vd5+agxD3BZIpITiRAZCjyeU0S3xGK58KjXKEeNXm/a7ffJIHK7fa6UR4EhfWDGE/AqG7GHruIXHu3D6XwDfOYTxDYTG/si987eVjTSMzyNXszIGHl+Huzj2d3OhcJylDeWDnpLLIXohWV9wrW34UhLy7VWCxLnXv//X4OrqEiYtH6ZwciXvyGw22N3jo6Z4uiFNED90QInKPB/8N3reRvh15rCGWn9N6851jaya3vI5Mmn+4bU1ob0PX3gf3TSzp2VdsRTkIOS+yVuWpPaV7VcMzSOJjCwjUYsze6SldVlEKkhXYP8kqzeCX7NelXSDx7M6JNhVsKz6b/OP6axRkx0qtKctC5i3TytZu+/+nZude9A1jX3jv4rNSfHuV0vti6Cwtx906dnt/brntqY3NCQ0piy39CQWoQb96f4F25Ibkzt3rcte/r00/ZL3bJl81vLh5eVDp8F/vDSWZYyaJCF4WWcf9mx44xjq1u+7fbZmX+xf03N7W10Xajj2N+PpT9J2qvooWoIQNvVOgB1R2kA1DXhAKAfqXuXscVGbiBqOYA6pNQAup+qG29U9f/uz/DnqvW806f8n11sAHi74o0jvIb6cTvqRdj5U2FQzWGNnAtuk9c/ZmsEcJPOb16kAKeeBI+a9OfdGPEACMOCizVArrARLde4SCKGlUssrApiZTXLnWTQXdfb7ovQiHEAyWyFXAjmqFzhzW25JpiXxLB+0CwcsRArK0LupI+UXcxFsqy97dVjGbGBagVTM0kjPy5rIsz/jWrsS5/qDNE/+mCmwi7Nc8o/kdB3d0iY1D5GCdLzAB/M7bDvGaznFuuY6hjtIctkXlbSmofNq8cyYgPVCqZmknY4LpL65P18oxr70pf3AlX/0QdWh+WBXZrXI592qtvtDDcLk9rHKO0O0vMAH+3C2OslDDZ/uxbrmOoWRfaQEcPJuvZ0fMfwAOYAzo32m91HSrQYsYhVbGIXhzjFJW7x4sFzj0L5kqJgi/QcX9eQRm/iI79p3XPAZ1OLkhSbaXim3O+sd7YMYWbfiKB5joW1aapuTHaMgsahQi8GUMfwlCy2/Ri2A0SSAaVWScDS1zoZqIfMwvsvDsLZAuuu4kWEzQYAAA==) format('woff2'), url(data:font/woff;base64,d09GRgABAAAAAAcEAAsAAAAACywAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAARAAAAGA8bUkyY21hcAAAAYgAAACHAAAB/Oe1tztnbHlmAAACEAAAAngAAANsbGna+2hlYWQAAASIAAAALAAAADYeI/d/aGhlYQAABLQAAAAcAAAAJAfeA41obXR4AAAE0AAAAA8AAAAwMAAAAGxvY2EAAATgAAAAGgAAABoEyAPobWF4cAAABPwAAAAfAAAAIAEZADZuYW1lAAAFHAAAAUcAAAKLddh/+3Bvc3QAAAZkAAAAnQAAAQAqa8CSeJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGFhYJzAwMrAwNTJdIaBgaEfQjO+ZjBi5ACKMrAyM2AFAWmuKQwHnkU8S2Ju+N/AwMB8hwFIMjCiKGICAHgDDRp4nO2RyxHCMAxEn4kJgVAKZ2oBwjcnCqJGtRFWXspAM09j7Ug+7AJroBMHUaG8KWTNUkvTO3ZNrxzbTk095mVRP2XXrEtG7W0Z2NDr16q7VW6Wnn/tW//8pjGdM+19NulzXIycJCYjT4mrkbvEzchn4m4yx3iYTCOeJrONl1Eeys1Qvi5SJW0AeJxtUkFPE0EYnW8KO0zdtrSUXVZ0m93aHUthG4fSDTWuEAsJqCFcakWNSTUGLxyqBziY4EW8yAUOnujBeKE3D3DlxIkD8cAf8Kz/gOq3S4sxcQ5v3zffm7z3zQ4BgivynK6SfkLA00EHiLp78GSisw7v3FZIUHKhG6AfSYSQnEBZbgJ+TKwHQHp9ekIfkCtYMJ0JJjzh6R49abXcvT03RGr2GGL3zDGchWe8spO1bCUDmqT8gDHe2eWMHfRFAatEAlkYIYTv9BRZilh4TgcBmh6nWVt4mk+LIHXmxCmC8GnkVuZ81aStl1Nj24cvlu6vjddnR9SvPbIb7tPTzPlrkw48fLOytTiypo7M1sd/d7+74eZf3zZJkGskh75SNwFtbRfQR7fjkDZB+lBygUktrdhOqUzJq2ePP+XR4vhweyxI4C657tLTANyslPNS0rbIbdXRYnFrBXGz20WoBe15eXn3BNqEYWHJNN5TCQqwXyh0agVo12o9DdD3mA6zaddhMkhRgOEgyh3IBnluw1QQKmXspwwjtW/c6BG6+U8Zkt4//UYlsbEoywx4PphUSQCOHqdOEVgcXFq+C8IpwQof5RsbymAy1tevIOnviyUHA5JMquEOpw7nYUNNJpX/SfkooeEcdXqGc+SDl1aeKglHODZTmJLWNV2blB7a+9TJ4dWXfJAmpOMQudcs5kV17stc9Sau6tzyo8WmalkG550Plcb0dONto1JpfG4u1Jd7EtSKfLGpcm5Y1kIFFReyy/ccqdIqGcZCuDivFjxND3wcWWEARzuqZRs8GjtKlVMwE4tyw7bUzk+4utPlR0NDMNMVdX6RPyUhoDV4nGNgZGBgAGLmo/0n4vltvjJwszCAwN2mm9eQaRYGJhDNwcAE4gEAQAkK0nicY2BkYGBu+N/AEMPCAAJAkpEBFfAAAEcSAnV4nGNhYGBgIQEDAAUQADEAAAAAAAAUACQAPgBYAJQA0gDkAQ4BSAGMAbYAAHicY2BkYGDgYdBiYGYAASYg5gJCBob/YD4DAA3tAVAAeJx10btuwjAUBuA/3KqC1KGVWCpVXspSES4jHZFgLgM7BIeLkjhyDAKpe8c+TZ+iT9Clr9BX6E84SIjSRLY+/z7HsRQAt/iGh8Nzx3GwhxpXBxdwhQdxkfmjuES3xWX6WVyhB+IqnvAi3p/4yhO80jVXDbyLPdTxIS7gBp/iIvMvcYn+EZdR98riCn0vrmLsdcQ1NLy3vtUTp2dqulPLwCShSdx21zxypOfraGJPkhOOtc2WJlEdv32SDnWi7fHIbDPvOheq0JpYDbiro8io1JqVDpy/cC7ttVqh5H5gYvRhoTGB4zyDwhQ7zksEMEgQ5rPDlmnzTzpizxxrROy3/9RcTsfstMiY79cKHfj8bZdrh6xN8vrzW2bY8Ptdpo7VisOyJ6YG0qt5t4hWSPO9FZOAuY9F3pWihxbf8Kzez+8Q/wIYYnd7AHicbY1bDoIwEEU7+EbwwZebYDGuoCmloY0w03Ro0N0L4UOM3r97zk2uSMScVPxPBgmsYA0b2MIO9nCAFI6QQS7OgVojm6Cwl+QNFovu0Jrg+ssC6ZbYFE5Lhc0IaxpwMq/cK+aBQi3Z0vBp1tXjHH3sJcauMkF2DiNfv5BvI9+mk7IzEyjZqKBtOZ/9itOdWGpr9KOip2Qh3lWbTLAAAAA=) format('woff'), url(data:font/ttf;base64,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KCgoKERFUVdKcgwhIRkJCf6GOmI5OWJ0Yjo6YphySVhRRUQoKCgoREWjRUQnKS9yDAkJGSEhSTpidGI5OWJ0YjoAAAAAAQAAAAADRAJEABUAAAEnLgEOAhYfARYyNwE+AS4CBgcBAcCTDCEiGQkKDcASNhIBQA0KCRkiIQz+7QEakw0KCRkiIQzAExMBQAwhIhkJCg3+7gAAAAASAN4AAQAAAAAAAAATAAAAAQAAAAAAAQALABMAAQAAAAAAAgAHAB4AAQAAAAAAAwALACUAAQAAAAAABAALADAAAQAAAAAABQALADsAAQAAAAAABgALAEYAAQAAAAAACgArAFEAAQAAAAAACwATAHwAAwABBAkAAAAmAI8AAwABBAkAAQAWALUAAwABBAkAAgAOAMsAAwABBAkAAwAWANkAAwABBAkABAAWAO8AAwABBAkABQAWAQUAAwABBAkABgAWARsAAwABBAkACgBWATEAAwABBAkACwAmAYdDcmVhdGVkIGJ5IGljb25mb250eHktaWNvbmZvbnRSZWd1bGFyeHktaWNvbmZvbnR4eS1pY29uZm9udFZlcnNpb24gMS4weHktaWNvbmZvbnRHZW5lcmF0ZWQgYnkgc3ZnMnR0ZiBmcm9tIEZvbnRlbGxvIHByb2plY3QuaHR0cDovL2ZvbnRlbGxvLmNvbQBDAHIAZQBhAHQAZQBkACAAYgB5ACAAaQBjAG8AbgBmAG8AbgB0AHgAeQAtAGkAYwBvAG4AZgBvAG4AdABSAGUAZwB1AGwAYQByAHgAeQAtAGkAYwBvAG4AZgBvAG4AdAB4AHkALQBpAGMAbwBuAGYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAHgAeQAtAGkAYwBvAG4AZgBvAG4AdABHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAIAAAAAAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAECAQMBBAEFAQYBBwEIAQkBCgELAQwBDQAPcm9sZV9ncmFudF9vcGVuEnJvbGVfZ3JhbnRfaW5oZXJpdBByb2xlX2dyYW50X2Nsb3NlEmljX2FuZ2xlX2Rvd25fZ3JheQ1wYXNzd29yZF9zaG93DXBhc3N3b3JkX2hpZGUSaW5wdXRfbnVtYmVyX21pbnVzEWlucHV0X251bWJlcl9wbHVzGHJvbGUtbWVtYmVyLXNlYXJjaC1jbG9zZRJyb2xlLW1lbWJlci1zZWFyY2gOUW9zX2NoZWNrYm94X3MAAA==) format('truetype');
32
- }
33
- .xy-iconfont {
34
- font-family: "xy-iconfont" !important;
35
- font-size: 16px;
36
- font-style: normal;
37
- -webkit-font-smoothing: antialiased;
38
- -moz-osx-font-smoothing: grayscale;
39
- }
40
- .xy-icon-role_grant_open:before {
41
- content: "\e662";
42
- }
43
- .xy-icon-role_grant_inherit:before {
44
- content: "\e661";
45
- }
46
- .xy-icon-role_grant_close:before {
47
- content: "\e660";
48
- }
49
- .xy-icon-ic_angle_down_gray:before {
50
- content: "\e65f";
51
- }
52
- .xy-icon-password_show:before {
53
- content: "\e65e";
54
- }
55
- .xy-icon-password_hide:before {
56
- content: "\e65d";
57
- }
58
- .xy-icon-input_number_minus:before {
59
- content: "\e65c";
60
- }
61
- .xy-icon-input_number_plus:before {
62
- content: "\e65b";
63
- }
64
- .xy-icon-role-member-search-close:before {
65
- content: "\e65a";
66
- }
67
- .xy-icon-role-member-search:before {
68
- content: "\e659";
69
- }
70
- .xy-icon-Qos_checkbox_s:before {
71
- content: "\e658";
72
- }
73
-
74
- @keyframes loaderSpin {
75
- 0% {
76
- -webkit-transform: rotate(0);
77
- transform: rotate(0);
78
- }
79
- to {
80
- -webkit-transform: rotate(1turn);
81
- transform: rotate(1turn);
82
- }
83
- }
84
- .kaihei-loading-spin {
85
- width: 18px;
86
- height: 18px;
87
- display: inline-block;
88
- position: relative;
89
- }
90
- .kaihei-loading-spin:before,
91
- .kaihei-loading-spin:after {
92
- box-sizing: border-box;
93
- width: 100%;
94
- height: 100%;
95
- content: "";
96
- position: absolute;
97
- left: 0;
98
- right: 0;
99
- display: block;
100
- border-radius: 50%;
101
- }
102
- .kaihei-loading-spin:before {
103
- border: 3px solid var(--border-color);
104
- }
105
- .kaihei-loading-spin:after {
106
- animation-duration: 0.6s;
107
- border: 3px solid transparent;
108
- border-top-color: var(--text-tip-color);
109
- -webkit-animation: loaderSpin 0.6s linear infinite;
110
- animation: loaderSpin 0.6s linear infinite;
111
- }
112
- .kaihei-loading-spin.block-loading-spin {
113
- display: block;
114
- margin-left: auto;
115
- margin-right: auto;
116
- }
117
- .kaihei-image-loading-spin {
118
- display: inline-block;
119
- position: relative;
120
- height: 16px;
121
- width: 27px;
122
- margin-left: -12px / 2;
123
- }
124
- .kaihei-image-loading-spin:before,
125
- .kaihei-image-loading-spin:after {
126
- content: "";
127
- display: block;
128
- height: 12px;
129
- width: 12px;
130
- position: absolute;
131
- border-radius: 50%;
132
- }
133
- .kaihei-image-loading-spin:before {
134
- animation: k-loadingK 1.2s linear infinite, k-loadingM 1.2s linear infinite;
135
- background: #666ccc;
136
- }
137
- .kaihei-image-loading-spin:after {
138
- animation: k-loadingL 1.2s linear infinite, k-loadingN 1.2s linear infinite;
139
- background: #ff9900;
140
- }
141
- @keyframes k-loadingK {
142
- 0% {
143
- left: 0;
144
- transform: scale(1);
145
- }
146
- 25% {
147
- transform: scale(1.25);
148
- }
149
- 50% {
150
- left: 100%;
151
- transform: scale(1);
152
- }
153
- 75% {
154
- transform: scale(0.75);
155
- }
156
- 100% {
157
- left: 0;
158
- transform: scale(1);
159
- }
160
- }
161
- @keyframes k-loadingL {
162
- 0% {
163
- left: 100%;
164
- transform: scale(1);
165
- }
166
- 25% {
167
- transform: scale(0.75);
168
- }
169
- 50% {
170
- left: 0;
171
- transform: scale(1);
172
- }
173
- 75% {
174
- transform: scale(1.25);
175
- }
176
- 100% {
177
- left: 100%;
178
- transform: scale(1);
179
- }
180
- }
181
- @keyframes k-loadingN {
182
- 0% {
183
- z-index: 0;
184
- }
185
- 25% {
186
- z-index: 0;
187
- }
188
- 50% {
189
- z-index: 1;
190
- }
191
- 75% {
192
- z-index: 1;
193
- }
194
- 100% {
195
- z-index: 0;
196
- }
197
- }
198
- @keyframes k-loadingM {
199
- 0% {
200
- z-index: 1;
201
- }
202
- 25% {
203
- z-index: 1;
204
- }
205
- 50% {
206
- z-index: 0;
207
- }
208
- 75% {
209
- z-index: 0;
210
- }
211
- 100% {
212
- z-index: 1;
213
- }
214
- }
215
-
216
- @keyframes rotate {
217
- from {
218
- transform: translate(-50%, -50%) rotate(0deg);
219
- }
220
- to {
221
- transform: translate(-50%, -50%) rotate(360deg);
222
- }
223
- }
224
- .chuanyu-button {
225
- position: relative;
226
- color: #ffffff;
227
- text-align: center;
228
- outline: none;
229
- border: 0 none;
230
- /*按钮大小*/
231
- /*按钮颜色样式*/
232
- }
233
- .chuanyu-button.disabled,
234
- .chuanyu-button:disabled {
235
- cursor: not-allowed;
236
- }
237
- .chuanyu-button.size-xs {
238
- font-size: 12px;
239
- height: 24px;
240
- padding: 0 8px;
241
- line-height: 24px;
242
- border-radius: 8px;
243
- }
244
- .chuanyu-button.size-sm {
245
- height: 32px;
246
- min-width: 80px;
247
- font-size: 14px;
248
- padding: 0 12px;
249
- border-radius: 8px;
250
- line-height: 32px;
251
- }
252
- .chuanyu-button.size-md {
253
- height: 36px;
254
- min-width: 80px;
255
- font-size: 14px;
256
- padding: 0 12px;
257
- border-radius: 12px;
258
- }
259
- .chuanyu-button.size-lg {
260
- height: 40px;
261
- min-width: 88px;
262
- font-size: 14px;
263
- padding: 0 16px;
264
- border-radius: 12px;
265
- }
266
- .chuanyu-button.block-button {
267
- width: 100%;
268
- display: block;
269
- }
270
- .chuanyu-button.block-button.size-md {
271
- font-weight: bold;
272
- font-size: 14px;
273
- }
274
- .chuanyu-button.block-button.size-sm {
275
- font-size: 16px;
276
- }
277
- .chuanyu-button.type-primary {
278
- background-color: var(--color-primary);
279
- }
280
- .chuanyu-button.type-primary:not(.disabled):hover {
281
- background-color: var(--color-primary-hover);
282
- }
283
- .chuanyu-button.type-primary:not(.disabled):active {
284
- background-color: var(--color-primary-active);
285
- }
286
- .chuanyu-button.type-primary:disabled {
287
- opacity: 0.5;
288
- background-color: var(--color-primary);
289
- }
290
- .chuanyu-button.type-simple-primary {
291
- background-color: transparent;
292
- color: var(--color-primary);
293
- }
294
- .chuanyu-button.type-simple-primary:hover {
295
- background-color: var(--color-primary);
296
- color: #fff;
297
- }
298
- .chuanyu-button.type-simple-primary:active {
299
- background-color: var(--color-primary-active);
300
- color: #fff;
301
- }
302
- .chuanyu-button.type-appprimary {
303
- background-color: var(--color-primary);
304
- }
305
- .chuanyu-button.type-appprimary:not(.disabled):hover {
306
- background-color: var(--color-primary-hover);
307
- }
308
- .chuanyu-button.type-appprimary:active {
309
- background-color: var(--color-primary-active);
310
- }
311
- .chuanyu-button.type-appprimary:disabled {
312
- opacity: 0.5;
313
- background-color: var(--color-primary);
314
- }
315
- .chuanyu-button.type-danger {
316
- background-color: var(--color-error);
317
- }
318
- .chuanyu-button.type-danger:hover {
319
- background-color: var(--color-error-hover);
320
- }
321
- .chuanyu-button.type-danger:active {
322
- background-color: var(--color-error-active);
323
- }
324
- .chuanyu-button.type-danger:disabled {
325
- opacity: 0.5;
326
- background-color: var(--color-error);
327
- }
328
- .chuanyu-button.type-success {
329
- background-color: var(--color-success);
330
- }
331
- .chuanyu-button.type-success:hover {
332
- background-color: var(--color-success-hover);
333
- }
334
- .chuanyu-button.type-success:active {
335
- background-color: var(--color-success-active);
336
- }
337
- .chuanyu-button.type-success:disabled {
338
- opacity: 0.5;
339
- background-color: var(--color-success);
340
- }
341
- .chuanyu-button.type-warning {
342
- background-color: var(--color-warn);
343
- }
344
- .chuanyu-button.type-warning:hover {
345
- background-color: var(--color-warn-hover);
346
- }
347
- .chuanyu-button.type-warning:active {
348
- background-color: var(--color-warn-active);
349
- }
350
- .chuanyu-button.type-warning:disabled {
351
- opacity: 0.5;
352
- background-color: var(--color-warn);
353
- }
354
- .chuanyu-button.type-simple {
355
- background-color: var(--button-simple);
356
- color: var(--text-description-color);
357
- }
358
- .chuanyu-button.type-simple:not(.disabled):hover {
359
- background-color: var(--button-simple-hover);
360
- }
361
- .chuanyu-button.type-simple:not(.disabled):active {
362
- background-color: var(--button-simple-active);
363
- }
364
- .chuanyu-button.type-simple:disabled {
365
- opacity: 0.5;
366
- background-color: transparent;
367
- }
368
- .chuanyu-button.type-default {
369
- color: var(--text-description-color);
370
- background-color: var(--button-default);
371
- }
372
- .chuanyu-button.type-default:hover {
373
- background-color: var(--button-default-hover);
374
- }
375
- .chuanyu-button.type-default:active {
376
- background-color: var(--button-default-active);
377
- }
378
- .chuanyu-button.type-default:disabled {
379
- cursor: not-allowed;
380
- opacity: 0.5;
381
- background: rgba(187, 190, 196, 0.3);
382
- }
383
- .chuanyu-button.type-ghost {
384
- color: var(--text-description-color);
385
- background-color: var(--button-simple);
386
- border: 1px solid var(--border-color);
387
- }
388
- .chuanyu-button.type-ghost:not(.disabled):hover {
389
- background-color: var(--button-simple-hover);
390
- }
391
- .chuanyu-button.type-ghost:not(.disabled):active {
392
- background-color: var(--button-simple-active);
393
- }
394
- .chuanyu-button.type-ghost:disabled {
395
- cursor: not-allowed;
396
- opacity: 0.5;
397
- }
398
- .chuanyu-button.type-ghost-danger {
399
- color: var(--color-error);
400
- border-color: var(--color-error);
401
- border-width: 1px;
402
- border-style: solid;
403
- }
404
- .chuanyu-button.type-ghost-danger:hover {
405
- color: var(--color-error-hover);
406
- border-color: var(--color-error-hover);
407
- }
408
- .chuanyu-button.type-ghost-danger:active {
409
- color: var(--color-error-hover);
410
- border-color: var(--color-error-hover);
411
- }
412
- .chuanyu-button.type-simple-danger {
413
- color: var(--color-error);
414
- background-color: transparent;
415
- border: 1px solid rgba(228, 75, 77);
416
- }
417
- .chuanyu-button.type-simple-danger:hover {
418
- border: 1px solid rgba(230, 93, 95);
419
- }
420
- .chuanyu-button.type-simple-danger:active {
421
- background-color: rgba(228, 75, 77, 0.1);
422
- }
423
- .chuanyu-button.loading .loading-ico {
424
- position: absolute;
425
- top: 50%;
426
- left: 50%;
427
- display: block;
428
- animation: rotate 1s linear infinite;
429
- }
430
- .chuanyu-button.loading .button-text {
431
- visibility: hidden;
432
- }
433
- .chuanyu-button.loading .btn-loading-ico {
434
- position: absolute;
435
- top: 50%;
436
- left: 50%;
437
- display: block;
438
- transform: translate(-50%, -50%);
439
- height: 18px;
440
- width: 18px;
441
- line-height: 1;
442
- }
443
- .size-sm .button-loading-spin {
444
- transform-origin: 50%;
445
- transform: scale(0.9);
446
- }
447
- .buttons-group .chuanyu-button:not(:first-child) {
448
- margin-left: 8px;
449
- }
450
-
451
- .kaihei-checkbox {
452
- position: relative;
453
- display: inline-block;
454
- width: 18px;
455
- height: 18px;
456
- border-width: 2px;
457
- border-style: solid;
458
- border-radius: 4px;
459
- border-color: var(--border-color);
460
- margin-right: 10px;
461
- vertical-align: middle;
462
- box-sizing: border-box;
463
- }
464
- .kaihei-checkbox.active {
465
- display: inline-flex;
466
- justify-content: center;
467
- align-items: center;
468
- border-color: white;
469
- }
470
- .kaihei-checkbox.active:after {
471
- position: absolute;
472
- top: 2px;
473
- left: 2px;
474
- content: "";
475
- width: 10px;
476
- height: 10px;
477
- background-color: white;
478
- border-radius: 2px;
479
- }
480
- .kaihei-checkbox.disabled {
481
- opacity: 0.5;
482
- cursor: not-allowed;
483
- }
484
- .theme-light .kaihei-checkbox.active {
485
- border-color: var(--color-primary);
486
- }
487
- .theme-light .kaihei-checkbox.active:after {
488
- background-color: var(--color-primary);
489
- }
490
- .checkbox-box {
491
- display: inline-flex;
492
- align-items: center;
493
- }
494
- .kaihei-checkbox-mute {
495
- display: inline-block;
496
- width: 16px;
497
- height: 16px;
498
- font-size: 14px;
499
- line-height: 14px;
500
- color: var(--text-tip-color);
501
- border: 2px solid var(--text-tip-color);
502
- border-radius: 4px;
503
- margin-right: 8px;
504
- vertical-align: middle;
505
- box-sizing: border-box;
506
- }
507
- .kaihei-checkbox-mute.active {
508
- display: inline-flex;
509
- justify-content: center;
510
- align-items: center;
511
- }
512
- .kaihei-checkbox-mute.active.type-appprimary {
513
- border-color: var(--color-primary);
514
- background-color: var(--color-primary);
515
- }
516
- .kaihei-checkbox-mute.active.type-danger {
517
- border-color: var(--color-error);
518
- background-color: var(--color-error);
519
- }
520
- .kaihei-checkbox-mute.active:before {
521
- color: white;
522
- }
523
- .kaihei-checkbox-mute.disabled {
524
- opacity: 0.5;
525
- cursor: not-allowed;
526
- }
527
-
528
- .arc-progress-wrapper {
529
- position: absolute;
530
- top: 0;
531
- left: 0;
532
- width: 100%;
533
- height: 100%;
534
- display: flex;
535
- align-items: center;
536
- justify-content: center;
537
- background-color: rgba(0, 0, 0, 0.4);
538
- }
539
- .arc-progress-wrapper .arc-progress-track {
540
- stroke: rgba(255, 255, 255, 0.4);
541
- }
542
- .arc-progress-wrapper .arc-progress-bar {
543
- stroke: #fff;
544
- }
545
-
546
- .friendship-level {
547
- display: flex;
548
- color: var(--color-error);
549
- }
550
- .friendship-level.minus {
551
- color: var(--text-description-color);
552
- }
553
- .friendship-level .friendship-item {
554
- width: 14px;
555
- height: 14px;
556
- margin-left: 2px;
557
- display: inline-block;
558
- }
559
- .friendship-level .friendship-item svg {
560
- width: 100%;
561
- height: 100%;
562
- }
563
- .friendship-level.md {
564
- width: 16px;
565
- height: 16px;
566
- margin-left: 4px;
567
- }
568
-
569
- /*
570
- * input基本样式
571
- */
572
- .chuanyu-input {
573
- outline: none;
574
- width: 276px;
575
- height: 40px;
576
- padding: 0 16px;
577
- border-radius: 12px;
578
- background-color: var(--color-f2f);
579
- color: var(--main-color);
580
- font-size: 14px;
581
- border: 1px solid transparent;
582
- }
583
- .chuanyu-input.ghost {
584
- background-color: transparent;
585
- border-color: var(--border-color);
586
- }
587
- .chuanyu-input:hover {
588
- border-color: var(--border-hover-color);
589
- }
590
- .chuanyu-input:focus {
591
- border-color: var(--border-hover-color);
592
- box-shadow: 0 0 0 3px var(--border-active-color);
593
- }
594
- .chuanyu-input.block {
595
- width: 100%;
596
- }
597
- .chuanyu-input::placeholder {
598
- color: var(--text-tip-color);
599
- }
600
- .chuanyu-input:-webkit-autofill {
601
- -webkit-text-fill-color: #fff !important;
602
- transition: background-color 5000s ease-in-out 0s;
603
- font-size: 14px;
604
- -webkit-text-fill-color: white;
605
- }
606
- .chuanyu-input:-webkit-autofill:hover,
607
- .chuanyu-input:-webkit-autofill:focus,
608
- .chuanyu-input:-webkit-autofill:active {
609
- font-size: 14px;
610
- }
611
- /*
612
- * input后缀
613
- */
614
- .suffix-input-wrapper {
615
- position: relative;
616
- }
617
- .suffix-input-wrapper .suffix-content {
618
- position: absolute;
619
- right: 0;
620
- top: 0;
621
- height: 100%;
622
- display: flex;
623
- align-items: center;
624
- text-align: right;
625
- padding-right: 10px;
626
- color: #ffffff;
627
- font-size: 14px;
628
- }
629
- .suffix-input-wrapper .chuanyu-input {
630
- padding-right: 93px;
631
- }
632
- .normal-input {
633
- height: 40px;
634
- width: 100%;
635
- padding: 0 16px;
636
- text-align: left;
637
- border: 1px solid var(--border-color);
638
- border-radius: 12px;
639
- font-size: 14px;
640
- }
641
- .normal-input.noTheme {
642
- border-color: transparent;
643
- background-color: #f2f3f5;
644
- }
645
- .normal-input:hover {
646
- border-color: var(--border-hover-color);
647
- }
648
- .normal-input:focus {
649
- border-color: var(--border-hover-color);
650
- box-shadow: 0 0 0 3px var(--border-active-color);
651
- }
652
- .normal-input::placeholder {
653
- color: var(--text-tip-color);
654
- }
655
- .normal-input:disabled {
656
- opacity: 0.5;
657
- cursor: not-allowed;
658
- border-color: var(--border-color);
659
- }
660
- .passowrd-input {
661
- position: relative;
662
- }
663
- .passowrd-input input {
664
- height: 40px;
665
- line-height: 14px;
666
- font-size: 14px;
667
- padding: 0 16px;
668
- text-align: left;
669
- border: 1px solid var(--border-color);
670
- width: 100%;
671
- border-radius: 12px;
672
- }
673
- .passowrd-input input::placeholder {
674
- color: var(--text-tip-color);
675
- }
676
- .passowrd-input .switch-btn {
677
- position: absolute;
678
- top: 50%;
679
- transform: translateY(-50%);
680
- right: 12px;
681
- font-size: 20px;
682
- color: var(--text-tip-color);
683
- }
684
- .normal-textarea {
685
- height: 105px;
686
- font-size: 14px;
687
- padding: 10px 16px;
688
- width: 100%;
689
- outline: none;
690
- border-radius: 12px;
691
- border: 1px solid var(--border-color);
692
- }
693
- .normal-textarea:hover {
694
- border-color: var(--border-hover-color);
695
- }
696
- .normal-textarea:focus {
697
- border-color: var(--border-hover-color);
698
- box-shadow: 0 0 0 3px var(--border-active-color);
699
- }
700
- .normal-textarea:disabled {
701
- opacity: 0.5;
702
- cursor: not-allowed;
703
- border-color: var(--border-color);
704
- }
705
- .normal-textarea::placeholder {
706
- color: var(--text-tip-color);
707
- }
708
- .search-input {
709
- position: relative;
710
- display: flex;
711
- align-items: center;
712
- padding: 0 16px;
713
- height: 40px;
714
- font-size: 14px;
715
- border-radius: 12px;
716
- border: 1px solid var(--border-color);
717
- }
718
- .search-input.noborder {
719
- border-color: transparent;
720
- background-color: var(--color-f2f);
721
- }
722
- .search-input:hover {
723
- border-color: var(--border-hover-color);
724
- }
725
- .search-input.active {
726
- border-color: var(--border-hover-color);
727
- box-shadow: 0 0 0 3px var(--border-active-color);
728
- }
729
- .search-input input {
730
- flex: 1;
731
- min-width: 0;
732
- height: 100%;
733
- border: none;
734
- background: transparent;
735
- color: var(--text-color);
736
- }
737
- .search-input input::placeholder {
738
- color: var(--text-tip-color);
739
- }
740
- .search-input .button-clear,
741
- .search-input .button-search {
742
- display: flex;
743
- margin-left: 16px;
744
- width: 24px;
745
- height: 24px;
746
- font-size: 24px;
747
- color: var(--text-tip-color);
748
- cursor: pointer;
749
- }
750
- .search-input .button-clear:hover,
751
- .search-input .button-search:hover {
752
- color: var(--text-description-color);
753
- }
754
- .search-input .button-clear:active,
755
- .search-input .button-search:active {
756
- color: var(--text-color);
757
- }
758
- .search-input .button-clear svg,
759
- .search-input .button-search svg {
760
- width: 24px;
761
- height: 24px;
762
- }
763
- .search-input.sm {
764
- height: 32px;
765
- padding: 0 8px;
766
- }
767
- .search-input.sm .button-clear,
768
- .search-input.sm .button-search {
769
- margin-left: 8px;
770
- }
771
- .number-input {
772
- display: flex;
773
- }
774
- .number-input input {
775
- color: var(--text-color);
776
- border: none;
777
- padding: 0px 8px 0;
778
- width: 42px;
779
- height: 24px;
780
- font-size: 14px;
781
- text-align: center;
782
- vertical-align: bottom;
783
- background-color: transparent;
784
- }
785
- .number-input .xy-iconfont {
786
- display: inline-block;
787
- width: 24px;
788
- height: 24px;
789
- border-radius: 6px;
790
- background-color: var(--color-ede);
791
- font-size: 24px;
792
- color: var(--text-description-color);
793
- text-align: center;
794
- line-height: 24px;
795
- cursor: pointer;
796
- }
797
- .number-input .xy-iconfont:not(.disabled):hover {
798
- color: var(--text-color);
799
- }
800
- .number-input .xy-iconfont.disabled {
801
- opacity: 0.5;
802
- cursor: not-allowed;
803
- }
804
-
805
- .number-step {
806
- display: flex;
807
- width: 110px;
808
- height: 28px;
809
- line-height: 28px;
810
- font-size: 14px;
811
- border-radius: 4px;
812
- border: 1px solid var(--border-color);
813
- color: var(--text-color);
814
- }
815
- .number-step button {
816
- height: 24px;
817
- width: 32px;
818
- text-align: center;
819
- font-size: 18px;
820
- font-weight: bold;
821
- border: none;
822
- background-color: transparent;
823
- color: var(--text-color);
824
- }
825
- .number-step button:disabled {
826
- color: var(--text-tip-color);
827
- }
828
- .number-step .value-label {
829
- flex: 1;
830
- }
831
-
832
- .kaihei-radio {
833
- width: 16px;
834
- height: 16px;
835
- border-radius: 50%;
836
- display: inline-flex;
837
- flex-shrink: 0;
838
- justify-content: center;
839
- align-items: center;
840
- position: relative;
841
- border: 2px solid var(--text-tip-color);
842
- }
843
- .kaihei-radio.checked {
844
- border-color: var(--color-primary);
845
- }
846
- .kaihei-radio.checked::after {
847
- position: absolute;
848
- content: "";
849
- width: 8px;
850
- height: 8px;
851
- background-color: var(--color-primary);
852
- border-radius: 50%;
853
- }
854
- .form-item-radio {
855
- display: flex;
856
- align-items: center;
857
- }
858
- .form-item-radio .label {
859
- display: inline-block;
860
- }
861
-
862
- .selector-contain {
863
- position: relative;
864
- font-size: 14px;
865
- color: var(--text-color);
866
- }
867
- .selector-contain[disabled] {
868
- opacity: 0.5;
869
- }
870
- .selector-contain[disabled] .selector-select {
871
- cursor: not-allowed;
872
- }
873
- .selector-contain[disabled] .selector-select:hover {
874
- border-color: var(--border-color);
875
- }
876
- .selector-contain[disabled] .selector-select:active {
877
- box-shadow: none;
878
- }
879
- .selector-contain.size-sm {
880
- width: 220px;
881
- }
882
- .selector-contain.size-md {
883
- width: 320px;
884
- }
885
- .selector-contain.type-ghost {
886
- color: var(--text-description-color);
887
- }
888
- .selector-contain.type-ghost .selector-select {
889
- padding: 6px 32px 6px 12px;
890
- border-radius: 16px;
891
- border-width: 0;
892
- background-color: var(--menu-background);
893
- }
894
- .selector-contain.simple .selector-select {
895
- border: none;
896
- padding: 0 30px 0 0;
897
- line-height: 1;
898
- box-shadow: none;
899
- color: var(--text-description-color);
900
- }
901
- .selector-contain.simple .selector-select:hover,
902
- .selector-contain.simple .selector-select.active {
903
- border-color: transparent;
904
- box-shadow: none;
905
- color: var(--text-color);
906
- }
907
- .selector-option.simple {
908
- margin-left: 50%;
909
- margin-top: 10px;
910
- transform: translate(-50%);
911
- width: 220px;
912
- padding: 10px;
913
- border-radius: 12px;
914
- border: none;
915
- }
916
- .selector-option.simple .selector-option-item {
917
- border-radius: 8px;
918
- }
919
- .selector-option.simple .selector-option-item.selected {
920
- background-color: transparent;
921
- }
922
- .selector-option.simple .selector-option-item:hover {
923
- background-color: var(--menu-hover);
924
- }
925
- .selector-select {
926
- display: flex;
927
- position: relative;
928
- width: 100%;
929
- padding: 9px 35px 9px 16px;
930
- border: 1px solid var(--border-color);
931
- border-radius: 12px;
932
- cursor: pointer;
933
- }
934
- .selector-select:hover {
935
- border-color: var(--border-hover-color);
936
- }
937
- .selector-select:active,
938
- .selector-select.active:not([disabled]) {
939
- border-color: var(--border-hover-color);
940
- box-shadow: 0 0 0 3px var(--border-active-color);
941
- }
942
- .selector-select.active .dropdown-icon {
943
- transform: translateY(-50%) rotate(180deg);
944
- }
945
- .selector-select .selector-label {
946
- display: inline-block;
947
- width: 100%;
948
- white-space: nowrap;
949
- overflow: hidden;
950
- text-overflow: ellipsis;
951
- vertical-align: middle;
952
- line-height: 20px;
953
- }
954
- .selector-select .selector-label .emoji {
955
- height: 15px;
956
- display: inline-block;
957
- margin-top: -3px;
958
- }
959
- .selector-select .dropdown-icon {
960
- position: absolute;
961
- display: flex;
962
- top: 50%;
963
- transform: translateY(-50%);
964
- right: 10px;
965
- font-size: 24px;
966
- transition: transform 0.2s;
967
- }
968
- .selector-select .dropdown-icon svg {
969
- width: 24px;
970
- height: 24px;
971
- }
972
- .selector-option {
973
- position: absolute;
974
- width: 100%;
975
- margin-top: 4px;
976
- border-radius: 12px;
977
- padding: 8px;
978
- z-index: 1000;
979
- max-height: 240px;
980
- overflow-y: auto;
981
- background-color: var(--color-grey-bg);
982
- box-shadow: var(--box-shadow);
983
- }
984
- .selector-option.fixed {
985
- position: fixed;
986
- }
987
- .ab-shadow {
988
- position: absolute;
989
- width: 100%;
990
- }
991
- .selector-option-item {
992
- padding: 0 8px;
993
- height: 32px;
994
- line-height: 32px;
995
- white-space: nowrap;
996
- overflow: hidden;
997
- text-overflow: ellipsis;
998
- cursor: pointer;
999
- border-radius: 8px;
1000
- margin-bottom: 2px;
1001
- }
1002
- .selector-option-item:last-child {
1003
- margin-bottom: 0;
1004
- }
1005
- .selector-option-item:hover {
1006
- background-color: var(--menu-hover);
1007
- }
1008
- .selector-option-item:active {
1009
- background-color: var(--menu-active);
1010
- }
1011
- .selector-option-item.selected {
1012
- background-color: var(--menu-active);
1013
- }
1014
- .selector-option-item .emoji {
1015
- height: 14px;
1016
- display: inline-block;
1017
- margin-top: -3px;
1018
- }
1019
-
1020
- .selector-search-contain {
1021
- position: relative;
1022
- font-size: 14px;
1023
- color: var(--text-color);
1024
- }
1025
- .selector-search-select {
1026
- position: relative;
1027
- width: 100%;
1028
- padding: 9px 35px 9px 16px;
1029
- border-radius: 12px;
1030
- border: 1px solid var(--border-color);
1031
- }
1032
- .selector-search-select:hover {
1033
- border-color: var(--border-hover-color);
1034
- }
1035
- .selector-search-select:active,
1036
- .selector-search-select.active {
1037
- border-color: var(--border-hover-color);
1038
- box-shadow: 0 0 0 3px var(--border-active-color);
1039
- }
1040
- .selector-search-select:active .dropdown-icon,
1041
- .selector-search-select.active .dropdown-icon {
1042
- transform: translateY(-50%) rotate(180deg);
1043
- }
1044
- .selector-search-select .selector-search-label {
1045
- position: absolute;
1046
- top: 50%;
1047
- transform: translateY(-50%);
1048
- left: 16px;
1049
- display: inline-block;
1050
- width: calc(100% - 44px);
1051
- white-space: nowrap;
1052
- overflow: hidden;
1053
- text-overflow: ellipsis;
1054
- vertical-align: middle;
1055
- }
1056
- .selector-search-select .selector-search-label.none {
1057
- color: var(--text-tip-color);
1058
- }
1059
- .selector-search-select .dropdown-icon {
1060
- position: absolute;
1061
- display: flex;
1062
- top: 50%;
1063
- transform: translateY(-50%);
1064
- right: 10px;
1065
- font-size: 24px;
1066
- transition: transform 0.2s;
1067
- }
1068
- .selector-search-select .dropdown-icon svg {
1069
- width: 24px;
1070
- height: 24px;
1071
- }
1072
- .selector-search-select input {
1073
- width: 100%;
1074
- border: none;
1075
- cursor: default;
1076
- color: var(--text-color);
1077
- }
1078
- .theme-dark .selector-search-select input {
1079
- background-color: transparent;
1080
- }
1081
- .selector-search-option {
1082
- position: fixed;
1083
- padding: 8px;
1084
- width: 100%;
1085
- margin-top: 4px;
1086
- max-height: 400px;
1087
- background-color: var(--menu-background);
1088
- border-radius: 12px;
1089
- z-index: 1000;
1090
- box-shadow: var(--box-shadow);
1091
- overflow-y: auto;
1092
- }
1093
- .selector-search-option-item {
1094
- margin-bottom: 2px;
1095
- padding: 0 8px;
1096
- height: 32px;
1097
- line-height: 32px;
1098
- white-space: nowrap;
1099
- overflow: hidden;
1100
- text-overflow: ellipsis;
1101
- border-radius: 6px;
1102
- cursor: pointer;
1103
- }
1104
- .selector-search-option-item:hover {
1105
- background-color: var(--menu-hover);
1106
- }
1107
- .selector-search-option-item.disabled {
1108
- cursor: not-allowed;
1109
- }
1110
-
1111
- .custom-tooltip {
1112
- padding: 4px 8px;
1113
- color: #fff;
1114
- font-size: 14px;
1115
- line-height: 20px;
1116
- word-break: break-all;
1117
- text-align: left;
1118
- box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1119
- z-index: 100;
1120
- pointer-events: none;
1121
- border-radius: 10px;
1122
- }
1123
- .custom-tooltip.useMaxWidth {
1124
- max-width: 160px;
1125
- }
1126
- .custom-tooltip.show {
1127
- opacity: 1;
1128
- }
1129
- .custom-tooltip .user-avatar {
1130
- width: 18px;
1131
- height: 18px;
1132
- vertical-align: middle;
1133
- margin-right: 4px;
1134
- }
1135
- .custom-tooltip .user-fullname {
1136
- vertical-align: middle;
1137
- }
1138
- body .__react_component_tooltip.type-info {
1139
- background-color: #121315;
1140
- padding: 4px 8px;
1141
- color: #fff;
1142
- font-size: 14px;
1143
- line-height: 20px;
1144
- word-break: break-all;
1145
- text-align: left;
1146
- box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1147
- z-index: 100;
1148
- pointer-events: none;
1149
- border-radius: 10px;
1150
- }
1151
- body .__react_component_tooltip.type-info.useMaxWidth {
1152
- max-width: 160px;
1153
- }
1154
- body .__react_component_tooltip.type-info.show {
1155
- opacity: 1;
1156
- }
1157
- body .__react_component_tooltip.type-info .user-avatar {
1158
- width: 18px;
1159
- height: 18px;
1160
- vertical-align: middle;
1161
- margin-right: 4px;
1162
- }
1163
- body .__react_component_tooltip.type-info .user-fullname {
1164
- vertical-align: middle;
1165
- }
1166
- body .__react_component_tooltip.type-info.place-right:after {
1167
- border-right-color: #121315;
1168
- }
1169
- body .__react_component_tooltip.type-info.place-top:after {
1170
- border-top-color: #121315;
1171
- }
1172
- body .__react_component_tooltip.type-info.place-bottom:after {
1173
- border-bottom-color: #121315;
1174
- }
1175
- body .__react_component_tooltip.type-info.place-left:after {
1176
- border-left-color: #121315;
1177
- }
1178
- .body-tooltip {
1179
- z-index: 1888 !important;
1180
- }
1181
- .kaihei-tips {
1182
- pointer-events: none;
1183
- }
1184
- .kaihei-tips.useMaxWidth {
1185
- max-width: 160px;
1186
- }
1187
- .kaihei-tips .description {
1188
- white-space: nowrap;
1189
- text-overflow: ellipsis;
1190
- overflow: hidden;
1191
- color: rgba(237, 238, 240, 0.7);
1192
- font-size: 12px;
1193
- line-height: 18px;
1194
- }
1195
- body .__react_component_tooltip.type-success {
1196
- padding: 4px 8px;
1197
- color: #fff;
1198
- font-size: 14px;
1199
- line-height: 20px;
1200
- word-break: break-all;
1201
- text-align: left;
1202
- box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1203
- z-index: 100;
1204
- pointer-events: none;
1205
- border-radius: 10px;
1206
- background-color: #64dc00;
1207
- }
1208
- body .__react_component_tooltip.type-success.useMaxWidth {
1209
- max-width: 160px;
1210
- }
1211
- body .__react_component_tooltip.type-success.show {
1212
- opacity: 1;
1213
- }
1214
- body .__react_component_tooltip.type-success .user-avatar {
1215
- width: 18px;
1216
- height: 18px;
1217
- vertical-align: middle;
1218
- margin-right: 4px;
1219
- }
1220
- body .__react_component_tooltip.type-success .user-fullname {
1221
- vertical-align: middle;
1222
- }
1223
- body .__react_component_tooltip.type-success.place-right:after {
1224
- border-right-color: #64dc00;
1225
- }
1226
- body .__react_component_tooltip.type-success.place-top:after {
1227
- border-top-color: #64dc00;
1228
- }
1229
- body .__react_component_tooltip.type-success.place-bottom:after {
1230
- border-bottom-color: #64dc00;
1231
- }
1232
- body .__react_component_tooltip.type-success.place-left:after {
1233
- border-left-color: #64dc00;
1234
- }
1235
- body .__react_component_tooltip.type-dark {
1236
- margin-top: 0;
1237
- padding: 4px 8px;
1238
- border-radius: 10px;
1239
- max-width: 136px;
1240
- max-height: 62px;
1241
- font-size: 12px;
1242
- line-height: 1.3;
1243
- overflow: hidden;
1244
- color: rgba(255, 255, 255, 0.87);
1245
- background-color: rgba(0, 0, 0, 0.87);
1246
- pointer-events: none;
1247
- }
1248
- body .__react_component_tooltip.type-dark.place-right {
1249
- margin: 0;
1250
- }
1251
- body .__react_component_tooltip.type-dark.place-right:after {
1252
- display: none;
1253
- }
1254
- .theme-dark .__react_component_tooltip.type-dark {
1255
- color: rgba(0, 0, 0, 0.87);
1256
- background-color: rgba(255, 255, 255, 0.87);
1257
- }
1258
-
1259
- .ui-switch {
1260
- position: relative;
1261
- display: inline-block;
1262
- box-sizing: border-box;
1263
- overflow: visible;
1264
- width: 32px;
1265
- height: 20px;
1266
- border-radius: 10px;
1267
- border: 2px solid var(--text-tip-color);
1268
- cursor: pointer;
1269
- transition: 0.3s ease-out all;
1270
- top: -1px;
1271
- }
1272
- /*adding a wide width for larger switch text*/
1273
- .ui-switch.wide {
1274
- width: 80px;
1275
- }
1276
- .ui-switch small {
1277
- width: 12px;
1278
- height: 12px;
1279
- position: absolute;
1280
- top: 50%;
1281
- margin-top: -6px;
1282
- left: 2px;
1283
- transition: 200ms ease-out all;
1284
- }
1285
- .ui-switch small::before {
1286
- content: '';
1287
- position: absolute;
1288
- left: 0;
1289
- top: 0;
1290
- bottom: 0;
1291
- right: 0;
1292
- border-radius: 6px;
1293
- background-color: var(--text-tip-color);
1294
- transition: 200ms ease-out all;
1295
- }
1296
- .ui-switch.checked {
1297
- border-color: var(--color-primary);
1298
- }
1299
- .ui-switch.checked small {
1300
- left: calc(100% - 14px);
1301
- }
1302
- .ui-switch.checked small::before {
1303
- background-color: var(--color-primary);
1304
- }
1305
- .ui-switch:active small::before {
1306
- left: 0;
1307
- right: -100%;
1308
- }
1309
- .ui-switch.checked:active small::before {
1310
- right: 0;
1311
- left: -100%;
1312
- }
1313
- /*wider switch text moves small further to the right*/
1314
- .ui-switch.wide.checked small {
1315
- left: 52px;
1316
- }
1317
- /*styles for switch-text*/
1318
- .ui-switch .switch-text {
1319
- font-size: 13px;
1320
- }
1321
- .ui-switch .off {
1322
- display: block;
1323
- position: absolute;
1324
- right: 10%;
1325
- top: 25%;
1326
- z-index: 0;
1327
- color: #A9A9A9;
1328
- }
1329
- .ui-switch .on {
1330
- display: none;
1331
- z-index: 0;
1332
- color: #fff;
1333
- position: absolute;
1334
- top: 25%;
1335
- left: 9%;
1336
- }
1337
- .ui-switch.checked .off {
1338
- display: none;
1339
- }
1340
- .ui-switch.checked .on {
1341
- display: block;
1342
- }
1343
- .ui-switch.disabled {
1344
- cursor: not-allowed;
1345
- opacity: 0.5;
1346
- }
1347
- .ui-switch.disabled small {
1348
- box-shadow: none;
1349
- }
1350
- /* Switchery sizes. */
1351
- /* Switchery size shorthand classes */
1352
- .kaihei-auth-switch {
1353
- display: inline-flex;
1354
- width: 100px;
1355
- height: 30px;
1356
- border-radius: 4px;
1357
- cursor: pointer;
1358
- }
1359
- .kaihei-auth-switch.disabled {
1360
- cursor: not-allowed;
1361
- }
1362
- .kaihei-auth-switch .auth-status-item {
1363
- flex: 1;
1364
- display: flex;
1365
- justify-content: center;
1366
- align-items: center;
1367
- border: 1px solid var(--border-color);
1368
- }
1369
- .kaihei-auth-switch .auth-status-item .xy-iconfont {
1370
- font-size: 24px;
1371
- }
1372
- .kaihei-auth-switch .auth-status-item:hover {
1373
- background-color: var(--menu-hover);
1374
- }
1375
- .kaihei-auth-switch .auth-status-item.close-status {
1376
- border-top-left-radius: 8px;
1377
- border-bottom-left-radius: 8px;
1378
- color: var(--color-error);
1379
- }
1380
- .kaihei-auth-switch .auth-status-item.close-status.active {
1381
- color: white;
1382
- background-color: var(--color-error);
1383
- border-color: var(--color-error);
1384
- }
1385
- .kaihei-auth-switch .auth-status-item.open-status {
1386
- border-top-right-radius: 8px;
1387
- border-bottom-right-radius: 8px;
1388
- color: var(--color-primary);
1389
- }
1390
- .kaihei-auth-switch .auth-status-item.open-status.active {
1391
- color: white;
1392
- background-color: var(--color-primary);
1393
- border-color: var(--color-primary);
1394
- }
1395
- .kaihei-auth-switch .auth-status-item.default-status {
1396
- border-left-width: 0;
1397
- border-right-width: 0;
1398
- color: var(--text-tip-color);
1399
- }
1400
- .kaihei-auth-switch .auth-status-item.default-status.active {
1401
- color: white;
1402
- background-color: var(--text-tip-color);
1403
- border-color: var(--text-tip-color);
1404
- }
1405
-
1406
- .textarea-box {
1407
- position: relative;
1408
- border: 1px solid var(--border-color);
1409
- border-radius: 12px;
1410
- }
1411
- .textarea-box.show-max-length textarea {
1412
- padding-right: 24px;
1413
- }
1414
- .textarea-box textarea {
1415
- width: 100%;
1416
- height: 70px;
1417
- padding: 8px 0 0 16px;
1418
- border: none;
1419
- background-color: initial;
1420
- color: inherit;
1421
- margin-top: 1px;
1422
- line-height: 1.5;
1423
- resize: none;
1424
- }
1425
- .textarea-box textarea::placeholder {
1426
- color: var(--text-tip-color);
1427
- }
1428
- .textarea-box:hover:not(.disabled) {
1429
- border-color: var(--border-hover-color);
1430
- }
1431
- .textarea-box:active {
1432
- box-shadow: 0 0 3px var(--border-active-color);
1433
- }
1434
- .textarea-box:active:not(.disabled) {
1435
- border-color: var(--border-hover-color);
1436
- }
1437
- .textarea-box:focus,
1438
- .textarea-box.theme-focus {
1439
- outline: none;
1440
- border-color: var(--border-hover-color);
1441
- box-shadow: 0 0 0 3px var(--border-active-color);
1442
- }
1443
- .textarea-box.disabled {
1444
- opacity: 0.5;
1445
- }
1446
- .textarea-box .footer {
1447
- font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
1448
- position: absolute;
1449
- bottom: 7px;
1450
- right: 12px;
1451
- font-size: 12px;
1452
- color: var(--text-tip-color);
1453
- }
1454
- .textarea-box.size-sm {
1455
- border-width: 0px;
1456
- }
1457
- .textarea-box.size-sm textarea {
1458
- padding: 0;
1459
- width: 224px;
1460
- line-height: 20px;
1461
- border-radius: 4px;
1462
- font-size: 12px;
1463
- }
1464
- .textarea-box.size-sm .footer {
1465
- bottom: 0px;
1466
- }
1467
-
1468
- .time-selector {
1469
- position: relative;
1470
- }
1471
- .time-selector-select {
1472
- position: relative;
1473
- height: 40px;
1474
- padding: 0 48px 0 16px;
1475
- line-height: 40px;
1476
- border: 1px solid var(--border-color);
1477
- border-radius: 12px;
1478
- font-size: 16px;
1479
- color: var(--text-color);
1480
- }
1481
- .time-selector-select:hover {
1482
- border-color: var(--border-hover-color);
1483
- }
1484
- .time-selector-select:active,
1485
- .time-selector-select.active {
1486
- border-color: var(--border-hover-color);
1487
- box-shadow: 0 0 0 3px var(--border-active-color);
1488
- }
1489
- .time-selector-select:active .dropdown-icon,
1490
- .time-selector-select.active .dropdown-icon {
1491
- transform: rotate(180deg);
1492
- }
1493
- .time-selector-select .dropdown-icon {
1494
- position: absolute;
1495
- display: flex;
1496
- top: 50%;
1497
- margin-top: -12px;
1498
- right: 8px;
1499
- font-size: 24px;
1500
- color: var(--text-description-color);
1501
- transition: transform 200ms linear;
1502
- }
1503
- .time-selector-select .dropdown-icon svg {
1504
- width: 24px;
1505
- height: 24px;
1506
- }
1507
- .time-selector-option {
1508
- position: absolute;
1509
- width: 100%;
1510
- display: flex;
1511
- flex-wrap: wrap;
1512
- margin-top: 4px;
1513
- border-radius: 12px;
1514
- background-color: var(--color-grey-bg);
1515
- box-shadow: var(--box-shadow);
1516
- overflow: hidden;
1517
- font-size: 14px;
1518
- color: var(--text-color);
1519
- z-index: 1000;
1520
- }
1521
- .time-selector-option .footer {
1522
- height: 40px;
1523
- width: 100%;
1524
- text-align: center;
1525
- line-height: 40px;
1526
- border-top: 1px solid var(--color-line);
1527
- cursor: pointer;
1528
- }
1529
- .time-selector-option .footer:hover {
1530
- background-color: var(--menu-hover);
1531
- }
1532
- .time-selector-option .footer:active {
1533
- background-color: var(--menu-active);
1534
- }
1535
- .time-selector-minute,
1536
- .time-selector-hour {
1537
- width: 50%;
1538
- padding: 8px;
1539
- height: 210px;
1540
- }
1541
- .time-selector-hour {
1542
- border-right: 1px solid var(--color-line);
1543
- }
1544
- .time-selector-item {
1545
- height: 32px;
1546
- line-height: 32px;
1547
- border-radius: 8px;
1548
- text-align: center;
1549
- margin-bottom: 2px;
1550
- }
1551
- .time-selector-item:hover {
1552
- background-color: var(--menu-hover);
1553
- }
1554
- .time-selector-item:active,
1555
- .time-selector-item.active {
1556
- background-color: var(--menu-active);
1557
- }
1558
- .time-selector-item.disabled {
1559
- opacity: 0.5;
1560
- background-color: transparent;
1561
- }
1562
- .time-selector-item:last-child {
1563
- margin-bottom: 0;
1564
- }
1565
-
1
+ input,
2
+ textarea {
3
+ outline: none;
4
+ }
5
+ .custom-scroll-bar {
6
+ overflow-x: hidden;
7
+ overflow-y: scroll;
8
+ overflow-y: overlay;
9
+ scrollbar-width: thin;
10
+ scrollbar-color: var(--color-bbb) transparent;
11
+ }
12
+ .custom-scroll-bar::-webkit-scrollbar {
13
+ width: 0;
14
+ }
15
+ .custom-scroll-bar:hover::-webkit-scrollbar {
16
+ width: 8px;
17
+ }
18
+ .custom-scroll-bar::-webkit-scrollbar-track {
19
+ background-color: transparent;
20
+ }
21
+ .custom-scroll-bar::-webkit-scrollbar-thumb {
22
+ border: 2px solid transparent;
23
+ background-color: var(--color-bbb);
24
+ border-radius: 4px;
25
+ background-clip: content-box;
26
+ }
27
+
28
+ @font-face {
29
+ font-family: "xy-iconfont";
30
+ /* Project id 2850126 */
31
+ src: url(data:font/woff2;base64,d09GMgABAAAAAAVcAAsAAAAACywAAAUNAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACDfAqGbIYGATYCJAMwCxoABCAFhQsHggAb6gkjEaaLciPZPzV50IxBAokg2BjEAI0ZA25YRAUWZsaAIEADJLhAAQAAAABBPMn1ztvdO3/KsdQnVUqJJdXmBuc0U2NHavegPn1AN5nkBJSoAcMtkSVMTxAAS3O2R1R7F2EKm5x90myvlINCclS6WlObCzh2kYBGxyqiDWyQSoT2XWk8oARCl6lSbCtca5yuMvDaCbwEAZzkUo1qbNZA4D1p+NwECMegUQXC+jJp/GA3sLNeTIlAsDutdU80yDYsoNarawBb3beXL6jFDgqLRrtMtzENfeDC+6b3PZp4CPoNNgUBOyvAAmggc2Z+GVceHYH2SzLROPOihmJia4PA+xEez/t+tn7eVcGFEwdLbP/wLBg0CgGxotndYO2yuXbNYOpD6A/ECRgAxAEYCMQOGATEBhgMxAoYAsQCGArEAIYB0YDhQBRgBIwnbJjTCaGAL/AbmYTGHoRDdKIN/kMUYjVut/Hx8fVy2KMSVNLgsVVosKKvt9J68CJE5RhWNuIq1Djb6PWIJBt2yZHbuFo8V7LI0BNSRWTo07jzUqUIGxHcTaRVkMNUzuhGxAq9Bg5utCEQEsaMh1KOgxsfyL3hkT4NehmX9Vd5+agxD3BZIpITiRAZCjyeU0S3xGK58KjXKEeNXm/a7ffJIHK7fa6UR4EhfWDGE/AqG7GHruIXHu3D6XwDfOYTxDYTG/si987eVjTSMzyNXszIGHl+Huzj2d3OhcJylDeWDnpLLIXohWV9wrW34UhLy7VWCxLnXv//X4OrqEiYtH6ZwciXvyGw22N3jo6Z4uiFNED90QInKPB/8N3reRvh15rCGWn9N6851jaya3vI5Mmn+4bU1ob0PX3gf3TSzp2VdsRTkIOS+yVuWpPaV7VcMzSOJjCwjUYsze6SldVlEKkhXYP8kqzeCX7NelXSDx7M6JNhVsKz6b/OP6axRkx0qtKctC5i3TytZu+/+nZude9A1jX3jv4rNSfHuV0vti6Cwtx906dnt/brntqY3NCQ0piy39CQWoQb96f4F25Ibkzt3rcte/r00/ZL3bJl81vLh5eVDp8F/vDSWZYyaJCF4WWcf9mx44xjq1u+7fbZmX+xf03N7W10Xajj2N+PpT9J2qvooWoIQNvVOgB1R2kA1DXhAKAfqXuXscVGbiBqOYA6pNQAup+qG29U9f/uz/DnqvW806f8n11sAHi74o0jvIb6cTvqRdj5U2FQzWGNnAtuk9c/ZmsEcJPOb16kAKeeBI+a9OfdGPEACMOCizVArrARLde4SCKGlUssrApiZTXLnWTQXdfb7ovQiHEAyWyFXAjmqFzhzW25JpiXxLB+0CwcsRArK0LupI+UXcxFsqy97dVjGbGBagVTM0kjPy5rIsz/jWrsS5/qDNE/+mCmwi7Nc8o/kdB3d0iY1D5GCdLzAB/M7bDvGaznFuuY6hjtIctkXlbSmofNq8cyYgPVCqZmknY4LpL65P18oxr70pf3AlX/0QdWh+WBXZrXI592qtvtDDcLk9rHKO0O0vMAH+3C2OslDDZ/uxbrmOoWRfaQEcPJuvZ0fMfwAOYAzo32m91HSrQYsYhVbGIXhzjFJW7x4sFzj0L5kqJgi/QcX9eQRm/iI79p3XPAZ1OLkhSbaXim3O+sd7YMYWbfiKB5joW1aapuTHaMgsahQi8GUMfwlCy2/Ri2A0SSAaVWScDS1zoZqIfMwvsvDsLZAuuu4kWEzQYAAA==) format('woff2'), url(data:font/woff;base64,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) format('woff'), url(data:font/ttf;base64,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KCgoKERFUVdKcgwhIRkJCf6GOmI5OWJ0Yjo6YphySVhRRUQoKCgoREWjRUQnKS9yDAkJGSEhSTpidGI5OWJ0YjoAAAAAAQAAAAADRAJEABUAAAEnLgEOAhYfARYyNwE+AS4CBgcBAcCTDCEiGQkKDcASNhIBQA0KCRkiIQz+7QEakw0KCRkiIQzAExMBQAwhIhkJCg3+7gAAAAASAN4AAQAAAAAAAAATAAAAAQAAAAAAAQALABMAAQAAAAAAAgAHAB4AAQAAAAAAAwALACUAAQAAAAAABAALADAAAQAAAAAABQALADsAAQAAAAAABgALAEYAAQAAAAAACgArAFEAAQAAAAAACwATAHwAAwABBAkAAAAmAI8AAwABBAkAAQAWALUAAwABBAkAAgAOAMsAAwABBAkAAwAWANkAAwABBAkABAAWAO8AAwABBAkABQAWAQUAAwABBAkABgAWARsAAwABBAkACgBWATEAAwABBAkACwAmAYdDcmVhdGVkIGJ5IGljb25mb250eHktaWNvbmZvbnRSZWd1bGFyeHktaWNvbmZvbnR4eS1pY29uZm9udFZlcnNpb24gMS4weHktaWNvbmZvbnRHZW5lcmF0ZWQgYnkgc3ZnMnR0ZiBmcm9tIEZvbnRlbGxvIHByb2plY3QuaHR0cDovL2ZvbnRlbGxvLmNvbQBDAHIAZQBhAHQAZQBkACAAYgB5ACAAaQBjAG8AbgBmAG8AbgB0AHgAeQAtAGkAYwBvAG4AZgBvAG4AdABSAGUAZwB1AGwAYQByAHgAeQAtAGkAYwBvAG4AZgBvAG4AdAB4AHkALQBpAGMAbwBuAGYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAHgAeQAtAGkAYwBvAG4AZgBvAG4AdABHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAIAAAAAAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAECAQMBBAEFAQYBBwEIAQkBCgELAQwBDQAPcm9sZV9ncmFudF9vcGVuEnJvbGVfZ3JhbnRfaW5oZXJpdBByb2xlX2dyYW50X2Nsb3NlEmljX2FuZ2xlX2Rvd25fZ3JheQ1wYXNzd29yZF9zaG93DXBhc3N3b3JkX2hpZGUSaW5wdXRfbnVtYmVyX21pbnVzEWlucHV0X251bWJlcl9wbHVzGHJvbGUtbWVtYmVyLXNlYXJjaC1jbG9zZRJyb2xlLW1lbWJlci1zZWFyY2gOUW9zX2NoZWNrYm94X3MAAA==) format('truetype');
32
+ }
33
+ .xy-iconfont {
34
+ font-family: "xy-iconfont" !important;
35
+ font-size: 16px;
36
+ font-style: normal;
37
+ -webkit-font-smoothing: antialiased;
38
+ -moz-osx-font-smoothing: grayscale;
39
+ }
40
+ .xy-icon-role_grant_open:before {
41
+ content: "\e662";
42
+ }
43
+ .xy-icon-role_grant_inherit:before {
44
+ content: "\e661";
45
+ }
46
+ .xy-icon-role_grant_close:before {
47
+ content: "\e660";
48
+ }
49
+ .xy-icon-ic_angle_down_gray:before {
50
+ content: "\e65f";
51
+ }
52
+ .xy-icon-password_show:before {
53
+ content: "\e65e";
54
+ }
55
+ .xy-icon-password_hide:before {
56
+ content: "\e65d";
57
+ }
58
+ .xy-icon-input_number_minus:before {
59
+ content: "\e65c";
60
+ }
61
+ .xy-icon-input_number_plus:before {
62
+ content: "\e65b";
63
+ }
64
+ .xy-icon-role-member-search-close:before {
65
+ content: "\e65a";
66
+ }
67
+ .xy-icon-role-member-search:before {
68
+ content: "\e659";
69
+ }
70
+ .xy-icon-Qos_checkbox_s:before {
71
+ content: "\e658";
72
+ }
73
+
74
+ @keyframes loaderSpin {
75
+ 0% {
76
+ -webkit-transform: rotate(0);
77
+ transform: rotate(0);
78
+ }
79
+ to {
80
+ -webkit-transform: rotate(1turn);
81
+ transform: rotate(1turn);
82
+ }
83
+ }
84
+ .kaihei-loading-spin {
85
+ width: 18px;
86
+ height: 18px;
87
+ display: inline-block;
88
+ position: relative;
89
+ }
90
+ .kaihei-loading-spin:before,
91
+ .kaihei-loading-spin:after {
92
+ box-sizing: border-box;
93
+ width: 100%;
94
+ height: 100%;
95
+ content: "";
96
+ position: absolute;
97
+ left: 0;
98
+ right: 0;
99
+ display: block;
100
+ border-radius: 50%;
101
+ }
102
+ .kaihei-loading-spin:before {
103
+ border: 3px solid var(--border-color);
104
+ }
105
+ .kaihei-loading-spin:after {
106
+ animation-duration: 0.6s;
107
+ border: 3px solid transparent;
108
+ border-top-color: var(--text-tip-color);
109
+ -webkit-animation: loaderSpin 0.6s linear infinite;
110
+ animation: loaderSpin 0.6s linear infinite;
111
+ }
112
+ .kaihei-loading-spin.block-loading-spin {
113
+ display: block;
114
+ margin-left: auto;
115
+ margin-right: auto;
116
+ }
117
+ .kaihei-image-loading-spin {
118
+ display: inline-block;
119
+ position: relative;
120
+ height: 16px;
121
+ width: 27px;
122
+ margin-left: -12px / 2;
123
+ }
124
+ .kaihei-image-loading-spin:before,
125
+ .kaihei-image-loading-spin:after {
126
+ content: "";
127
+ display: block;
128
+ height: 12px;
129
+ width: 12px;
130
+ position: absolute;
131
+ border-radius: 50%;
132
+ }
133
+ .kaihei-image-loading-spin:before {
134
+ animation: k-loadingK 1.2s linear infinite, k-loadingM 1.2s linear infinite;
135
+ background: #666ccc;
136
+ }
137
+ .kaihei-image-loading-spin:after {
138
+ animation: k-loadingL 1.2s linear infinite, k-loadingN 1.2s linear infinite;
139
+ background: #ff9900;
140
+ }
141
+ @keyframes k-loadingK {
142
+ 0% {
143
+ left: 0;
144
+ transform: scale(1);
145
+ }
146
+ 25% {
147
+ transform: scale(1.25);
148
+ }
149
+ 50% {
150
+ left: 100%;
151
+ transform: scale(1);
152
+ }
153
+ 75% {
154
+ transform: scale(0.75);
155
+ }
156
+ 100% {
157
+ left: 0;
158
+ transform: scale(1);
159
+ }
160
+ }
161
+ @keyframes k-loadingL {
162
+ 0% {
163
+ left: 100%;
164
+ transform: scale(1);
165
+ }
166
+ 25% {
167
+ transform: scale(0.75);
168
+ }
169
+ 50% {
170
+ left: 0;
171
+ transform: scale(1);
172
+ }
173
+ 75% {
174
+ transform: scale(1.25);
175
+ }
176
+ 100% {
177
+ left: 100%;
178
+ transform: scale(1);
179
+ }
180
+ }
181
+ @keyframes k-loadingN {
182
+ 0% {
183
+ z-index: 0;
184
+ }
185
+ 25% {
186
+ z-index: 0;
187
+ }
188
+ 50% {
189
+ z-index: 1;
190
+ }
191
+ 75% {
192
+ z-index: 1;
193
+ }
194
+ 100% {
195
+ z-index: 0;
196
+ }
197
+ }
198
+ @keyframes k-loadingM {
199
+ 0% {
200
+ z-index: 1;
201
+ }
202
+ 25% {
203
+ z-index: 1;
204
+ }
205
+ 50% {
206
+ z-index: 0;
207
+ }
208
+ 75% {
209
+ z-index: 0;
210
+ }
211
+ 100% {
212
+ z-index: 1;
213
+ }
214
+ }
215
+
216
+ @keyframes rotate {
217
+ from {
218
+ transform: translate(-50%, -50%) rotate(0deg);
219
+ }
220
+ to {
221
+ transform: translate(-50%, -50%) rotate(360deg);
222
+ }
223
+ }
224
+ .chuanyu-button {
225
+ position: relative;
226
+ color: #ffffff;
227
+ text-align: center;
228
+ outline: none;
229
+ border: 0 none;
230
+ /*按钮大小*/
231
+ /*按钮颜色样式*/
232
+ }
233
+ .chuanyu-button.disabled,
234
+ .chuanyu-button:disabled {
235
+ cursor: not-allowed;
236
+ }
237
+ .chuanyu-button.size-xs {
238
+ font-size: 12px;
239
+ height: 24px;
240
+ padding: 0 8px;
241
+ line-height: 24px;
242
+ border-radius: 8px;
243
+ }
244
+ .chuanyu-button.size-sm {
245
+ height: 32px;
246
+ min-width: 80px;
247
+ font-size: 14px;
248
+ padding: 0 12px;
249
+ border-radius: 8px;
250
+ line-height: 32px;
251
+ }
252
+ .chuanyu-button.size-md {
253
+ height: 36px;
254
+ min-width: 80px;
255
+ font-size: 14px;
256
+ padding: 0 12px;
257
+ border-radius: 12px;
258
+ }
259
+ .chuanyu-button.size-lg {
260
+ height: 40px;
261
+ min-width: 88px;
262
+ font-size: 14px;
263
+ padding: 0 16px;
264
+ border-radius: 12px;
265
+ }
266
+ .chuanyu-button.block-button {
267
+ width: 100%;
268
+ display: block;
269
+ }
270
+ .chuanyu-button.block-button.size-md {
271
+ font-weight: bold;
272
+ font-size: 14px;
273
+ }
274
+ .chuanyu-button.block-button.size-sm {
275
+ font-size: 16px;
276
+ }
277
+ .chuanyu-button.type-primary {
278
+ background-color: var(--color-primary);
279
+ }
280
+ .chuanyu-button.type-primary:not(.disabled):hover {
281
+ background-color: var(--color-primary-hover);
282
+ }
283
+ .chuanyu-button.type-primary:not(.disabled):active {
284
+ background-color: var(--color-primary-active);
285
+ }
286
+ .chuanyu-button.type-primary:disabled {
287
+ opacity: 0.5;
288
+ background-color: var(--color-primary);
289
+ }
290
+ .chuanyu-button.type-simple-primary {
291
+ background-color: transparent;
292
+ color: var(--color-primary);
293
+ }
294
+ .chuanyu-button.type-simple-primary:hover {
295
+ background-color: var(--color-primary);
296
+ color: #fff;
297
+ }
298
+ .chuanyu-button.type-simple-primary:active {
299
+ background-color: var(--color-primary-active);
300
+ color: #fff;
301
+ }
302
+ .chuanyu-button.type-appprimary {
303
+ background-color: var(--color-primary);
304
+ }
305
+ .chuanyu-button.type-appprimary:not(.disabled):hover {
306
+ background-color: var(--color-primary-hover);
307
+ }
308
+ .chuanyu-button.type-appprimary:active {
309
+ background-color: var(--color-primary-active);
310
+ }
311
+ .chuanyu-button.type-appprimary:disabled {
312
+ opacity: 0.5;
313
+ background-color: var(--color-primary);
314
+ }
315
+ .chuanyu-button.type-danger {
316
+ background-color: var(--color-error);
317
+ }
318
+ .chuanyu-button.type-danger:hover {
319
+ background-color: var(--color-error-hover);
320
+ }
321
+ .chuanyu-button.type-danger:active {
322
+ background-color: var(--color-error-active);
323
+ }
324
+ .chuanyu-button.type-danger:disabled {
325
+ opacity: 0.5;
326
+ background-color: var(--color-error);
327
+ }
328
+ .chuanyu-button.type-success {
329
+ background-color: var(--color-success);
330
+ }
331
+ .chuanyu-button.type-success:hover {
332
+ background-color: var(--color-success-hover);
333
+ }
334
+ .chuanyu-button.type-success:active {
335
+ background-color: var(--color-success-active);
336
+ }
337
+ .chuanyu-button.type-success:disabled {
338
+ opacity: 0.5;
339
+ background-color: var(--color-success);
340
+ }
341
+ .chuanyu-button.type-warning {
342
+ background-color: var(--color-warn);
343
+ }
344
+ .chuanyu-button.type-warning:hover {
345
+ background-color: var(--color-warn-hover);
346
+ }
347
+ .chuanyu-button.type-warning:active {
348
+ background-color: var(--color-warn-active);
349
+ }
350
+ .chuanyu-button.type-warning:disabled {
351
+ opacity: 0.5;
352
+ background-color: var(--color-warn);
353
+ }
354
+ .chuanyu-button.type-simple {
355
+ background-color: var(--button-simple);
356
+ color: var(--text-description-color);
357
+ }
358
+ .chuanyu-button.type-simple:not(.disabled):hover {
359
+ background-color: var(--button-simple-hover);
360
+ }
361
+ .chuanyu-button.type-simple:not(.disabled):active {
362
+ background-color: var(--button-simple-active);
363
+ }
364
+ .chuanyu-button.type-simple:disabled {
365
+ opacity: 0.5;
366
+ background-color: transparent;
367
+ }
368
+ .chuanyu-button.type-default {
369
+ color: var(--text-description-color);
370
+ background-color: var(--button-default);
371
+ }
372
+ .chuanyu-button.type-default:hover {
373
+ background-color: var(--button-default-hover);
374
+ }
375
+ .chuanyu-button.type-default:active {
376
+ background-color: var(--button-default-active);
377
+ }
378
+ .chuanyu-button.type-default:disabled {
379
+ cursor: not-allowed;
380
+ opacity: 0.5;
381
+ background: rgba(187, 190, 196, 0.3);
382
+ }
383
+ .chuanyu-button.type-ghost {
384
+ color: var(--text-description-color);
385
+ background-color: var(--button-simple);
386
+ border: 1px solid var(--border-color);
387
+ }
388
+ .chuanyu-button.type-ghost:not(.disabled):hover {
389
+ background-color: var(--button-simple-hover);
390
+ }
391
+ .chuanyu-button.type-ghost:not(.disabled):active {
392
+ background-color: var(--button-simple-active);
393
+ }
394
+ .chuanyu-button.type-ghost:disabled {
395
+ cursor: not-allowed;
396
+ opacity: 0.5;
397
+ }
398
+ .chuanyu-button.type-ghost-danger {
399
+ color: var(--color-error);
400
+ border-color: var(--color-error);
401
+ border-width: 1px;
402
+ border-style: solid;
403
+ }
404
+ .chuanyu-button.type-ghost-danger:hover {
405
+ color: var(--color-error-hover);
406
+ border-color: var(--color-error-hover);
407
+ }
408
+ .chuanyu-button.type-ghost-danger:active {
409
+ color: var(--color-error-hover);
410
+ border-color: var(--color-error-hover);
411
+ }
412
+ .chuanyu-button.type-simple-danger {
413
+ color: var(--color-error);
414
+ background-color: transparent;
415
+ border: 1px solid rgba(228, 75, 77);
416
+ }
417
+ .chuanyu-button.type-simple-danger:hover {
418
+ border: 1px solid rgba(230, 93, 95);
419
+ }
420
+ .chuanyu-button.type-simple-danger:active {
421
+ background-color: rgba(228, 75, 77, 0.1);
422
+ }
423
+ .chuanyu-button.loading .loading-ico {
424
+ position: absolute;
425
+ top: 50%;
426
+ left: 50%;
427
+ display: block;
428
+ animation: rotate 1s linear infinite;
429
+ }
430
+ .chuanyu-button.loading .button-text {
431
+ visibility: hidden;
432
+ }
433
+ .chuanyu-button.loading .btn-loading-ico {
434
+ position: absolute;
435
+ top: 50%;
436
+ left: 50%;
437
+ display: block;
438
+ transform: translate(-50%, -50%);
439
+ height: 18px;
440
+ width: 18px;
441
+ line-height: 1;
442
+ }
443
+ .size-sm .button-loading-spin {
444
+ transform-origin: 50%;
445
+ transform: scale(0.9);
446
+ }
447
+ .buttons-group .chuanyu-button:not(:first-child) {
448
+ margin-left: 8px;
449
+ }
450
+
451
+ .kaihei-checkbox {
452
+ position: relative;
453
+ display: inline-block;
454
+ width: 18px;
455
+ height: 18px;
456
+ border-width: 2px;
457
+ border-style: solid;
458
+ border-radius: 4px;
459
+ border-color: var(--border-color);
460
+ margin-right: 10px;
461
+ vertical-align: middle;
462
+ box-sizing: border-box;
463
+ }
464
+ .kaihei-checkbox.active {
465
+ display: inline-flex;
466
+ justify-content: center;
467
+ align-items: center;
468
+ border-color: white;
469
+ }
470
+ .kaihei-checkbox.active:after {
471
+ position: absolute;
472
+ top: 2px;
473
+ left: 2px;
474
+ content: "";
475
+ width: 10px;
476
+ height: 10px;
477
+ background-color: white;
478
+ border-radius: 2px;
479
+ }
480
+ .kaihei-checkbox.disabled {
481
+ opacity: 0.5;
482
+ cursor: not-allowed;
483
+ }
484
+ .theme-light .kaihei-checkbox.active {
485
+ border-color: var(--color-primary);
486
+ }
487
+ .theme-light .kaihei-checkbox.active:after {
488
+ background-color: var(--color-primary);
489
+ }
490
+ .checkbox-box {
491
+ display: inline-flex;
492
+ align-items: center;
493
+ }
494
+ .kaihei-checkbox-mute {
495
+ display: inline-block;
496
+ width: 16px;
497
+ height: 16px;
498
+ font-size: 14px;
499
+ line-height: 14px;
500
+ color: var(--text-tip-color);
501
+ border: 2px solid var(--text-tip-color);
502
+ border-radius: 4px;
503
+ margin-right: 8px;
504
+ vertical-align: middle;
505
+ box-sizing: border-box;
506
+ }
507
+ .kaihei-checkbox-mute.active {
508
+ display: inline-flex;
509
+ justify-content: center;
510
+ align-items: center;
511
+ }
512
+ .kaihei-checkbox-mute.active.type-appprimary {
513
+ border-color: var(--color-primary);
514
+ background-color: var(--color-primary);
515
+ }
516
+ .kaihei-checkbox-mute.active.type-danger {
517
+ border-color: var(--color-error);
518
+ background-color: var(--color-error);
519
+ }
520
+ .kaihei-checkbox-mute.active:before {
521
+ color: white;
522
+ }
523
+ .kaihei-checkbox-mute.disabled {
524
+ opacity: 0.5;
525
+ cursor: not-allowed;
526
+ }
527
+
528
+ .arc-progress-wrapper {
529
+ position: absolute;
530
+ top: 0;
531
+ left: 0;
532
+ width: 100%;
533
+ height: 100%;
534
+ display: flex;
535
+ align-items: center;
536
+ justify-content: center;
537
+ background-color: rgba(0, 0, 0, 0.4);
538
+ }
539
+ .arc-progress-wrapper .arc-progress-track {
540
+ stroke: rgba(255, 255, 255, 0.4);
541
+ }
542
+ .arc-progress-wrapper .arc-progress-bar {
543
+ stroke: #fff;
544
+ }
545
+
546
+ .friendship-level {
547
+ display: flex;
548
+ color: var(--color-error);
549
+ }
550
+ .friendship-level.minus {
551
+ color: var(--text-description-color);
552
+ }
553
+ .friendship-level .friendship-item {
554
+ width: 14px;
555
+ height: 14px;
556
+ margin-left: 2px;
557
+ display: inline-block;
558
+ }
559
+ .friendship-level .friendship-item svg {
560
+ width: 100%;
561
+ height: 100%;
562
+ }
563
+ .friendship-level.md {
564
+ width: 16px;
565
+ height: 16px;
566
+ margin-left: 4px;
567
+ }
568
+
569
+ /*
570
+ * input基本样式
571
+ */
572
+ .chuanyu-input {
573
+ outline: none;
574
+ width: 276px;
575
+ height: 40px;
576
+ padding: 0 16px;
577
+ border-radius: 12px;
578
+ background-color: var(--color-f2f);
579
+ color: var(--main-color);
580
+ font-size: 14px;
581
+ border: 1px solid transparent;
582
+ }
583
+ .chuanyu-input.ghost {
584
+ background-color: transparent;
585
+ border-color: var(--border-color);
586
+ }
587
+ .chuanyu-input:hover {
588
+ border-color: var(--border-hover-color);
589
+ }
590
+ .chuanyu-input:focus {
591
+ border-color: var(--border-hover-color);
592
+ box-shadow: 0 0 0 3px var(--border-active-color);
593
+ }
594
+ .chuanyu-input.block {
595
+ width: 100%;
596
+ }
597
+ .chuanyu-input::placeholder {
598
+ color: var(--text-tip-color);
599
+ }
600
+ .chuanyu-input:-webkit-autofill {
601
+ -webkit-text-fill-color: #fff !important;
602
+ transition: background-color 5000s ease-in-out 0s;
603
+ font-size: 14px;
604
+ -webkit-text-fill-color: white;
605
+ }
606
+ .chuanyu-input:-webkit-autofill:hover,
607
+ .chuanyu-input:-webkit-autofill:focus,
608
+ .chuanyu-input:-webkit-autofill:active {
609
+ font-size: 14px;
610
+ }
611
+ /*
612
+ * input后缀
613
+ */
614
+ .suffix-input-wrapper {
615
+ position: relative;
616
+ }
617
+ .suffix-input-wrapper .suffix-content {
618
+ position: absolute;
619
+ right: 0;
620
+ top: 0;
621
+ height: 100%;
622
+ display: flex;
623
+ align-items: center;
624
+ text-align: right;
625
+ padding-right: 10px;
626
+ color: #ffffff;
627
+ font-size: 14px;
628
+ }
629
+ .suffix-input-wrapper .chuanyu-input {
630
+ padding-right: 93px;
631
+ }
632
+ .normal-input {
633
+ height: 40px;
634
+ width: 100%;
635
+ padding: 0 16px;
636
+ text-align: left;
637
+ border: 1px solid var(--border-color);
638
+ border-radius: 12px;
639
+ font-size: 14px;
640
+ }
641
+ .normal-input.noTheme {
642
+ border-color: transparent;
643
+ background-color: #f2f3f5;
644
+ }
645
+ .normal-input:hover {
646
+ border-color: var(--border-hover-color);
647
+ }
648
+ .normal-input:focus {
649
+ border-color: var(--border-hover-color);
650
+ box-shadow: 0 0 0 3px var(--border-active-color);
651
+ }
652
+ .normal-input::placeholder {
653
+ color: var(--text-tip-color);
654
+ }
655
+ .normal-input:disabled {
656
+ opacity: 0.5;
657
+ cursor: not-allowed;
658
+ border-color: var(--border-color);
659
+ }
660
+ .passowrd-input {
661
+ position: relative;
662
+ }
663
+ .passowrd-input input {
664
+ height: 40px;
665
+ line-height: 14px;
666
+ font-size: 14px;
667
+ padding: 0 16px;
668
+ text-align: left;
669
+ border: 1px solid var(--border-color);
670
+ width: 100%;
671
+ border-radius: 12px;
672
+ }
673
+ .passowrd-input input::placeholder {
674
+ color: var(--text-tip-color);
675
+ }
676
+ .passowrd-input .switch-btn {
677
+ position: absolute;
678
+ top: 50%;
679
+ transform: translateY(-50%);
680
+ right: 12px;
681
+ font-size: 20px;
682
+ color: var(--text-tip-color);
683
+ }
684
+ .normal-textarea {
685
+ height: 105px;
686
+ font-size: 14px;
687
+ padding: 10px 16px;
688
+ width: 100%;
689
+ outline: none;
690
+ border-radius: 12px;
691
+ border: 1px solid var(--border-color);
692
+ }
693
+ .normal-textarea:hover {
694
+ border-color: var(--border-hover-color);
695
+ }
696
+ .normal-textarea:focus {
697
+ border-color: var(--border-hover-color);
698
+ box-shadow: 0 0 0 3px var(--border-active-color);
699
+ }
700
+ .normal-textarea:disabled {
701
+ opacity: 0.5;
702
+ cursor: not-allowed;
703
+ border-color: var(--border-color);
704
+ }
705
+ .normal-textarea::placeholder {
706
+ color: var(--text-tip-color);
707
+ }
708
+ .search-input {
709
+ position: relative;
710
+ display: flex;
711
+ align-items: center;
712
+ padding: 0 16px;
713
+ height: 40px;
714
+ font-size: 14px;
715
+ border-radius: 12px;
716
+ border: 1px solid var(--border-color);
717
+ }
718
+ .search-input.noborder {
719
+ border-color: transparent;
720
+ background-color: var(--color-f2f);
721
+ }
722
+ .search-input:hover {
723
+ border-color: var(--border-hover-color);
724
+ }
725
+ .search-input.active {
726
+ border-color: var(--border-hover-color);
727
+ box-shadow: 0 0 0 3px var(--border-active-color);
728
+ }
729
+ .search-input input {
730
+ flex: 1;
731
+ min-width: 0;
732
+ height: 100%;
733
+ border: none;
734
+ background: transparent;
735
+ color: var(--text-color);
736
+ }
737
+ .search-input input::placeholder {
738
+ color: var(--text-tip-color);
739
+ }
740
+ .search-input .button-clear,
741
+ .search-input .button-search {
742
+ display: flex;
743
+ margin-left: 16px;
744
+ width: 24px;
745
+ height: 24px;
746
+ font-size: 24px;
747
+ color: var(--text-tip-color);
748
+ cursor: pointer;
749
+ }
750
+ .search-input .button-clear:hover,
751
+ .search-input .button-search:hover {
752
+ color: var(--text-description-color);
753
+ }
754
+ .search-input .button-clear:active,
755
+ .search-input .button-search:active {
756
+ color: var(--text-color);
757
+ }
758
+ .search-input .button-clear svg,
759
+ .search-input .button-search svg {
760
+ width: 24px;
761
+ height: 24px;
762
+ }
763
+ .search-input.sm {
764
+ height: 32px;
765
+ padding: 0 8px;
766
+ }
767
+ .search-input.sm .button-clear,
768
+ .search-input.sm .button-search {
769
+ margin-left: 8px;
770
+ }
771
+ .number-input {
772
+ display: flex;
773
+ }
774
+ .number-input input {
775
+ color: var(--text-color);
776
+ border: none;
777
+ padding: 0px 8px 0;
778
+ width: 42px;
779
+ height: 24px;
780
+ font-size: 14px;
781
+ text-align: center;
782
+ vertical-align: bottom;
783
+ background-color: transparent;
784
+ }
785
+ .number-input .xy-iconfont {
786
+ display: inline-block;
787
+ width: 24px;
788
+ height: 24px;
789
+ border-radius: 6px;
790
+ background-color: var(--color-ede);
791
+ font-size: 24px;
792
+ color: var(--text-description-color);
793
+ text-align: center;
794
+ line-height: 24px;
795
+ cursor: pointer;
796
+ }
797
+ .number-input .xy-iconfont:not(.disabled):hover {
798
+ color: var(--text-color);
799
+ }
800
+ .number-input .xy-iconfont.disabled {
801
+ opacity: 0.5;
802
+ cursor: not-allowed;
803
+ }
804
+
805
+ .number-step {
806
+ display: flex;
807
+ width: 110px;
808
+ height: 28px;
809
+ line-height: 28px;
810
+ font-size: 14px;
811
+ border-radius: 4px;
812
+ border: 1px solid var(--border-color);
813
+ color: var(--text-color);
814
+ }
815
+ .number-step button {
816
+ height: 24px;
817
+ width: 32px;
818
+ text-align: center;
819
+ font-size: 18px;
820
+ font-weight: bold;
821
+ border: none;
822
+ background-color: transparent;
823
+ color: var(--text-color);
824
+ }
825
+ .number-step button:disabled {
826
+ color: var(--text-tip-color);
827
+ }
828
+ .number-step .value-label {
829
+ flex: 1;
830
+ }
831
+
832
+ .kaihei-radio {
833
+ width: 16px;
834
+ height: 16px;
835
+ border-radius: 50%;
836
+ display: inline-flex;
837
+ flex-shrink: 0;
838
+ justify-content: center;
839
+ align-items: center;
840
+ position: relative;
841
+ border: 2px solid var(--text-tip-color);
842
+ }
843
+ .kaihei-radio.checked {
844
+ border-color: var(--color-primary);
845
+ }
846
+ .kaihei-radio.checked::after {
847
+ position: absolute;
848
+ content: "";
849
+ width: 8px;
850
+ height: 8px;
851
+ background-color: var(--color-primary);
852
+ border-radius: 50%;
853
+ }
854
+ .form-item-radio {
855
+ display: flex;
856
+ align-items: center;
857
+ }
858
+ .form-item-radio .label {
859
+ display: inline-block;
860
+ }
861
+
862
+ .selector-contain {
863
+ position: relative;
864
+ font-size: 14px;
865
+ color: var(--text-color);
866
+ }
867
+ .selector-contain[disabled] {
868
+ opacity: 0.5;
869
+ }
870
+ .selector-contain[disabled] .selector-select {
871
+ cursor: not-allowed;
872
+ }
873
+ .selector-contain[disabled] .selector-select:hover {
874
+ border-color: var(--border-color);
875
+ }
876
+ .selector-contain[disabled] .selector-select:active {
877
+ box-shadow: none;
878
+ }
879
+ .selector-contain.size-sm {
880
+ width: 220px;
881
+ }
882
+ .selector-contain.size-md {
883
+ width: 320px;
884
+ }
885
+ .selector-contain.type-ghost {
886
+ color: var(--text-description-color);
887
+ }
888
+ .selector-contain.type-ghost .selector-select {
889
+ padding: 6px 32px 6px 12px;
890
+ border-radius: 16px;
891
+ border-width: 0;
892
+ background-color: var(--menu-background);
893
+ }
894
+ .selector-contain.simple .selector-select {
895
+ border: none;
896
+ padding: 0 30px 0 0;
897
+ line-height: 1;
898
+ box-shadow: none;
899
+ color: var(--text-description-color);
900
+ }
901
+ .selector-contain.simple .selector-select:hover,
902
+ .selector-contain.simple .selector-select.active {
903
+ border-color: transparent;
904
+ box-shadow: none;
905
+ color: var(--text-color);
906
+ }
907
+ .selector-option.simple {
908
+ margin-left: 50%;
909
+ margin-top: 10px;
910
+ transform: translate(-50%);
911
+ width: 220px;
912
+ padding: 10px;
913
+ border-radius: 12px;
914
+ border: none;
915
+ }
916
+ .selector-option.simple .selector-option-item {
917
+ border-radius: 8px;
918
+ }
919
+ .selector-option.simple .selector-option-item.selected {
920
+ background-color: transparent;
921
+ }
922
+ .selector-option.simple .selector-option-item:hover {
923
+ background-color: var(--menu-hover);
924
+ }
925
+ .selector-select {
926
+ display: flex;
927
+ position: relative;
928
+ width: 100%;
929
+ padding: 9px 35px 9px 16px;
930
+ border: 1px solid var(--border-color);
931
+ border-radius: 12px;
932
+ cursor: pointer;
933
+ }
934
+ .selector-select:hover {
935
+ border-color: var(--border-hover-color);
936
+ }
937
+ .selector-select:active,
938
+ .selector-select.active:not([disabled]) {
939
+ border-color: var(--border-hover-color);
940
+ box-shadow: 0 0 0 3px var(--border-active-color);
941
+ }
942
+ .selector-select.active .dropdown-icon {
943
+ transform: translateY(-50%) rotate(180deg);
944
+ }
945
+ .selector-select .selector-label {
946
+ display: inline-block;
947
+ width: 100%;
948
+ white-space: nowrap;
949
+ overflow: hidden;
950
+ text-overflow: ellipsis;
951
+ vertical-align: middle;
952
+ line-height: 20px;
953
+ }
954
+ .selector-select .selector-label .emoji {
955
+ height: 15px;
956
+ display: inline-block;
957
+ margin-top: -3px;
958
+ }
959
+ .selector-select .dropdown-icon {
960
+ position: absolute;
961
+ display: flex;
962
+ top: 50%;
963
+ transform: translateY(-50%);
964
+ right: 10px;
965
+ font-size: 24px;
966
+ transition: transform 0.2s;
967
+ }
968
+ .selector-select .dropdown-icon svg {
969
+ width: 24px;
970
+ height: 24px;
971
+ }
972
+ .selector-option {
973
+ position: absolute;
974
+ width: 100%;
975
+ margin-top: 4px;
976
+ border-radius: 12px;
977
+ padding: 8px;
978
+ z-index: 1000;
979
+ max-height: 240px;
980
+ overflow-y: auto;
981
+ background-color: var(--color-grey-bg);
982
+ box-shadow: var(--box-shadow);
983
+ }
984
+ .selector-option.fixed {
985
+ position: fixed;
986
+ }
987
+ .ab-shadow {
988
+ position: absolute;
989
+ width: 100%;
990
+ }
991
+ .selector-option-item {
992
+ padding: 0 8px;
993
+ height: 32px;
994
+ line-height: 32px;
995
+ white-space: nowrap;
996
+ overflow: hidden;
997
+ text-overflow: ellipsis;
998
+ cursor: pointer;
999
+ border-radius: 8px;
1000
+ margin-bottom: 2px;
1001
+ }
1002
+ .selector-option-item:last-child {
1003
+ margin-bottom: 0;
1004
+ }
1005
+ .selector-option-item:hover {
1006
+ background-color: var(--menu-hover);
1007
+ }
1008
+ .selector-option-item:active {
1009
+ background-color: var(--menu-active);
1010
+ }
1011
+ .selector-option-item.selected {
1012
+ background-color: var(--menu-active);
1013
+ }
1014
+ .selector-option-item .emoji {
1015
+ height: 14px;
1016
+ display: inline-block;
1017
+ margin-top: -3px;
1018
+ }
1019
+
1020
+ .selector-search-contain {
1021
+ position: relative;
1022
+ font-size: 14px;
1023
+ color: var(--text-color);
1024
+ }
1025
+ .selector-search-select {
1026
+ position: relative;
1027
+ width: 100%;
1028
+ padding: 9px 35px 9px 16px;
1029
+ border-radius: 12px;
1030
+ border: 1px solid var(--border-color);
1031
+ }
1032
+ .selector-search-select:hover {
1033
+ border-color: var(--border-hover-color);
1034
+ }
1035
+ .selector-search-select:active,
1036
+ .selector-search-select.active {
1037
+ border-color: var(--border-hover-color);
1038
+ box-shadow: 0 0 0 3px var(--border-active-color);
1039
+ }
1040
+ .selector-search-select:active .dropdown-icon,
1041
+ .selector-search-select.active .dropdown-icon {
1042
+ transform: translateY(-50%) rotate(180deg);
1043
+ }
1044
+ .selector-search-select .selector-search-label {
1045
+ position: absolute;
1046
+ top: 50%;
1047
+ transform: translateY(-50%);
1048
+ left: 16px;
1049
+ display: inline-block;
1050
+ width: calc(100% - 44px);
1051
+ white-space: nowrap;
1052
+ overflow: hidden;
1053
+ text-overflow: ellipsis;
1054
+ vertical-align: middle;
1055
+ }
1056
+ .selector-search-select .selector-search-label.none {
1057
+ color: var(--text-tip-color);
1058
+ }
1059
+ .selector-search-select .dropdown-icon {
1060
+ position: absolute;
1061
+ display: flex;
1062
+ top: 50%;
1063
+ transform: translateY(-50%);
1064
+ right: 10px;
1065
+ font-size: 24px;
1066
+ transition: transform 0.2s;
1067
+ }
1068
+ .selector-search-select .dropdown-icon svg {
1069
+ width: 24px;
1070
+ height: 24px;
1071
+ }
1072
+ .selector-search-select input {
1073
+ width: 100%;
1074
+ border: none;
1075
+ cursor: default;
1076
+ color: var(--text-color);
1077
+ }
1078
+ .theme-dark .selector-search-select input {
1079
+ background-color: transparent;
1080
+ }
1081
+ .selector-search-option {
1082
+ position: fixed;
1083
+ padding: 8px;
1084
+ width: 100%;
1085
+ margin-top: 4px;
1086
+ max-height: 400px;
1087
+ background-color: var(--menu-background);
1088
+ border-radius: 12px;
1089
+ z-index: 1000;
1090
+ box-shadow: var(--box-shadow);
1091
+ overflow-y: auto;
1092
+ }
1093
+ .selector-search-option-item {
1094
+ margin-bottom: 2px;
1095
+ padding: 0 8px;
1096
+ height: 32px;
1097
+ line-height: 32px;
1098
+ white-space: nowrap;
1099
+ overflow: hidden;
1100
+ text-overflow: ellipsis;
1101
+ border-radius: 6px;
1102
+ cursor: pointer;
1103
+ }
1104
+ .selector-search-option-item:hover {
1105
+ background-color: var(--menu-hover);
1106
+ }
1107
+ .selector-search-option-item.disabled {
1108
+ cursor: not-allowed;
1109
+ }
1110
+
1111
+ .custom-tooltip {
1112
+ padding: 4px 8px;
1113
+ color: #fff;
1114
+ font-size: 14px;
1115
+ line-height: 20px;
1116
+ word-break: break-all;
1117
+ text-align: left;
1118
+ box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1119
+ z-index: 100;
1120
+ pointer-events: none;
1121
+ border-radius: 10px;
1122
+ }
1123
+ .custom-tooltip.useMaxWidth {
1124
+ max-width: 160px;
1125
+ }
1126
+ .custom-tooltip.show {
1127
+ opacity: 1;
1128
+ }
1129
+ .custom-tooltip .user-avatar {
1130
+ width: 18px;
1131
+ height: 18px;
1132
+ vertical-align: middle;
1133
+ margin-right: 4px;
1134
+ }
1135
+ .custom-tooltip .user-fullname {
1136
+ vertical-align: middle;
1137
+ }
1138
+ body .__react_component_tooltip.type-info {
1139
+ background-color: #121315;
1140
+ padding: 4px 8px;
1141
+ color: #fff;
1142
+ font-size: 14px;
1143
+ line-height: 20px;
1144
+ word-break: break-all;
1145
+ text-align: left;
1146
+ box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1147
+ z-index: 100;
1148
+ pointer-events: none;
1149
+ border-radius: 10px;
1150
+ }
1151
+ body .__react_component_tooltip.type-info.useMaxWidth {
1152
+ max-width: 160px;
1153
+ }
1154
+ body .__react_component_tooltip.type-info.show {
1155
+ opacity: 1;
1156
+ }
1157
+ body .__react_component_tooltip.type-info .user-avatar {
1158
+ width: 18px;
1159
+ height: 18px;
1160
+ vertical-align: middle;
1161
+ margin-right: 4px;
1162
+ }
1163
+ body .__react_component_tooltip.type-info .user-fullname {
1164
+ vertical-align: middle;
1165
+ }
1166
+ body .__react_component_tooltip.type-info.place-right:after {
1167
+ border-right-color: #121315;
1168
+ }
1169
+ body .__react_component_tooltip.type-info.place-top:after {
1170
+ border-top-color: #121315;
1171
+ }
1172
+ body .__react_component_tooltip.type-info.place-bottom:after {
1173
+ border-bottom-color: #121315;
1174
+ }
1175
+ body .__react_component_tooltip.type-info.place-left:after {
1176
+ border-left-color: #121315;
1177
+ }
1178
+ .body-tooltip {
1179
+ z-index: 1888 !important;
1180
+ }
1181
+ .kaihei-tips {
1182
+ pointer-events: none;
1183
+ }
1184
+ .kaihei-tips.useMaxWidth {
1185
+ max-width: 160px;
1186
+ }
1187
+ .kaihei-tips .description {
1188
+ white-space: nowrap;
1189
+ text-overflow: ellipsis;
1190
+ overflow: hidden;
1191
+ color: rgba(237, 238, 240, 0.7);
1192
+ font-size: 12px;
1193
+ line-height: 18px;
1194
+ }
1195
+ body .__react_component_tooltip.type-success {
1196
+ padding: 4px 8px;
1197
+ color: #fff;
1198
+ font-size: 14px;
1199
+ line-height: 20px;
1200
+ word-break: break-all;
1201
+ text-align: left;
1202
+ box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.2);
1203
+ z-index: 100;
1204
+ pointer-events: none;
1205
+ border-radius: 10px;
1206
+ background-color: #64dc00;
1207
+ }
1208
+ body .__react_component_tooltip.type-success.useMaxWidth {
1209
+ max-width: 160px;
1210
+ }
1211
+ body .__react_component_tooltip.type-success.show {
1212
+ opacity: 1;
1213
+ }
1214
+ body .__react_component_tooltip.type-success .user-avatar {
1215
+ width: 18px;
1216
+ height: 18px;
1217
+ vertical-align: middle;
1218
+ margin-right: 4px;
1219
+ }
1220
+ body .__react_component_tooltip.type-success .user-fullname {
1221
+ vertical-align: middle;
1222
+ }
1223
+ body .__react_component_tooltip.type-success.place-right:after {
1224
+ border-right-color: #64dc00;
1225
+ }
1226
+ body .__react_component_tooltip.type-success.place-top:after {
1227
+ border-top-color: #64dc00;
1228
+ }
1229
+ body .__react_component_tooltip.type-success.place-bottom:after {
1230
+ border-bottom-color: #64dc00;
1231
+ }
1232
+ body .__react_component_tooltip.type-success.place-left:after {
1233
+ border-left-color: #64dc00;
1234
+ }
1235
+ body .__react_component_tooltip.type-dark {
1236
+ margin-top: 0;
1237
+ padding: 4px 8px;
1238
+ border-radius: 10px;
1239
+ max-width: 136px;
1240
+ max-height: 62px;
1241
+ font-size: 12px;
1242
+ line-height: 1.3;
1243
+ overflow: hidden;
1244
+ color: rgba(255, 255, 255, 0.87);
1245
+ background-color: rgba(0, 0, 0, 0.87);
1246
+ pointer-events: none;
1247
+ }
1248
+ body .__react_component_tooltip.type-dark.place-right {
1249
+ margin: 0;
1250
+ }
1251
+ body .__react_component_tooltip.type-dark.place-right:after {
1252
+ display: none;
1253
+ }
1254
+ .theme-dark .__react_component_tooltip.type-dark {
1255
+ color: rgba(0, 0, 0, 0.87);
1256
+ background-color: rgba(255, 255, 255, 0.87);
1257
+ }
1258
+
1259
+ .ui-switch {
1260
+ position: relative;
1261
+ display: inline-block;
1262
+ box-sizing: border-box;
1263
+ overflow: visible;
1264
+ width: 32px;
1265
+ height: 20px;
1266
+ border-radius: 10px;
1267
+ border: 2px solid var(--text-tip-color);
1268
+ cursor: pointer;
1269
+ transition: 0.3s ease-out all;
1270
+ top: -1px;
1271
+ }
1272
+ /*adding a wide width for larger switch text*/
1273
+ .ui-switch.wide {
1274
+ width: 80px;
1275
+ }
1276
+ .ui-switch small {
1277
+ width: 12px;
1278
+ height: 12px;
1279
+ position: absolute;
1280
+ top: 50%;
1281
+ margin-top: -6px;
1282
+ left: 2px;
1283
+ transition: 200ms ease-out all;
1284
+ }
1285
+ .ui-switch small::before {
1286
+ content: '';
1287
+ position: absolute;
1288
+ left: 0;
1289
+ top: 0;
1290
+ bottom: 0;
1291
+ right: 0;
1292
+ border-radius: 6px;
1293
+ background-color: var(--text-tip-color);
1294
+ transition: 200ms ease-out all;
1295
+ }
1296
+ .ui-switch.checked {
1297
+ border-color: var(--color-primary);
1298
+ }
1299
+ .ui-switch.checked small {
1300
+ left: calc(100% - 14px);
1301
+ }
1302
+ .ui-switch.checked small::before {
1303
+ background-color: var(--color-primary);
1304
+ }
1305
+ .ui-switch:active small::before {
1306
+ left: 0;
1307
+ right: -100%;
1308
+ }
1309
+ .ui-switch.checked:active small::before {
1310
+ right: 0;
1311
+ left: -100%;
1312
+ }
1313
+ /*wider switch text moves small further to the right*/
1314
+ .ui-switch.wide.checked small {
1315
+ left: 52px;
1316
+ }
1317
+ /*styles for switch-text*/
1318
+ .ui-switch .switch-text {
1319
+ font-size: 13px;
1320
+ }
1321
+ .ui-switch .off {
1322
+ display: block;
1323
+ position: absolute;
1324
+ right: 10%;
1325
+ top: 25%;
1326
+ z-index: 0;
1327
+ color: #A9A9A9;
1328
+ }
1329
+ .ui-switch .on {
1330
+ display: none;
1331
+ z-index: 0;
1332
+ color: #fff;
1333
+ position: absolute;
1334
+ top: 25%;
1335
+ left: 9%;
1336
+ }
1337
+ .ui-switch.checked .off {
1338
+ display: none;
1339
+ }
1340
+ .ui-switch.checked .on {
1341
+ display: block;
1342
+ }
1343
+ .ui-switch.disabled {
1344
+ cursor: not-allowed;
1345
+ opacity: 0.5;
1346
+ }
1347
+ .ui-switch.disabled small {
1348
+ box-shadow: none;
1349
+ }
1350
+ /* Switchery sizes. */
1351
+ /* Switchery size shorthand classes */
1352
+ .kaihei-auth-switch {
1353
+ display: inline-flex;
1354
+ width: 100px;
1355
+ height: 30px;
1356
+ border-radius: 4px;
1357
+ cursor: pointer;
1358
+ }
1359
+ .kaihei-auth-switch.disabled {
1360
+ cursor: not-allowed;
1361
+ }
1362
+ .kaihei-auth-switch .auth-status-item {
1363
+ flex: 1;
1364
+ display: flex;
1365
+ justify-content: center;
1366
+ align-items: center;
1367
+ border: 1px solid var(--border-color);
1368
+ }
1369
+ .kaihei-auth-switch .auth-status-item .xy-iconfont {
1370
+ font-size: 24px;
1371
+ }
1372
+ .kaihei-auth-switch .auth-status-item:hover {
1373
+ background-color: var(--menu-hover);
1374
+ }
1375
+ .kaihei-auth-switch .auth-status-item.close-status {
1376
+ border-top-left-radius: 8px;
1377
+ border-bottom-left-radius: 8px;
1378
+ color: var(--color-error);
1379
+ }
1380
+ .kaihei-auth-switch .auth-status-item.close-status.active {
1381
+ color: white;
1382
+ background-color: var(--color-error);
1383
+ border-color: var(--color-error);
1384
+ }
1385
+ .kaihei-auth-switch .auth-status-item.open-status {
1386
+ border-top-right-radius: 8px;
1387
+ border-bottom-right-radius: 8px;
1388
+ color: var(--color-primary);
1389
+ }
1390
+ .kaihei-auth-switch .auth-status-item.open-status.active {
1391
+ color: white;
1392
+ background-color: var(--color-primary);
1393
+ border-color: var(--color-primary);
1394
+ }
1395
+ .kaihei-auth-switch .auth-status-item.default-status {
1396
+ border-left-width: 0;
1397
+ border-right-width: 0;
1398
+ color: var(--text-tip-color);
1399
+ }
1400
+ .kaihei-auth-switch .auth-status-item.default-status.active {
1401
+ color: white;
1402
+ background-color: var(--text-tip-color);
1403
+ border-color: var(--text-tip-color);
1404
+ }
1405
+
1406
+ .textarea-box {
1407
+ position: relative;
1408
+ border: 1px solid var(--border-color);
1409
+ border-radius: 12px;
1410
+ }
1411
+ .textarea-box.show-max-length textarea {
1412
+ padding-right: 24px;
1413
+ }
1414
+ .textarea-box textarea {
1415
+ width: 100%;
1416
+ height: 70px;
1417
+ padding: 8px 0 0 16px;
1418
+ border: none;
1419
+ background-color: initial;
1420
+ color: inherit;
1421
+ margin-top: 1px;
1422
+ line-height: 1.5;
1423
+ resize: none;
1424
+ }
1425
+ .textarea-box textarea::placeholder {
1426
+ color: var(--text-tip-color);
1427
+ }
1428
+ .textarea-box:hover:not(.disabled) {
1429
+ border-color: var(--border-hover-color);
1430
+ }
1431
+ .textarea-box:active {
1432
+ box-shadow: 0 0 3px var(--border-active-color);
1433
+ }
1434
+ .textarea-box:active:not(.disabled) {
1435
+ border-color: var(--border-hover-color);
1436
+ }
1437
+ .textarea-box:focus,
1438
+ .textarea-box.theme-focus {
1439
+ outline: none;
1440
+ border-color: var(--border-hover-color);
1441
+ box-shadow: 0 0 0 3px var(--border-active-color);
1442
+ }
1443
+ .textarea-box.disabled {
1444
+ opacity: 0.5;
1445
+ }
1446
+ .textarea-box .footer {
1447
+ font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
1448
+ position: absolute;
1449
+ bottom: 7px;
1450
+ right: 12px;
1451
+ font-size: 12px;
1452
+ color: var(--text-tip-color);
1453
+ }
1454
+ .textarea-box.size-sm {
1455
+ border-width: 0px;
1456
+ }
1457
+ .textarea-box.size-sm textarea {
1458
+ padding: 0;
1459
+ width: 224px;
1460
+ line-height: 20px;
1461
+ border-radius: 4px;
1462
+ font-size: 12px;
1463
+ }
1464
+ .textarea-box.size-sm .footer {
1465
+ bottom: 0px;
1466
+ }
1467
+
1468
+ .time-selector {
1469
+ position: relative;
1470
+ }
1471
+ .time-selector-select {
1472
+ position: relative;
1473
+ height: 40px;
1474
+ padding: 0 48px 0 16px;
1475
+ line-height: 40px;
1476
+ border: 1px solid var(--border-color);
1477
+ border-radius: 12px;
1478
+ font-size: 16px;
1479
+ color: var(--text-color);
1480
+ }
1481
+ .time-selector-select:hover {
1482
+ border-color: var(--border-hover-color);
1483
+ }
1484
+ .time-selector-select:active,
1485
+ .time-selector-select.active {
1486
+ border-color: var(--border-hover-color);
1487
+ box-shadow: 0 0 0 3px var(--border-active-color);
1488
+ }
1489
+ .time-selector-select:active .dropdown-icon,
1490
+ .time-selector-select.active .dropdown-icon {
1491
+ transform: rotate(180deg);
1492
+ }
1493
+ .time-selector-select .dropdown-icon {
1494
+ position: absolute;
1495
+ display: flex;
1496
+ top: 50%;
1497
+ margin-top: -12px;
1498
+ right: 8px;
1499
+ font-size: 24px;
1500
+ color: var(--text-description-color);
1501
+ transition: transform 200ms linear;
1502
+ }
1503
+ .time-selector-select .dropdown-icon svg {
1504
+ width: 24px;
1505
+ height: 24px;
1506
+ }
1507
+ .time-selector-option {
1508
+ position: absolute;
1509
+ width: 100%;
1510
+ display: flex;
1511
+ flex-wrap: wrap;
1512
+ margin-top: 4px;
1513
+ border-radius: 12px;
1514
+ background-color: var(--color-grey-bg);
1515
+ box-shadow: var(--box-shadow);
1516
+ overflow: hidden;
1517
+ font-size: 14px;
1518
+ color: var(--text-color);
1519
+ z-index: 1000;
1520
+ }
1521
+ .time-selector-option .footer {
1522
+ height: 40px;
1523
+ width: 100%;
1524
+ text-align: center;
1525
+ line-height: 40px;
1526
+ border-top: 1px solid var(--color-line);
1527
+ cursor: pointer;
1528
+ }
1529
+ .time-selector-option .footer:hover {
1530
+ background-color: var(--menu-hover);
1531
+ }
1532
+ .time-selector-option .footer:active {
1533
+ background-color: var(--menu-active);
1534
+ }
1535
+ .time-selector-minute,
1536
+ .time-selector-hour {
1537
+ width: 50%;
1538
+ padding: 8px;
1539
+ height: 210px;
1540
+ }
1541
+ .time-selector-hour {
1542
+ border-right: 1px solid var(--color-line);
1543
+ }
1544
+ .time-selector-item {
1545
+ height: 32px;
1546
+ line-height: 32px;
1547
+ border-radius: 8px;
1548
+ text-align: center;
1549
+ margin-bottom: 2px;
1550
+ }
1551
+ .time-selector-item:hover {
1552
+ background-color: var(--menu-hover);
1553
+ }
1554
+ .time-selector-item:active,
1555
+ .time-selector-item.active {
1556
+ background-color: var(--menu-active);
1557
+ }
1558
+ .time-selector-item.disabled {
1559
+ opacity: 0.5;
1560
+ background-color: transparent;
1561
+ }
1562
+ .time-selector-item:last-child {
1563
+ margin-bottom: 0;
1564
+ }
1565
+