layerpro 4.0.0 → 4.1.0

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