layerpro 4.0.0 → 4.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/index.css CHANGED
@@ -1,504 +1,598 @@
1
1
  /* scss/index.scss */
2
- :root {
3
- --input-background-color: #444;
4
- --input-color: white;
5
- --button-background-color: #444;
6
- --button-color: white;
7
- --inputButton-fontSize: .8em;
8
- --resize-background-color: rgba(30, 150, 255, .5);
9
- --resize-shadow: 0 0 10px rgba(30, 150, 255, .5);
10
- --dock-background-color: black;
11
- --dock-height: 40px;
12
- --dock-sideLeft: 10px;
13
- --dock-sideCenter: auto;
14
- --dock-sideRight: 10px;
15
- --dock-icon-width: 140px;
16
- --bar-background:
17
- linear-gradient(
18
- 45deg,
19
- #4a4a4f 60%,
20
- #AAA 100%);
21
- --bar-selected-background:
22
- linear-gradient(
23
- 45deg,
24
- #162858 60%,
25
- #224e918a 100%);
26
- --bar-color: #eee;
27
- --bar-border-bottom: 2px solid #555;
28
- --bar-shadow: 0 1px 1px #888;
29
- --window-background: gray;
30
- --window-shadow: 0 0 10px rgba(0, 0, 0, .3);
31
- --window-border-radius: 10px;
32
- --window-z-high-border: #278ed0;
33
- --window-z-high-shadow: 0 0 15px rgba(0, 0, 0, .7);
34
- --internal-background:
35
- linear-gradient(
36
- 0deg,
37
- rgba(60, 60, 60, 1) 0%,
38
- #4a4a4f 100%);
39
- --body-color: #eee;
40
- --body-background: transparent;
41
- --modal-background: rgba(0, 0, 0, .3);
42
- --popup-z-index: 1000;
43
- --transition-time: .5s;
44
- --border-radius: 25px;
45
- --corner-size: 14px;
46
- --corner-border-radius: 50%;
47
- --hover-opacity: 1;
48
- --hover-filter: blur(3px);
49
- }
50
- #popup > [class^=popup_overflow],
51
- #popup > [class^=popup_bar_],
52
- #popup > [class^=popup_window_],
53
- #popup > [class^=popup_internal],
54
- #popup > [class^=popup_body] {
55
- position: static;
56
- }
57
- #popup > [class^=popup_overflow],
58
- #popup > [class^=popup_bar_],
59
- #popup > [class^=popup_window_],
60
- #popup > [class^=popup_internal],
61
- #popup > [class^=popup_body],
62
- #popup,
63
- #popup_dock {
64
- will-change:
65
- transform,
66
- opacity,
67
- top,
68
- left,
69
- height,
70
- width;
71
- }
72
- #popup {
73
- position: absolute;
74
- top: 0;
75
- left: 0;
76
- right: 0;
77
- bottom: 0;
78
- width: 100%;
79
- height: 100%;
80
- }
81
- #popup .buttons {
82
- display: flex;
83
- position: absolute;
84
- left: 0;
85
- right: 0;
86
- bottom: 0;
87
- height: 40px;
88
- justify-content: space-evenly;
89
- align-items: center;
90
- }
91
- #popup .buttons button {
92
- all: unset;
93
- width: 100%;
94
- height: 100%;
95
- border-right: 2px solid #636363;
96
- background:
97
- linear-gradient(
98
- 180deg,
99
- #000 0%,
100
- rgb(60, 60, 60) 100%);
101
- overflow: hidden;
102
- position: relative;
103
- color: var(--button-color);
104
- }
105
- #popup .buttons button:last-child {
106
- border-right: none;
107
- }
108
- #popup .buttons button img {
109
- filter: invert(1);
110
- opacity: 0.5;
111
- width: 15px;
112
- height: auto;
113
- margin-top: 2px;
114
- }
115
- #popup .buttons button:hover {
116
- transition: all 0.3s ease;
117
- box-shadow: inset 0 0 5px rgb(0, 0, 0);
118
- text-shadow: 0 0 15px rgb(255, 255, 255), 0 0 3px rgb(255, 255, 255);
119
- }
120
- #popup .popup_bar_selected {
121
- background: var(--bar-selected-background) !important;
122
- }
123
- #popup .zHigh {
124
- border-top-color: var(--window-z-high-border) !important;
125
- box-shadow: var(--window-z-high-shadow) !important;
126
- border: 1px solid rgba(0, 0, 0, 0.05);
127
- }
128
- #popup [class*=popup_modal_] {
129
- position: absolute;
130
- inset: 0;
131
- width: 100%;
132
- height: 100%;
133
- background-color: var(--modal-background);
134
- z-index: 1;
135
- }
136
- #popup [class*=popup_window_] {
137
- position: absolute;
138
- inset: 0;
139
- width: 100%;
140
- height: 100%;
141
- z-index: 2;
142
- border-radius: var(--window-border-radius);
143
- box-shadow: var(--window-shadow);
144
- overflow: hidden;
145
- }
146
- #popup [class*=popup_overflow_] {
147
- position: absolute;
148
- inset: auto;
149
- z-index: 3;
150
- border-radius: var(--window-border-radius);
151
- background: var(--window-background);
152
- }
153
- #popup .popup_bar,
154
- #popup [class*=popup_bar_] {
155
- display: flex;
156
- width: 100%;
157
- height: 36px;
158
- background: var(--bar-background);
159
- border-bottom: var(--bar-border-bottom);
160
- box-shadow: var(--bar-shadow);
161
- z-index: 2;
162
- }
163
- #popup [class*=popup_drag_] {
164
- width: 100%;
165
- padding: 10px 0 0 10px;
166
- color: var(--bar-color);
167
- text-overflow: ellipsis;
168
- white-space: nowrap;
169
- overflow: hidden;
170
- }
171
- #popup [class*=popup_icon_] {
172
- padding: 8px 0 0 10px;
173
- color: var(--bar-color);
174
- font-size: 1.1em;
175
- }
176
- #popup [class*=popup_option_] {
177
- display: flex;
178
- margin-right: 15px;
179
- }
180
- #popup [class*=popup_option_] button {
181
- position: relative;
182
- display: inline-block;
183
- width: 36px;
184
- height: 28px;
185
- color: white;
186
- border-radius: 5px;
187
- margin: 4px;
188
- transition: all 0.3s ease;
189
- background: transparent;
190
- }
191
- #popup [class*=popup_option_] button img {
192
- filter: invert(1);
193
- opacity: 0.5;
194
- width: 15px;
195
- height: auto;
196
- margin-top: 2px;
197
- }
198
- #popup [class*=popup_option_] button:after {
199
- content: "";
200
- inset: 0;
201
- display: block;
202
- position: absolute;
203
- background:
204
- linear-gradient(
205
- 180deg,
206
- #000 0%,
207
- rgb(60, 60, 60) 100%);
208
- border-radius: 5px;
209
- z-index: -1;
210
- }
211
- #popup [class*=popup_option_] button:after {
212
- opacity: 0;
213
- transition: opacity 0.3s ease-in-out;
214
- }
215
- #popup [class*=popup_option_] button:hover {
216
- background: rgba(255, 255, 255, 0.1);
217
- box-shadow: inset 0 0 5px rgb(0, 0, 0);
218
- text-shadow: 0 0 15px rgb(255, 255, 255), 0 0 3px rgb(255, 255, 255);
219
- }
220
- #popup [class*=popup_option_] button:hover::after {
221
- opacity: 1;
222
- }
223
- #popup [class*=popup_option_] button [class*=button_close_]:hover {
224
- background: rgb(255, 0, 0) !important;
225
- box-shadow: inset 0 0 25px rgb(255, 255, 255), 0 0 35px rgb(255, 0, 0) !important;
226
- }
227
- #popup [class*=button_close_]:hover {
228
- background: rgb(255, 0, 0) !important;
229
- box-shadow: inset 0 0 25px rgb(255, 255, 255), 0 0 35px rgb(255, 0, 0) !important;
230
- }
231
- #popup [class*=popup_internal_] {
232
- position: absolute;
233
- inset: 37px 0 0 0;
234
- z-index: 1;
235
- background: var(--internal-background);
236
- }
237
- #popup .popup_body,
238
- #popup [class*=popup_body_] {
239
- position: absolute;
240
- inset: 0;
241
- color: var(--body-color);
242
- background: var(--body-background);
243
- text-align: center;
244
- }
245
- .popupMaxSize {
246
- position: absolute !important;
247
- width: 100% !important;
248
- height: 100% !important;
249
- inset: 0 !important;
250
- margin: 0 !important;
251
- padding: 0 !important;
252
- border-radius: 0 !important;
253
- }
254
- #popup_dock {
255
- position: absolute;
256
- bottom: 0;
257
- left: 0;
258
- right: 0;
259
- height: var(--dock-height);
260
- background-color: var(--dock-background-color);
261
- border-top: 1px solid rgba(255, 255, 255, 0.521);
262
- }
263
- #popup_dock #popup_dock_icon {
264
- position: absolute;
265
- top: 3px;
266
- left: 3px;
267
- width: 70px;
268
- height: var(--dock-height);
269
- }
270
- #popup_dock #popup_dock_list {
271
- position: absolute;
272
- top: 3px;
273
- left: var(--dock-sideLeft);
274
- right: var(--dock-sideLeft);
275
- height: calc(var(--dock-height) - 5px);
276
- overflow-y: auto;
277
- text-align: right;
278
- display: flex;
279
- flex-direction: row;
280
- justify-content: flex-end;
281
- height: 30px;
282
- }
283
- #popup_dock #popup_dock_list [class^=icon_] {
284
- width: var(--dock-icon-width);
285
- float: left;
286
- padding: 4px;
287
- color: white;
288
- margin: 2px 3px 0 0;
289
- display: flex;
290
- flex-direction: row;
291
- flex-wrap: nowrap;
292
- justify-content: flex-start;
293
- filter: saturate(400%);
294
- }
295
- #popup_dock #popup_dock_list [class^=icon_]:hover {
296
- background-color: rgb(77, 77, 77);
297
- }
298
- #popup_dock #popup_dock_list [class^=icon_] span:nth-child(1) {
299
- width: 20%;
300
- text-align: center;
301
- color: #F60;
302
- }
303
- #popup_dock #popup_dock_list [class^=icon_] span:nth-child(2) {
304
- width: 80%;
305
- text-align: left;
306
- text-overflow: ellipsis;
307
- white-space: nowrap;
308
- overflow: hidden;
309
- }
310
- #popup_dock #popup_dock_list [class^=icon_] button {
311
- width: 20px;
312
- height: 20px;
313
- color: white;
314
- padding: 4px;
315
- margin: 0;
316
- display: flex;
317
- align-content: center;
318
- justify-content: center;
319
- font-size: 0.7em;
320
- border: none;
321
- background: none;
322
- }
323
- #popup_dock #popup_dock_options {
324
- position: absolute;
325
- top: 3px;
326
- right: 10px;
327
- width: var(--dock-sideRight);
328
- height: var(--dock-height);
329
- }
330
- #popup .iconize:before,
331
- #popup .maximize:before,
332
- #popup .close:before {
333
- content: "";
334
- position: absolute;
335
- inset: 0;
336
- background-repeat: no-repeat !important;
337
- background-position: center !important;
338
- background-size: 50% !important;
339
- filter: invert(1);
340
- opacity: 0.5;
341
- margin: 0;
342
- padding: 0;
343
- }
344
- #popup .iconize:before {
345
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9Imljb25pemUuc3ZnIgogICB4bWxuczppbmtzY2FwZT0iaHR0cDovL3d3dy5pbmtzY2FwZS5vcmcvbmFtZXNwYWNlcy9pbmtzY2FwZSIKICAgeG1sbnM6c29kaXBvZGk9Imh0dHA6Ly9zb2RpcG9kaS5zb3VyY2Vmb3JnZS5uZXQvRFREL3NvZGlwb2RpLTAuZHRkIgogICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIKICAgeG1sbnM6Y2M9Imh0dHA6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL25zIyIKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIj4KICA8ZGVmcwogICAgIGlkPSJkZWZzMzc2MiIgLz4KICA8c29kaXBvZGk6bmFtZWR2aWV3CiAgICAgaWQ9ImJhc2UiCiAgICAgcGFnZWNvbG9yPSIjZmZmZmZmIgogICAgIGJvcmRlcmNvbG9yPSIjNjY2NjY2IgogICAgIGJvcmRlcm9wYWNpdHk9IjEuMCIKICAgICBpbmtzY2FwZTpwYWdlb3BhY2l0eT0iMC4wIgogICAgIGlua3NjYXBlOnBhZ2VzaGFkb3c9IjIiCiAgICAgaW5rc2NhcGU6em9vbT0iNS42IgogICAgIGlua3NjYXBlOmN4PSI5LjkxMDcxNDMiCiAgICAgaW5rc2NhcGU6Y3k9IjY4LjM5Mjg1NyIKICAgICBpbmtzY2FwZTpkb2N1bWVudC11bml0cz0ibW0iCiAgICAgaW5rc2NhcGU6Y3VycmVudC1sYXllcj0ibGF5ZXIxIgogICAgIHNob3dncmlkPSJmYWxzZSIKICAgICB1bml0cz0icHgiCiAgICAgaW5rc2NhcGU6d2luZG93LXdpZHRoPSIxOTIwIgogICAgIGlua3NjYXBlOndpbmRvdy1oZWlnaHQ9IjEwMjciCiAgICAgaW5rc2NhcGU6d2luZG93LXg9Ii04IgogICAgIGlua3NjYXBlOndpbmRvdy15PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3ctbWF4aW1pemVkPSIxIgogICAgIGlua3NjYXBlOnBhZ2VjaGVja2VyYm9hcmQ9IjAiIC8+CiAgPG1ldGFkYXRhCiAgICAgaWQ9Im1ldGFkYXRhMzc2NSI+CiAgICA8cmRmOlJERj4KICAgICAgPGNjOldvcmsKICAgICAgICAgcmRmOmFib3V0PSIiPgogICAgICAgIDxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PgogICAgICAgIDxkYzp0eXBlCiAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz4KICAgICAgPC9jYzpXb3JrPgogICAgPC9yZGY6UkRGPgogIDwvbWV0YWRhdGE+CiAgPGcKICAgICBpbmtzY2FwZTpsYWJlbD0iTGF5ZXIgMSIKICAgICBpbmtzY2FwZTpncm91cG1vZGU9ImxheWVyIgogICAgIGlkPSJsYXllcjEiCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMjkxLjcwODMyKSI+CiAgICA8cmVjdAogICAgICAgcnk9IjAuNjk5MTc0MjMiCiAgICAgICB5PSIyOTMuNjkyNzgiCiAgICAgICB4PSIwLjI3NDg0NjczIgogICAgICAgaGVpZ2h0PSIxLjM5ODM0ODUiCiAgICAgICB3aWR0aD0iNC43NjI0OTk4IgogICAgICAgaWQ9InJlY3QzNzM2LTciCiAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO3N0cm9rZS13aWR0aDowLjEzMjk5MTg1IiAvPgogIDwvZz4KPC9zdmc+Cg==) !important;
346
- }
347
- #popup .maximize:before {
348
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9Im1heGltaXplLnN2ZyIKICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiCiAgIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIKICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiCiAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczM3NjIiIC8+CiAgPHNvZGlwb2RpOm5hbWVkdmlldwogICAgIGlkPSJiYXNlIgogICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIKICAgICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgICBib3JkZXJvcGFjaXR5PSIxLjAiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnpvb209IjcuOTE5NTk1OSIKICAgICBpbmtzY2FwZTpjeD0iNC45ODc2MjgyIgogICAgIGlua3NjYXBlOmN5PSIyNS4zODAwODMiCiAgICAgaW5rc2NhcGU6ZG9jdW1lbnQtdW5pdHM9Im1tIgogICAgIGlua3NjYXBlOmN1cnJlbnQtbGF5ZXI9ImxheWVyMSIKICAgICBzaG93Z3JpZD0iZmFsc2UiCiAgICAgdW5pdHM9InB4IgogICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTkyMCIKICAgICBpbmtzY2FwZTp3aW5kb3ctaGVpZ2h0PSIxMDI3IgogICAgIGlua3NjYXBlOndpbmRvdy14PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3cteT0iLTgiCiAgICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIKICAgICBpbmtzY2FwZTpwYWdlY2hlY2tlcmJvYXJkPSIwIiAvPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTM3NjUiPgogICAgPHJkZjpSREY+CiAgICAgIDxjYzpXb3JrCiAgICAgICAgIHJkZjphYm91dD0iIj4KICAgICAgICA8ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD4KICAgICAgICA8ZGM6dHlwZQogICAgICAgICAgIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+CiAgICAgIDwvY2M6V29yaz4KICAgIDwvcmRmOlJERj4KICA8L21ldGFkYXRhPgogIDxnCiAgICAgaW5rc2NhcGU6bGFiZWw9IkxheWVyIDEiCiAgICAgaW5rc2NhcGU6Z3JvdXBtb2RlPSJsYXllciIKICAgICBpZD0ibGF5ZXIxIgogICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTI5MS43MDgzMikiPgogICAgPHJlY3QKICAgICAgIHN0eWxlPSJmaWxsOiMwMDAwMDA7c3Ryb2tlLXdpZHRoOjAuMTQ3MDQ1NCIKICAgICAgIGlkPSJyZWN0MzczMiIKICAgICAgIHdpZHRoPSI0Ljc2MjQ5OTgiCiAgICAgICBoZWlnaHQ9IjQuNzYyNDk5OCIKICAgICAgIHg9IjAuMjkxODUyNTMiCiAgICAgICB5PSIyOTIuMDEwNDQiCiAgICAgICByeT0iMC42NjcxMjEyMyIgLz4KICA8L2c+Cjwvc3ZnPgo=) !important;
349
- }
350
- #popup .close:before {
351
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9ImNsb3NlLnN2ZyIKICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiCiAgIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIKICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiCiAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczM3NjIiIC8+CiAgPHNvZGlwb2RpOm5hbWVkdmlldwogICAgIGlkPSJiYXNlIgogICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIKICAgICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgICBib3JkZXJvcGFjaXR5PSIxLjAiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnpvb209IjcuOTE5NTk1OSIKICAgICBpbmtzY2FwZTpjeD0iNC45ODc2MjgyIgogICAgIGlua3NjYXBlOmN5PSIyNS4zODAwODMiCiAgICAgaW5rc2NhcGU6ZG9jdW1lbnQtdW5pdHM9Im1tIgogICAgIGlua3NjYXBlOmN1cnJlbnQtbGF5ZXI9ImxheWVyMSIKICAgICBzaG93Z3JpZD0iZmFsc2UiCiAgICAgdW5pdHM9InB4IgogICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTkyMCIKICAgICBpbmtzY2FwZTp3aW5kb3ctaGVpZ2h0PSIxMDI3IgogICAgIGlua3NjYXBlOndpbmRvdy14PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3cteT0iLTgiCiAgICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIKICAgICBpbmtzY2FwZTpwYWdlY2hlY2tlcmJvYXJkPSIwIiAvPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTM3NjUiPgogICAgPHJkZjpSREY+CiAgICAgIDxjYzpXb3JrCiAgICAgICAgIHJkZjphYm91dD0iIj4KICAgICAgICA8ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD4KICAgICAgICA8ZGM6dHlwZQogICAgICAgICAgIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+CiAgICAgIDwvY2M6V29yaz4KICAgIDwvcmRmOlJERj4KICA8L21ldGFkYXRhPgogIDxnCiAgICAgaW5rc2NhcGU6bGFiZWw9IkxheWVyIDEiCiAgICAgaW5rc2NhcGU6Z3JvdXBtb2RlPSJsYXllciIKICAgICBpZD0ibGF5ZXIxIgogICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTI5MS43MDgzMikiPgogICAgPHBhdGgKICAgICAgIHN0eWxlPSJmaWxsOiMwMDAwMDA7c3Ryb2tlLXdpZHRoOjAuMTQ5MDI2NjMiCiAgICAgICBkPSJtIDAuOTY5NDI2NTUsMjkxLjk4MjY1IGMgLTAuMTczMTcsMCAtMC4zNDYzMSwwLjA2NjYgLTAuNDc5LDAuMTk5MjcgLTAuMjY1MzgsMC4yNjUzNyAtMC4yNjUzOCwwLjY5MjQ0IDAsMC45NTc4MSBsIDEuMjI0MjA5OTUsMS4yMjQxNyAtMS4yMjQyMDk5NSwxLjIyNDE3IGMgLTAuMjY1MzgsMC4yNjUzNyAtMC4yNjUzOCwwLjY5MjQ0IDAsMC45NTc4MSAwLjI2NTM4LDAuMjY1MzcgMC42OTI2MDk5NSwwLjI2NTM3IDAuOTU3OTg5OTUsMCBsIDEuMjI0MjEsLTEuMjI0MTcgMS4yMjQyMDgsMS4yMjQxNyBjIDAuMTMyNjkyLDAuMTMyNjggMC4zMDU4MywwLjE5OTI3IDAuNDc4OTkxLDAuMTk5MjcgMC4wNDMzLDAgMC4wODY3LC0wLjAwNCAwLjEyOTM3OSwtMC4wMTI1IDAuMTI3OTcxLC0wLjAyNDkgMC4yNTAxLC0wLjA4NzIgMC4zNDk2MiwtMC4xODY3NiAwLjAzMzIsLTAuMDMzMiAwLjA2MjMsLTAuMDY4NiAwLjA4NzEsLTAuMTA2MTQgMC4xNzQxNiwtMC4yNjMxOSAwLjE0NTA2OSwtMC42MTk0NiAtMC4wODcxLC0wLjg1MTY2IGwgLTEuMjI0MjA4LC0xLjIyNDE3IDEuMjI0MjA4LC0xLjIyNDE3IGMgMC4yNjUzNywtMC4yNjUzNyAwLjI2NTM3LC0wLjY5MjQ0IDAsLTAuOTU3ODEgLTAuMjY1Mzc5LC0wLjI2NTM3IC0wLjY5MjYxLC0wLjI2NTM3IC0wLjk1Nzk5LDAgbCAtMS4yMjQyMDgsMS4yMjQxNyAtMS4yMjQyMSwtMS4yMjQxNyBjIC0wLjEzMjY5LC0wLjEzMjY5IC0wLjMwNTgzLC0wLjE5OTI3IC0wLjQ3ODk4OTk1LC0wLjE5OTI3IHoiCiAgICAgICBpZD0icmVjdDM3MTUiCiAgICAgICBpbmtzY2FwZTpjb25uZWN0b3ItY3VydmF0dXJlPSIwIiAvPgogIDwvZz4KPC9zdmc+Cg==) !important;
352
- }
353
- #popup > input,
354
- #popup > button,
355
- #popup > textarea,
356
- #popup > select {
357
- all: unset;
358
- }
359
- .popup_alert,
360
- .popup_message,
361
- .popup_prompt,
362
- .popup_confirm {
363
- height: calc(100% - 41px);
364
- box-shadow: 0 1px 1px #888;
365
- overflow: auto;
366
- padding: 20px;
367
- word-break: break-all;
368
- }
369
- .popup_alert input[type=text],
370
- .popup_message input[type=text],
371
- .popup_prompt input[type=text],
372
- .popup_confirm input[type=text] {
373
- position: relative;
374
- width: 90%;
375
- height: 35px;
376
- padding: 5px;
377
- font-size: 1.05em;
378
- border: 2px solid rgba(0, 0, 0, 0.3);
379
- border-radius: 6px;
380
- color: #ddd;
381
- background-color: #4a4a4f;
382
- }
383
- .popup_window___alert #a___alert,
384
- .popup_window___alert #a___message,
385
- .popup_window___message #a___alert,
386
- .popup_window___message #a___message {
387
- width: 100% !important;
388
- }
389
- .popup_window___prompt #a___alert,
390
- .popup_window___prompt #b___alert,
391
- .popup_window___prompt #a___message,
392
- .popup_window___prompt #b___message,
393
- .popup_window___confirm #a___alert,
394
- .popup_window___confirm #b___alert,
395
- .popup_window___confirm #a___message,
396
- .popup_window___confirm #b___message {
397
- width: 50% !important;
398
- }
399
- .resize_0,
400
- .resize_1,
401
- .resize_2,
402
- .resize_3 {
403
- position: absolute;
404
- background-color: var(--resize-background-color);
405
- border-radius: var(--border-radius);
406
- opacity: 0;
407
- z-index: 5000;
408
- transition: var(--transition-time);
409
- }
410
- .resize_0 {
411
- top: -4px;
412
- left: 0;
413
- width: 100%;
414
- height: 10px;
415
- cursor: n-resize;
416
- }
417
- .resize_1 {
418
- top: 0;
419
- right: -4px;
420
- width: 10px;
421
- height: 100%;
422
- cursor: e-resize;
423
- }
424
- .resize_2 {
425
- bottom: -4px;
426
- left: 0;
427
- width: 100%;
428
- height: 10px;
429
- cursor: n-resize;
430
- }
431
- .resize_3 {
432
- top: 0;
433
- left: -4px;
434
- width: 10px;
435
- height: 100%;
436
- cursor: e-resize;
437
- }
438
- .resize_corner_0,
439
- .resize_corner_1,
440
- .resize_corner_2,
441
- .resize_corner_3 {
442
- position: absolute;
443
- background-color: var(--resize-background-color);
444
- border-radius: var(--border-radius);
445
- opacity: 0;
446
- z-index: 5000;
447
- transition: var(--transition-time);
448
- width: var(--corner-size);
449
- height: var(--corner-size);
450
- border-radius: var(--corner-border-radius);
451
- }
452
- .resize_corner_0 {
453
- top: -4px;
454
- left: -4px;
455
- cursor: nw-resize;
456
- }
457
- .resize_corner_1 {
458
- top: -4px;
459
- right: -4px;
460
- cursor: ne-resize;
461
- }
462
- .resize_corner_2 {
463
- bottom: -4px;
464
- right: -4px;
465
- cursor: nw-resize;
466
- }
467
- .resize_corner_3 {
468
- bottom: -4px;
469
- left: -4px;
470
- cursor: ne-resize;
471
- }
472
- .resize_0:hover,
473
- .resize_1:hover,
474
- .resize_2:hover,
475
- .resize_3:hover,
476
- .resize_corner_0:hover,
477
- .resize_corner_1:hover,
478
- .resize_corner_2:hover,
479
- .resize_corner_3:hover {
480
- opacity: var(--hover-opacity);
481
- filter: var(--hover-filter);
482
- box-shadow: var(--resize-shadow);
483
- transition: var(--transition-time);
484
- }
485
- #popup {
486
- }
487
- #popup ::-webkit-scrollbar {
488
- width: 10px;
489
- scroll-behavior: smooth;
490
- }
491
- #popup {
492
- }
493
- #popup ::-webkit-scrollbar-track {
494
- -webkit-border-radius: 2px;
495
- border-radius: 2px;
496
- margin: 5px;
497
- }
498
- #popup {
499
- }
500
- #popup ::-webkit-scrollbar-thumb {
501
- -webkit-border-radius: 2px;
502
- border-radius: 2px;
503
- background: rgb(30, 150, 255) !important;
2
+ @layer layerpro {
3
+ :root {
4
+ --input-background-color: #444;
5
+ --input-color: white;
6
+ --button-background-color: #444;
7
+ --button-color: white;
8
+ --inputButton-fontSize: .8em;
9
+ --resize-background-color: rgba(30, 150, 255, .5);
10
+ --resize-shadow: 0 0 10px rgba(30, 150, 255, .5);
11
+ --dock-background-color: black;
12
+ --dock-height: 40px;
13
+ --dock-sideLeft: 10px;
14
+ --dock-sideCenter: auto;
15
+ --dock-sideRight: 10px;
16
+ --dock-icon-width: 140px;
17
+ --bar-background:
18
+ linear-gradient(
19
+ 45deg,
20
+ #4a4a4f 60%,
21
+ #AAA 100%);
22
+ --bar-selected-background:
23
+ linear-gradient(
24
+ 45deg,
25
+ #162858 60%,
26
+ #224e918a 100%);
27
+ --bar-color: #eee;
28
+ --bar-border-bottom: 2px solid #555;
29
+ --bar-shadow: 0 1px 1px #888;
30
+ --window-background: gray;
31
+ --window-shadow: 0 0 10px rgba(0, 0, 0, .3);
32
+ --window-border-radius: 10px;
33
+ --window-z-high-border: #278ed0;
34
+ --window-z-high-shadow: 0 0 15px rgba(0, 0, 0, .7);
35
+ --internal-background:
36
+ linear-gradient(
37
+ 0deg,
38
+ rgba(60, 60, 60, 1) 0%,
39
+ #4a4a4f 100%);
40
+ --body-color: #eee;
41
+ --body-background: transparent;
42
+ --modal-background: rgba(0, 0, 0, .3);
43
+ --popup-z-index: 1000;
44
+ --transition-time: .5s;
45
+ --border-radius: 25px;
46
+ --corner-size: 14px;
47
+ --corner-border-radius: 50%;
48
+ --hover-opacity: 1;
49
+ --hover-filter: blur(3px);
50
+ }
51
+ }
52
+ @layer layerpro {
53
+ #popup > [class^=popup_overflow],
54
+ #popup > [class^=popup_bar_],
55
+ #popup > [class^=popup_window_],
56
+ #popup > [class^=popup_internal],
57
+ #popup > [class^=popup_body] {
58
+ position: static;
59
+ }
60
+ #popup > [class^=popup_overflow],
61
+ #popup > [class^=popup_bar_],
62
+ #popup > [class^=popup_window_],
63
+ #popup > [class^=popup_internal],
64
+ #popup > [class^=popup_body],
65
+ #popup,
66
+ #popup_dock {
67
+ will-change:
68
+ transform,
69
+ opacity,
70
+ top,
71
+ left,
72
+ height,
73
+ width;
74
+ }
75
+ #popup {
76
+ position: absolute;
77
+ top: 0;
78
+ left: 0;
79
+ right: 0;
80
+ bottom: 0;
81
+ width: 100%;
82
+ height: 100%;
83
+ pointer-events: none;
84
+ z-index: var(--lp-z-index, 1001);
85
+ }
86
+ #popup .buttons {
87
+ display: flex;
88
+ position: absolute;
89
+ left: 0;
90
+ right: 0;
91
+ bottom: 0;
92
+ height: 40px;
93
+ justify-content: space-evenly;
94
+ align-items: center;
95
+ }
96
+ #popup .buttons button {
97
+ all: unset;
98
+ width: 100%;
99
+ height: 100%;
100
+ border-right: 2px solid #636363;
101
+ background:
102
+ linear-gradient(
103
+ 180deg,
104
+ #000 0%,
105
+ rgb(60, 60, 60) 100%);
106
+ overflow: hidden;
107
+ position: relative;
108
+ color: var(--button-color);
109
+ }
110
+ #popup .buttons button:last-child {
111
+ border-right: none;
112
+ }
113
+ #popup .buttons button img {
114
+ filter: invert(1);
115
+ opacity: 0.5;
116
+ width: 15px;
117
+ height: auto;
118
+ margin-top: 2px;
119
+ }
120
+ #popup .buttons button:hover {
121
+ transition: all 0.3s ease;
122
+ box-shadow: inset 0 0 5px rgb(0, 0, 0);
123
+ text-shadow: 0 0 15px rgb(255, 255, 255), 0 0 3px rgb(255, 255, 255);
124
+ }
125
+ #popup .popup_bar_selected {
126
+ background: var(--bar-selected-background) !important;
127
+ }
128
+ #popup .zHigh {
129
+ border-top-color: var(--window-z-high-border) !important;
130
+ box-shadow: var(--window-z-high-shadow) !important;
131
+ border: 1px solid rgba(0, 0, 0, 0.05);
132
+ }
133
+ #popup [class*=popup_modal_] {
134
+ position: absolute;
135
+ inset: 0;
136
+ width: 100%;
137
+ height: 100%;
138
+ background-color: var(--modal-background);
139
+ pointer-events: auto;
140
+ z-index: var(--lp-z-index, 1);
141
+ }
142
+ #popup [class*=popup_window_] {
143
+ position: absolute;
144
+ inset: 0;
145
+ width: 100%;
146
+ height: 100%;
147
+ z-index: 2;
148
+ pointer-events: auto;
149
+ border-radius: var(--window-border-radius);
150
+ box-shadow: var(--window-shadow);
151
+ overflow: hidden;
152
+ }
153
+ #popup [class*=popup_overflow_] {
154
+ position: absolute;
155
+ inset: auto;
156
+ top: var(--lp-top, auto);
157
+ left: var(--lp-left, auto);
158
+ right: var(--lp-right, auto);
159
+ bottom: var(--lp-bottom, auto);
160
+ width: var(--lp-width, auto);
161
+ height: var(--lp-height, auto);
162
+ min-width: var(--lp-min-width, auto);
163
+ min-height: var(--lp-min-height, auto);
164
+ max-width: var(--lp-max-width, none);
165
+ max-height: var(--lp-max-height, none);
166
+ z-index: var(--lp-z-index, 3);
167
+ pointer-events: auto;
168
+ border-radius: var(--window-border-radius);
169
+ background: var(--window-background);
170
+ }
171
+ #popup .popup_bar,
172
+ #popup [class*=popup_bar_] {
173
+ display: flex;
174
+ width: 100%;
175
+ height: 36px;
176
+ background: var(--bar-background);
177
+ border-bottom: var(--bar-border-bottom);
178
+ box-shadow: var(--bar-shadow);
179
+ z-index: 2;
180
+ }
181
+ #popup [class*=popup_drag_] {
182
+ width: 100%;
183
+ padding: 10px 0 0 10px;
184
+ color: var(--bar-color);
185
+ text-overflow: ellipsis;
186
+ white-space: nowrap;
187
+ overflow: hidden;
188
+ }
189
+ #popup [class*=popup_icon_] {
190
+ padding: 8px 0 0 10px;
191
+ color: var(--bar-color);
192
+ font-size: 1.1em;
193
+ }
194
+ #popup [class*=popup_option_] {
195
+ display: flex;
196
+ margin-right: 15px;
197
+ }
198
+ #popup [class*=popup_option_] button {
199
+ position: relative;
200
+ display: inline-block;
201
+ width: 36px;
202
+ height: 28px;
203
+ color: white;
204
+ border-radius: 5px;
205
+ margin: 4px;
206
+ transition: all 0.3s ease;
207
+ background: transparent;
208
+ }
209
+ #popup [class*=popup_option_] button img {
210
+ filter: invert(1);
211
+ opacity: 0.5;
212
+ width: 15px;
213
+ height: auto;
214
+ margin-top: 2px;
215
+ }
216
+ #popup [class*=popup_option_] button:after {
217
+ content: "";
218
+ inset: 0;
219
+ display: block;
220
+ position: absolute;
221
+ background:
222
+ linear-gradient(
223
+ 180deg,
224
+ #000 0%,
225
+ rgb(60, 60, 60) 100%);
226
+ border-radius: 5px;
227
+ z-index: -1;
228
+ }
229
+ #popup [class*=popup_option_] button:after {
230
+ opacity: 0;
231
+ transition: opacity 0.3s ease-in-out;
232
+ }
233
+ #popup [class*=popup_option_] button:hover {
234
+ background: rgba(255, 255, 255, 0.1);
235
+ box-shadow: inset 0 0 5px rgb(0, 0, 0);
236
+ text-shadow: 0 0 15px rgb(255, 255, 255), 0 0 3px rgb(255, 255, 255);
237
+ }
238
+ #popup [class*=popup_option_] button:hover::after {
239
+ opacity: 1;
240
+ }
241
+ #popup [class*=popup_option_] button [class*=button_close_]:hover {
242
+ background: rgb(255, 0, 0) !important;
243
+ box-shadow: inset 0 0 25px rgb(255, 255, 255), 0 0 35px rgb(255, 0, 0) !important;
244
+ }
245
+ #popup [class*=button_close_]:hover {
246
+ background: rgb(255, 0, 0) !important;
247
+ box-shadow: inset 0 0 25px rgb(255, 255, 255), 0 0 35px rgb(255, 0, 0) !important;
248
+ }
249
+ #popup [class*=popup_internal_] {
250
+ position: absolute;
251
+ inset: 37px 0 0 0;
252
+ z-index: 1;
253
+ background: var(--internal-background);
254
+ }
255
+ #popup .popup_body,
256
+ #popup [class*=popup_body_] {
257
+ position: absolute;
258
+ inset: 0;
259
+ color: var(--body-color);
260
+ background: var(--body-background);
261
+ text-align: center;
262
+ }
263
+ .popupMaxSize {
264
+ position: absolute !important;
265
+ width: 100% !important;
266
+ height: 100% !important;
267
+ inset: 0 !important;
268
+ margin: 0 !important;
269
+ padding: 0 !important;
270
+ border-radius: 0 !important;
271
+ }
272
+ }
273
+ @layer layerpro {
274
+ #popup .lp_hidden {
275
+ display: none;
276
+ }
277
+ #popup .lp_fade_in {
278
+ opacity: 1;
279
+ transition: opacity var(--lp-fade-duration, 100ms) ease;
280
+ }
281
+ #popup .lp_fade_out {
282
+ opacity: 0;
283
+ transition: opacity var(--lp-fade-duration, 100ms) ease;
284
+ }
285
+ #popup .lp_no_transition {
286
+ transition: none;
287
+ }
288
+ #popup .popup_maximized {
289
+ position: fixed;
290
+ top: -6px;
291
+ left: -6px;
292
+ right: -6px;
293
+ bottom: -6px;
294
+ width: auto;
295
+ height: auto;
296
+ }
297
+ #popup .popup_iconized {
298
+ width: 0;
299
+ height: 0;
300
+ opacity: 0;
301
+ }
302
+ #popup .popup_dimmed {
303
+ opacity: 0.5;
304
+ }
305
+ #popup [class*=popup_body_].popup_content_hidden {
306
+ content-visibility: hidden;
307
+ }
308
+ #popup [class*=popup_body_].popup_content_visible {
309
+ content-visibility: visible;
310
+ }
311
+ #popup .lp_no_pointer {
312
+ pointer-events: none;
313
+ }
314
+ #popup .lp_pointer {
315
+ pointer-events: auto;
316
+ }
317
+ #popup .lp_no_touch {
318
+ touch-action: none;
319
+ }
320
+ body.lp_page_locked {
321
+ pointer-events: none;
322
+ }
323
+ }
324
+ @layer layerpro {
325
+ #root.layerpro-dock,
326
+ html.layerpro-dock,
327
+ body.layerpro-dock {
328
+ position: absolute;
329
+ top: 0;
330
+ right: 0;
331
+ left: 0;
332
+ bottom: var(--dock-height) !important;
333
+ overflow-y: auto !important;
334
+ }
335
+ #popup_dock {
336
+ position: fixed;
337
+ bottom: 0;
338
+ left: 0;
339
+ right: 0;
340
+ height: var(--dock-height);
341
+ pointer-events: auto;
342
+ z-index: var(--lp-z-index, 1001);
343
+ background-color: var(--dock-background-color);
344
+ border-top: 1px solid rgba(255, 255, 255, 0.521);
345
+ }
346
+ #popup_dock #popup_dock_icon {
347
+ position: absolute;
348
+ top: 3px;
349
+ left: 3px;
350
+ width: 70px;
351
+ height: var(--dock-height);
352
+ }
353
+ #popup_dock #popup_dock_list {
354
+ position: absolute;
355
+ top: 3px;
356
+ left: var(--dock-sideLeft);
357
+ right: var(--dock-sideLeft);
358
+ height: calc(var(--dock-height) - 5px);
359
+ overflow-y: auto;
360
+ text-align: right;
361
+ display: flex;
362
+ flex-direction: row;
363
+ justify-content: flex-end;
364
+ height: 30px;
365
+ }
366
+ #popup_dock #popup_dock_list [class^=icon_] {
367
+ width: var(--dock-icon-width);
368
+ float: left;
369
+ padding: 4px;
370
+ color: white;
371
+ margin: 2px 3px 0 0;
372
+ display: flex;
373
+ flex-direction: row;
374
+ flex-wrap: nowrap;
375
+ justify-content: flex-start;
376
+ filter: saturate(400%);
377
+ }
378
+ #popup_dock #popup_dock_list [class^=icon_]:hover {
379
+ background-color: rgb(77, 77, 77);
380
+ }
381
+ #popup_dock #popup_dock_list [class^=icon_] span:nth-child(1) {
382
+ width: 20%;
383
+ text-align: center;
384
+ color: #F60;
385
+ }
386
+ #popup_dock #popup_dock_list [class^=icon_] span:nth-child(2) {
387
+ width: 80%;
388
+ text-align: left;
389
+ text-overflow: ellipsis;
390
+ white-space: nowrap;
391
+ overflow: hidden;
392
+ }
393
+ #popup_dock #popup_dock_list [class^=icon_] button {
394
+ width: 20px;
395
+ height: 20px;
396
+ color: white;
397
+ padding: 4px;
398
+ margin: 0;
399
+ display: flex;
400
+ align-content: center;
401
+ justify-content: center;
402
+ font-size: 0.7em;
403
+ border: none;
404
+ background: none;
405
+ }
406
+ #popup_dock #popup_dock_options {
407
+ position: absolute;
408
+ top: 3px;
409
+ right: 10px;
410
+ width: var(--dock-sideRight);
411
+ height: var(--dock-height);
412
+ }
413
+ }
414
+ @layer layerpro {
415
+ #popup .iconize:before,
416
+ #popup .maximize:before,
417
+ #popup .close:before {
418
+ content: "";
419
+ position: absolute;
420
+ inset: 0;
421
+ background-repeat: no-repeat !important;
422
+ background-position: center !important;
423
+ background-size: 50% !important;
424
+ filter: invert(1);
425
+ opacity: 0.5;
426
+ margin: 0;
427
+ padding: 0;
428
+ }
429
+ #popup .iconize:before {
430
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9Imljb25pemUuc3ZnIgogICB4bWxuczppbmtzY2FwZT0iaHR0cDovL3d3dy5pbmtzY2FwZS5vcmcvbmFtZXNwYWNlcy9pbmtzY2FwZSIKICAgeG1sbnM6c29kaXBvZGk9Imh0dHA6Ly9zb2RpcG9kaS5zb3VyY2Vmb3JnZS5uZXQvRFREL3NvZGlwb2RpLTAuZHRkIgogICB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIKICAgeG1sbnM6Y2M9Imh0dHA6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL25zIyIKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIj4KICA8ZGVmcwogICAgIGlkPSJkZWZzMzc2MiIgLz4KICA8c29kaXBvZGk6bmFtZWR2aWV3CiAgICAgaWQ9ImJhc2UiCiAgICAgcGFnZWNvbG9yPSIjZmZmZmZmIgogICAgIGJvcmRlcmNvbG9yPSIjNjY2NjY2IgogICAgIGJvcmRlcm9wYWNpdHk9IjEuMCIKICAgICBpbmtzY2FwZTpwYWdlb3BhY2l0eT0iMC4wIgogICAgIGlua3NjYXBlOnBhZ2VzaGFkb3c9IjIiCiAgICAgaW5rc2NhcGU6em9vbT0iNS42IgogICAgIGlua3NjYXBlOmN4PSI5LjkxMDcxNDMiCiAgICAgaW5rc2NhcGU6Y3k9IjY4LjM5Mjg1NyIKICAgICBpbmtzY2FwZTpkb2N1bWVudC11bml0cz0ibW0iCiAgICAgaW5rc2NhcGU6Y3VycmVudC1sYXllcj0ibGF5ZXIxIgogICAgIHNob3dncmlkPSJmYWxzZSIKICAgICB1bml0cz0icHgiCiAgICAgaW5rc2NhcGU6d2luZG93LXdpZHRoPSIxOTIwIgogICAgIGlua3NjYXBlOndpbmRvdy1oZWlnaHQ9IjEwMjciCiAgICAgaW5rc2NhcGU6d2luZG93LXg9Ii04IgogICAgIGlua3NjYXBlOndpbmRvdy15PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3ctbWF4aW1pemVkPSIxIgogICAgIGlua3NjYXBlOnBhZ2VjaGVja2VyYm9hcmQ9IjAiIC8+CiAgPG1ldGFkYXRhCiAgICAgaWQ9Im1ldGFkYXRhMzc2NSI+CiAgICA8cmRmOlJERj4KICAgICAgPGNjOldvcmsKICAgICAgICAgcmRmOmFib3V0PSIiPgogICAgICAgIDxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PgogICAgICAgIDxkYzp0eXBlCiAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz4KICAgICAgPC9jYzpXb3JrPgogICAgPC9yZGY6UkRGPgogIDwvbWV0YWRhdGE+CiAgPGcKICAgICBpbmtzY2FwZTpsYWJlbD0iTGF5ZXIgMSIKICAgICBpbmtzY2FwZTpncm91cG1vZGU9ImxheWVyIgogICAgIGlkPSJsYXllcjEiCiAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMjkxLjcwODMyKSI+CiAgICA8cmVjdAogICAgICAgcnk9IjAuNjk5MTc0MjMiCiAgICAgICB5PSIyOTMuNjkyNzgiCiAgICAgICB4PSIwLjI3NDg0NjczIgogICAgICAgaGVpZ2h0PSIxLjM5ODM0ODUiCiAgICAgICB3aWR0aD0iNC43NjI0OTk4IgogICAgICAgaWQ9InJlY3QzNzM2LTciCiAgICAgICBzdHlsZT0iZmlsbDojMDAwMDAwO3N0cm9rZS13aWR0aDowLjEzMjk5MTg1IiAvPgogIDwvZz4KPC9zdmc+Cg==) !important;
431
+ }
432
+ #popup .maximize:before {
433
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9Im1heGltaXplLnN2ZyIKICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiCiAgIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIKICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiCiAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczM3NjIiIC8+CiAgPHNvZGlwb2RpOm5hbWVkdmlldwogICAgIGlkPSJiYXNlIgogICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIKICAgICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgICBib3JkZXJvcGFjaXR5PSIxLjAiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnpvb209IjcuOTE5NTk1OSIKICAgICBpbmtzY2FwZTpjeD0iNC45ODc2MjgyIgogICAgIGlua3NjYXBlOmN5PSIyNS4zODAwODMiCiAgICAgaW5rc2NhcGU6ZG9jdW1lbnQtdW5pdHM9Im1tIgogICAgIGlua3NjYXBlOmN1cnJlbnQtbGF5ZXI9ImxheWVyMSIKICAgICBzaG93Z3JpZD0iZmFsc2UiCiAgICAgdW5pdHM9InB4IgogICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTkyMCIKICAgICBpbmtzY2FwZTp3aW5kb3ctaGVpZ2h0PSIxMDI3IgogICAgIGlua3NjYXBlOndpbmRvdy14PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3cteT0iLTgiCiAgICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIKICAgICBpbmtzY2FwZTpwYWdlY2hlY2tlcmJvYXJkPSIwIiAvPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTM3NjUiPgogICAgPHJkZjpSREY+CiAgICAgIDxjYzpXb3JrCiAgICAgICAgIHJkZjphYm91dD0iIj4KICAgICAgICA8ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD4KICAgICAgICA8ZGM6dHlwZQogICAgICAgICAgIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+CiAgICAgIDwvY2M6V29yaz4KICAgIDwvcmRmOlJERj4KICA8L21ldGFkYXRhPgogIDxnCiAgICAgaW5rc2NhcGU6bGFiZWw9IkxheWVyIDEiCiAgICAgaW5rc2NhcGU6Z3JvdXBtb2RlPSJsYXllciIKICAgICBpZD0ibGF5ZXIxIgogICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTI5MS43MDgzMikiPgogICAgPHJlY3QKICAgICAgIHN0eWxlPSJmaWxsOiMwMDAwMDA7c3Ryb2tlLXdpZHRoOjAuMTQ3MDQ1NCIKICAgICAgIGlkPSJyZWN0MzczMiIKICAgICAgIHdpZHRoPSI0Ljc2MjQ5OTgiCiAgICAgICBoZWlnaHQ9IjQuNzYyNDk5OCIKICAgICAgIHg9IjAuMjkxODUyNTMiCiAgICAgICB5PSIyOTIuMDEwNDQiCiAgICAgICByeT0iMC42NjcxMjEyMyIgLz4KICA8L2c+Cjwvc3ZnPgo=) !important;
434
+ }
435
+ #popup .close:before {
436
+ background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjAiCiAgIGhlaWdodD0iMjAiCiAgIHZpZXdCb3g9IjAgMCA1LjI5MTY2NjUgNS4yOTE2NjY4IgogICB2ZXJzaW9uPSIxLjEiCiAgIGlkPSJzdmczNzY4IgogICBpbmtzY2FwZTp2ZXJzaW9uPSIxLjEuMSAoM2JmNWFlMGQyNSwgMjAyMS0wOS0yMCkiCiAgIHNvZGlwb2RpOmRvY25hbWU9ImNsb3NlLnN2ZyIKICAgeG1sbnM6aW5rc2NhcGU9Imh0dHA6Ly93d3cuaW5rc2NhcGUub3JnL25hbWVzcGFjZXMvaW5rc2NhcGUiCiAgIHhtbG5zOnNvZGlwb2RpPSJodHRwOi8vc29kaXBvZGkuc291cmNlZm9yZ2UubmV0L0RURC9zb2RpcG9kaS0wLmR0ZCIKICAgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiCiAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczM3NjIiIC8+CiAgPHNvZGlwb2RpOm5hbWVkdmlldwogICAgIGlkPSJiYXNlIgogICAgIHBhZ2Vjb2xvcj0iI2ZmZmZmZiIKICAgICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgICBib3JkZXJvcGFjaXR5PSIxLjAiCiAgICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAuMCIKICAgICBpbmtzY2FwZTpwYWdlc2hhZG93PSIyIgogICAgIGlua3NjYXBlOnpvb209IjcuOTE5NTk1OSIKICAgICBpbmtzY2FwZTpjeD0iNC45ODc2MjgyIgogICAgIGlua3NjYXBlOmN5PSIyNS4zODAwODMiCiAgICAgaW5rc2NhcGU6ZG9jdW1lbnQtdW5pdHM9Im1tIgogICAgIGlua3NjYXBlOmN1cnJlbnQtbGF5ZXI9ImxheWVyMSIKICAgICBzaG93Z3JpZD0iZmFsc2UiCiAgICAgdW5pdHM9InB4IgogICAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTkyMCIKICAgICBpbmtzY2FwZTp3aW5kb3ctaGVpZ2h0PSIxMDI3IgogICAgIGlua3NjYXBlOndpbmRvdy14PSItOCIKICAgICBpbmtzY2FwZTp3aW5kb3cteT0iLTgiCiAgICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIKICAgICBpbmtzY2FwZTpwYWdlY2hlY2tlcmJvYXJkPSIwIiAvPgogIDxtZXRhZGF0YQogICAgIGlkPSJtZXRhZGF0YTM3NjUiPgogICAgPHJkZjpSREY+CiAgICAgIDxjYzpXb3JrCiAgICAgICAgIHJkZjphYm91dD0iIj4KICAgICAgICA8ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD4KICAgICAgICA8ZGM6dHlwZQogICAgICAgICAgIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+CiAgICAgIDwvY2M6V29yaz4KICAgIDwvcmRmOlJERj4KICA8L21ldGFkYXRhPgogIDxnCiAgICAgaW5rc2NhcGU6bGFiZWw9IkxheWVyIDEiCiAgICAgaW5rc2NhcGU6Z3JvdXBtb2RlPSJsYXllciIKICAgICBpZD0ibGF5ZXIxIgogICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTI5MS43MDgzMikiPgogICAgPHBhdGgKICAgICAgIHN0eWxlPSJmaWxsOiMwMDAwMDA7c3Ryb2tlLXdpZHRoOjAuMTQ5MDI2NjMiCiAgICAgICBkPSJtIDAuOTY5NDI2NTUsMjkxLjk4MjY1IGMgLTAuMTczMTcsMCAtMC4zNDYzMSwwLjA2NjYgLTAuNDc5LDAuMTk5MjcgLTAuMjY1MzgsMC4yNjUzNyAtMC4yNjUzOCwwLjY5MjQ0IDAsMC45NTc4MSBsIDEuMjI0MjA5OTUsMS4yMjQxNyAtMS4yMjQyMDk5NSwxLjIyNDE3IGMgLTAuMjY1MzgsMC4yNjUzNyAtMC4yNjUzOCwwLjY5MjQ0IDAsMC45NTc4MSAwLjI2NTM4LDAuMjY1MzcgMC42OTI2MDk5NSwwLjI2NTM3IDAuOTU3OTg5OTUsMCBsIDEuMjI0MjEsLTEuMjI0MTcgMS4yMjQyMDgsMS4yMjQxNyBjIDAuMTMyNjkyLDAuMTMyNjggMC4zMDU4MywwLjE5OTI3IDAuNDc4OTkxLDAuMTk5MjcgMC4wNDMzLDAgMC4wODY3LC0wLjAwNCAwLjEyOTM3OSwtMC4wMTI1IDAuMTI3OTcxLC0wLjAyNDkgMC4yNTAxLC0wLjA4NzIgMC4zNDk2MiwtMC4xODY3NiAwLjAzMzIsLTAuMDMzMiAwLjA2MjMsLTAuMDY4NiAwLjA4NzEsLTAuMTA2MTQgMC4xNzQxNiwtMC4yNjMxOSAwLjE0NTA2OSwtMC42MTk0NiAtMC4wODcxLC0wLjg1MTY2IGwgLTEuMjI0MjA4LC0xLjIyNDE3IDEuMjI0MjA4LC0xLjIyNDE3IGMgMC4yNjUzNywtMC4yNjUzNyAwLjI2NTM3LC0wLjY5MjQ0IDAsLTAuOTU3ODEgLTAuMjY1Mzc5LC0wLjI2NTM3IC0wLjY5MjYxLC0wLjI2NTM3IC0wLjk1Nzk5LDAgbCAtMS4yMjQyMDgsMS4yMjQxNyAtMS4yMjQyMSwtMS4yMjQxNyBjIC0wLjEzMjY5LC0wLjEzMjY5IC0wLjMwNTgzLC0wLjE5OTI3IC0wLjQ3ODk4OTk1LC0wLjE5OTI3IHoiCiAgICAgICBpZD0icmVjdDM3MTUiCiAgICAgICBpbmtzY2FwZTpjb25uZWN0b3ItY3VydmF0dXJlPSIwIiAvPgogIDwvZz4KPC9zdmc+Cg==) !important;
437
+ }
438
+ }
439
+ @layer layerpro {
440
+ #popup > input,
441
+ #popup > button,
442
+ #popup > textarea,
443
+ #popup > select {
444
+ all: unset;
445
+ }
446
+ }
447
+ @layer layerpro {
448
+ .popup_alert,
449
+ .popup_message,
450
+ .popup_prompt,
451
+ .popup_confirm {
452
+ height: calc(100% - 41px);
453
+ box-shadow: 0 1px 1px #888;
454
+ overflow: auto;
455
+ padding: 20px;
456
+ word-break: break-all;
457
+ }
458
+ .popup_alert input[type=text],
459
+ .popup_message input[type=text],
460
+ .popup_prompt input[type=text],
461
+ .popup_confirm input[type=text] {
462
+ position: relative;
463
+ width: 90%;
464
+ height: 35px;
465
+ padding: 5px;
466
+ font-size: 1.05em;
467
+ border: 2px solid rgba(0, 0, 0, 0.3);
468
+ border-radius: 6px;
469
+ color: #ddd;
470
+ background-color: #4a4a4f;
471
+ }
472
+ .popup_window___alert #a___alert,
473
+ .popup_window___alert #a___message,
474
+ .popup_window___message #a___alert,
475
+ .popup_window___message #a___message {
476
+ width: 100% !important;
477
+ }
478
+ .popup_window___prompt #a___alert,
479
+ .popup_window___prompt #b___alert,
480
+ .popup_window___prompt #a___message,
481
+ .popup_window___prompt #b___message,
482
+ .popup_window___confirm #a___alert,
483
+ .popup_window___confirm #b___alert,
484
+ .popup_window___confirm #a___message,
485
+ .popup_window___confirm #b___message {
486
+ width: 50% !important;
487
+ }
488
+ }
489
+ @layer layerpro {
490
+ .resize_0,
491
+ .resize_1,
492
+ .resize_2,
493
+ .resize_3 {
494
+ position: absolute;
495
+ background-color: var(--resize-background-color);
496
+ border-radius: var(--border-radius);
497
+ opacity: 0;
498
+ z-index: 5000;
499
+ transition: var(--transition-time);
500
+ }
501
+ .resize_0 {
502
+ top: -4px;
503
+ left: 0;
504
+ width: 100%;
505
+ height: 10px;
506
+ cursor: n-resize;
507
+ }
508
+ .resize_1 {
509
+ top: 0;
510
+ right: -4px;
511
+ width: 10px;
512
+ height: 100%;
513
+ cursor: e-resize;
514
+ }
515
+ .resize_2 {
516
+ bottom: -4px;
517
+ left: 0;
518
+ width: 100%;
519
+ height: 10px;
520
+ cursor: n-resize;
521
+ }
522
+ .resize_3 {
523
+ top: 0;
524
+ left: -4px;
525
+ width: 10px;
526
+ height: 100%;
527
+ cursor: e-resize;
528
+ }
529
+ .resize_corner_0,
530
+ .resize_corner_1,
531
+ .resize_corner_2,
532
+ .resize_corner_3 {
533
+ position: absolute;
534
+ background-color: var(--resize-background-color);
535
+ border-radius: var(--border-radius);
536
+ opacity: 0;
537
+ z-index: 5000;
538
+ transition: var(--transition-time);
539
+ width: var(--corner-size);
540
+ height: var(--corner-size);
541
+ border-radius: var(--corner-border-radius);
542
+ }
543
+ .resize_corner_0 {
544
+ top: -4px;
545
+ left: -4px;
546
+ cursor: nw-resize;
547
+ }
548
+ .resize_corner_1 {
549
+ top: -4px;
550
+ right: -4px;
551
+ cursor: ne-resize;
552
+ }
553
+ .resize_corner_2 {
554
+ bottom: -4px;
555
+ right: -4px;
556
+ cursor: nw-resize;
557
+ }
558
+ .resize_corner_3 {
559
+ bottom: -4px;
560
+ left: -4px;
561
+ cursor: ne-resize;
562
+ }
563
+ .resize_0:hover,
564
+ .resize_1:hover,
565
+ .resize_2:hover,
566
+ .resize_3:hover,
567
+ .resize_corner_0:hover,
568
+ .resize_corner_1:hover,
569
+ .resize_corner_2:hover,
570
+ .resize_corner_3:hover {
571
+ opacity: var(--hover-opacity);
572
+ filter: var(--hover-filter);
573
+ box-shadow: var(--resize-shadow);
574
+ transition: var(--transition-time);
575
+ }
576
+ }
577
+ @layer layerpro {
578
+ #popup {
579
+ }
580
+ #popup ::-webkit-scrollbar {
581
+ width: 10px;
582
+ scroll-behavior: smooth;
583
+ }
584
+ #popup {
585
+ }
586
+ #popup ::-webkit-scrollbar-track {
587
+ -webkit-border-radius: 2px;
588
+ border-radius: 2px;
589
+ margin: 5px;
590
+ }
591
+ #popup {
592
+ }
593
+ #popup ::-webkit-scrollbar-thumb {
594
+ -webkit-border-radius: 2px;
595
+ border-radius: 2px;
596
+ background: rgb(30, 150, 255) !important;
597
+ }
504
598
  }