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