@twab/visualization 0.9.1 → 0.9.4

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 (33) hide show
  1. package/dist/css/26.90e920d4.css +340 -0
  2. package/dist/{visualization.css → css/794.5b845685.css} +1 -1
  3. package/dist/css/95.90e920d4.css +340 -0
  4. package/dist/visualization.common.913.js +9642 -0
  5. package/dist/visualization.common.913.js.map +1 -0
  6. package/dist/visualization.common.95.js +3125 -0
  7. package/dist/visualization.common.95.js.map +1 -0
  8. package/dist/visualization.common.js +400 -12753
  9. package/dist/visualization.common.js.map +1 -1
  10. package/dist/visualization.umd.26.js +3125 -0
  11. package/dist/visualization.umd.26.js.map +1 -0
  12. package/dist/visualization.umd.653.js +9642 -0
  13. package/dist/visualization.umd.653.js.map +1 -0
  14. package/dist/visualization.umd.js +400 -12753
  15. package/dist/visualization.umd.js.map +1 -1
  16. package/dist/visualization.umd.min.116.js +8 -0
  17. package/dist/visualization.umd.min.116.js.map +1 -0
  18. package/dist/visualization.umd.min.794.js +2 -0
  19. package/dist/visualization.umd.min.794.js.map +1 -0
  20. package/dist/visualization.umd.min.js +2 -8
  21. package/dist/visualization.umd.min.js.map +1 -1
  22. package/package.json +68 -66
  23. package/dist/img/1x1.f865594b.svg +0 -1
  24. package/dist/img/2x1.6bc80fec.svg +0 -1
  25. package/dist/img/3x1.8fe1c055.svg +0 -1
  26. package/dist/img/3x2.f5153612.svg +0 -1
  27. package/dist/img/4x1.22f434b0.svg +0 -1
  28. package/dist/img/4x2.3810a721.svg +0 -1
  29. package/dist/img/5x1.c0878e49.svg +0 -1
  30. package/dist/img/5x2.b70b5289.svg +0 -1
  31. package/dist/img/6x1.28b9840c.svg +0 -1
  32. package/dist/img/6x2.6b117ba7.svg +0 -1
  33. package/dist/img/dummy.ec1ab0d6.svg +0 -1
package/dist/css/26.90e920d4.css ADDED
@@ -0,0 +1,340 @@
1
+
2
+ .frame-container > div[data-v-20a23fbe] {
3
+ max-height: 100%;
4
+ }
5
+ .frame-container[data-v-20a23fbe] {
6
+ background-color: black;
7
+ display: flex;
8
+ justify-content: center;
9
+ }
10
+ .frame-content[data-v-20a23fbe],
11
+ .dummy-frame[data-v-20a23fbe] {
12
+ display: flex;
13
+ align-items: center;
14
+ justify-content: center;
15
+ }
16
+ .frame-content video[data-v-20a23fbe] {
17
+ flex-grow: 1;
18
+ -o-object-fit: fill;
19
+ object-fit: fill;
20
+ z-index: 0;
21
+ }
22
+ .overlay[data-v-20a23fbe] {
23
+ width: 100%;
24
+ height: 100%;
25
+ z-index: 5;
26
+ position: absolute;
27
+ top: 0;
28
+ left: 0;
29
+ border: 4px solid transparent;
30
+ }
31
+ .active .overlay[data-v-20a23fbe] {
32
+ border-color: var(--visualization-primary);
33
+ }
34
+ .between-time .overlay[data-v-20a23fbe] {
35
+ border-top-color: var(--visualization-secondary);
36
+ }
37
+ .between-time.active .overlay[data-v-20a23fbe] {
38
+ border-color: var(--visualization-secondary);
39
+ }
40
+ .initial-time .overlay[data-v-20a23fbe] {
41
+ border-top-color: var(--visualization-start);
42
+ }
43
+ .initial-time.active .overlay[data-v-20a23fbe] {
44
+ border-color: var(--visualization-start);
45
+ }
46
+ .end-time .overlay[data-v-20a23fbe] {
47
+ border-top-color: var(--visualization-end);
48
+ }
49
+ .end-time.active .overlay[data-v-20a23fbe] {
50
+ border-color: var(--visualization-end);
51
+ }
52
+ .initial-time.end-time .overlay[data-v-20a23fbe] {
53
+ border-top-color: var(--visualization-start);
54
+ border-bottom-color: var(--visualization-end);
55
+ }
56
+ .initial-time.end-time.active .overlay[data-v-20a23fbe] {
57
+ border-top-color: var(--visualization-start);
58
+ border-left-color: var(--visualization-start);
59
+ border-bottom-color: var(--visualization-end);
60
+ border-right-color: var(--visualization-end);
61
+ }
62
+
63
+
64
+ #progress[data-v-7fe6f244] {
65
+ position: relative;
66
+ cursor: pointer;
67
+ width: 80%;
68
+ height: 15px;
69
+ background-color: #dfdfdf;
70
+ margin: 5px auto;
71
+ border-radius: 6px;
72
+ }
73
+ .progressBar[data-v-7fe6f244] {
74
+ display: absolute;
75
+ height: 15px;
76
+ position: absolute;
77
+ top: 0;
78
+ left: 0;
79
+ background-color: var(--visualization-secondary);
80
+ z-index: 2;
81
+ width: 50%;
82
+ border-radius: inherit;
83
+ }
84
+ .progressBar[data-v-7fe6f244]::after {
85
+ content: '';
86
+ width: 17px;
87
+ height: 17px;
88
+ position: absolute;
89
+ top: -1px;
90
+ right: -8.5px;
91
+ border-radius: 50%;
92
+ background-color: var(--visualization-primary);
93
+ z-index: 3;
94
+ }
95
+ .progressLabel[data-v-7fe6f244] {
96
+ z-index: 4;
97
+ margin: 0 auto;
98
+ font-weight: bold;
99
+ line-height: 17px;
100
+ font-size: 14px;
101
+ text-shadow: -1px 0 #dfdfdf, 0 1px #dfdfdf, 1px 0 #dfdfdf, 0 -1px #dfdfdf;
102
+
103
+ -webkit-user-select: none;
104
+
105
+ -moz-user-select: none;
106
+
107
+ user-select: none;
108
+ }
109
+
110
+
111
+ dialog[data-v-9f47e4d0] {
112
+ max-width: 60vw;
113
+ /* padding: 12px; */
114
+ border: none;
115
+ background: white;
116
+ border-radius: 6px;
117
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
118
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);
119
+ position: fixed;
120
+ top: 50%;
121
+ left: 50%;
122
+ transform: translateY(-50%) translateX(-50%);
123
+ }
124
+
125
+ .visualization-row {
126
+ display: flex;
127
+ flex-wrap: wrap;
128
+ flex: 1 1 auto;
129
+ }
130
+ .visualization-col {
131
+ flex-basis: 0;
132
+ flex-grow: 1;
133
+ max-width: 100%;
134
+ padding: 12px;
135
+ }
136
+ .visualization-divider {
137
+ display: block;
138
+ flex: 1 1 100%;
139
+ height: 0px;
140
+ max-height: 0px;
141
+ opacity: 1;
142
+ transition: inherit;
143
+ border-style: solid;
144
+ border-width: thin 0 0 0;
145
+ border-color: rgba(0, 0, 0, 0.12);
146
+ margin: 0;
147
+ }
148
+ .visualization-divider.vertical {
149
+ align-self: stretch;
150
+ border-width: 0 thin 0 0;
151
+ display: inline-flex;
152
+ height: inherit;
153
+ margin-left: -1px;
154
+ max-height: 100%;
155
+ max-width: 0px;
156
+ vertical-align: text-bottom;
157
+ width: 0px;
158
+ }
159
+ .visualization-card {
160
+ flex-basis: 0;
161
+ flex-grow: 1;
162
+ max-width: 100%;
163
+ padding: 12px;
164
+ width: 100%;
165
+ transition-property: box-shadow, opacity;
166
+ overflow-wrap: break-word;
167
+ /*box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
168
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);*/
169
+ }
170
+ .visualization-justify-center {
171
+ justify-content: center;
172
+ }
173
+ .visualization-align-center {
174
+ align-items: center;
175
+ }
176
+ #visualization-container {
177
+ max-width: 100% !important;
178
+ margin: 0 auto !important;
179
+ height: 100%;
180
+ border-bottom: none;
181
+ }
182
+ #visualization-container > .card {
183
+ border-radius: 0 !important;
184
+ font-size: 12px;
185
+ width: 100%;
186
+ box-shadow: none;
187
+ height: 100%;
188
+ }
189
+ #command-bar,
190
+ #info-bar {
191
+ background-color: #f5f5f5;
192
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
193
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);
194
+ }
195
+ #command-bar button {
196
+ width: 42px;
197
+ height: 36px;
198
+ border: none;
199
+ background: none;
200
+ }
201
+ #command-bar button:hover {
202
+ cursor: pointer;
203
+ background: rgba(0, 0, 0, 0.12);
204
+ }
205
+ #command-bar svg {
206
+ font-size: 16px;
207
+ }
208
+ #command-bar {
209
+ padding: 0 !important;
210
+ }
211
+ #info-bar {
212
+ padding: 4px;
213
+ font-size: 14px;
214
+ position: relative;
215
+ }
216
+ .settings-container {
217
+ position: absolute;
218
+ right: 14px;
219
+ top: 50%;
220
+ transform: translateY(-50%);
221
+ }
222
+ .settings-container > * {
223
+ margin: 0 2px;
224
+ cursor: pointer;
225
+ }
226
+ #info-bar svg {
227
+ font-size: 16px;
228
+ }
229
+ #info-bar .divider {
230
+ margin: 0 8px;
231
+ }
232
+ svg:focus {
233
+ border: none;
234
+ }
235
+ .visualization-card {
236
+ border-left: 8px solid #eee;
237
+ }
238
+ .active-tab {
239
+ border-left: 8px solid var(--visualization-primary) !important;
240
+ border-image-slice: 1;
241
+ }
242
+ [id^='frame-'] {
243
+ padding: 1px;
244
+ display: flex;
245
+ flex-flow: column;
246
+ }
247
+ .tooltip {
248
+ display: block !important;
249
+ z-index: 10000;
250
+ }
251
+ .tooltip .tooltip-inner {
252
+ background: var(--visualization-primary);
253
+ color: white;
254
+ border-radius: 16px;
255
+ padding: 5px 10px 4px;
256
+ }
257
+ .tooltip .tooltip-arrow {
258
+ width: 0;
259
+ height: 0;
260
+ border-style: solid;
261
+ position: absolute;
262
+ margin: 5px;
263
+ border-color: var(--visualization-primary);
264
+ z-index: 1;
265
+ }
266
+ .tooltip[x-placement^='top'] {
267
+ margin-bottom: 5px;
268
+ }
269
+ .tooltip[x-placement^='top'] .tooltip-arrow {
270
+ border-width: 5px 5px 0 5px;
271
+ border-left-color: transparent !important;
272
+ border-right-color: transparent !important;
273
+ border-bottom-color: transparent !important;
274
+ bottom: -5px;
275
+ left: calc(50% - 5px);
276
+ margin-top: 0;
277
+ margin-bottom: 0;
278
+ }
279
+ .tooltip[x-placement^='bottom'] {
280
+ margin-top: 5px;
281
+ }
282
+ .tooltip[x-placement^='bottom'] .tooltip-arrow {
283
+ border-width: 0 5px 5px 5px;
284
+ border-left-color: transparent !important;
285
+ border-right-color: transparent !important;
286
+ border-top-color: transparent !important;
287
+ top: -5px;
288
+ left: calc(50% - 5px);
289
+ margin-top: 0;
290
+ margin-bottom: 0;
291
+ }
292
+ .tooltip[x-placement^='right'] {
293
+ margin-left: 5px;
294
+ }
295
+ .tooltip[x-placement^='right'] .tooltip-arrow {
296
+ border-width: 5px 5px 5px 0;
297
+ border-left-color: transparent !important;
298
+ border-top-color: transparent !important;
299
+ border-bottom-color: transparent !important;
300
+ left: -5px;
301
+ top: calc(50% - 5px);
302
+ margin-left: 0;
303
+ margin-right: 0;
304
+ }
305
+ .tooltip[x-placement^='left'] {
306
+ margin-right: 5px;
307
+ }
308
+ .tooltip[x-placement^='left'] .tooltip-arrow {
309
+ border-width: 5px 0 5px 5px;
310
+ border-top-color: transparent !important;
311
+ border-right-color: transparent !important;
312
+ border-bottom-color: transparent !important;
313
+ right: -5px;
314
+ top: calc(50% - 5px);
315
+ margin-left: 0;
316
+ margin-right: 0;
317
+ }
318
+ .tooltip.popover .popover-inner {
319
+ background: #f9f9f9;
320
+ color: black;
321
+ padding: 24px;
322
+ border-radius: 5px;
323
+ box-shadow: 0 5px 30px rgba(black, 0.1);
324
+ }
325
+ .tooltip.popover .popover-arrow {
326
+ border-color: #f9f9f9;
327
+ }
328
+ .tooltip[aria-hidden='true'] {
329
+ visibility: hidden;
330
+ opacity: 0;
331
+ transition: opacity 0.15s, visibility 0.15s;
332
+ }
333
+ .tooltip[aria-hidden='false'] {
334
+ visibility: visible;
335
+ opacity: 1;
336
+ transition: opacity 0.15s;
337
+ }
338
+
339
+
340
+
package/dist/{visualization.css → css/794.5b845685.css} RENAMED
@@ -1 +1 @@
1
- .frame-container>div[data-v-5c1173af]{max-height:100%}.frame-container[data-v-5c1173af]{background-color:#000;display:flex;justify-content:center}.dummy-frame[data-v-5c1173af],.frame-content[data-v-5c1173af]{display:flex;align-items:center;justify-content:center}.frame-content video[data-v-5c1173af]{flex-grow:1;-o-object-fit:fill;object-fit:fill;z-index:0}.overlay[data-v-5c1173af]{width:100%;height:100%;z-index:5;position:absolute;top:0;left:0;border:4px solid transparent}.active .overlay[data-v-5c1173af]{border-color:var(--visualization-primary)}.between-time .overlay[data-v-5c1173af]{border-top-color:var(--visualization-secondary)}.between-time.active .overlay[data-v-5c1173af]{border-color:var(--visualization-secondary)}.initial-time .overlay[data-v-5c1173af]{border-top-color:var(--visualization-start)}.initial-time.active .overlay[data-v-5c1173af]{border-color:var(--visualization-start)}.end-time .overlay[data-v-5c1173af]{border-top-color:var(--visualization-end)}.end-time.active .overlay[data-v-5c1173af]{border-color:var(--visualization-end)}.initial-time.end-time .overlay[data-v-5c1173af]{border-top-color:var(--visualization-start);border-bottom-color:var(--visualization-end)}.initial-time.end-time.active .overlay[data-v-5c1173af]{border-top-color:var(--visualization-start);border-left-color:var(--visualization-start);border-bottom-color:var(--visualization-end);border-right-color:var(--visualization-end)}#progress[data-v-7fe6f244]{position:relative;cursor:pointer;width:80%;height:15px;background-color:#dfdfdf;margin:5px auto;border-radius:6px}.progressBar[data-v-7fe6f244]{display:absolute;height:15px;position:absolute;top:0;left:0;background-color:var(--visualization-secondary);z-index:2;width:50%;border-radius:inherit}.progressBar[data-v-7fe6f244]:after{content:"";width:17px;height:17px;position:absolute;top:-1px;right:-8.5px;border-radius:50%;background-color:var(--visualization-primary);z-index:3}.progressLabel[data-v-7fe6f244]{z-index:4;margin:0 auto;font-weight:700;line-height:17px;font-size:14px;text-shadow:-1px 0 #dfdfdf,0 1px #dfdfdf,1px 0 #dfdfdf,0 -1px #dfdfdf;-webkit-user-select:none;-moz-user-select:none;user-select:none}dialog[data-v-bf2f3c16]{max-width:60vw;padding:12px;border:none;background:#fff;border-radius:5px;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%)}.visualization-row{display:flex;flex-wrap:wrap;flex:1 1 auto}.visualization-col{flex-basis:0;flex-grow:1;max-width:100%;padding:12px}.visualization-divider{display:block;flex:1 1 100%;height:0;max-height:0;opacity:1;transition:inherit;border-style:solid;border-width:thin 0 0 0;border-color:rgba(0,0,0,.12);margin:0}.visualization-divider.vertical{align-self:stretch;border-width:0 thin 0 0;display:inline-flex;height:inherit;margin-left:-1px;max-height:100%;max-width:0;vertical-align:text-bottom;width:0}.visualization-card{flex-basis:0;flex-grow:1;max-width:100%;padding:12px;width:100%;transition-property:box-shadow,opacity;overflow-wrap:break-word;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);border-radius:6px}.visualization-justify-center{justify-content:center}.visualization-align-center{align-items:center}#visualization-container{max-width:100%!important;margin:0 auto!important;height:100%;border-bottom:none}#visualization-container>.card{border-radius:0!important;font-size:12px;width:100%;box-shadow:none;height:100%}#command-bar,#info-bar{background-color:#f5f5f5;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}#command-bar button{width:42px;height:36px;border:none;background:none}#command-bar button:hover{cursor:pointer;background:rgba(0,0,0,.12)}#command-bar svg{font-size:16px}#command-bar{padding:0!important}#info-bar{padding:4px;font-size:14px;position:relative}.settings-container{position:absolute;right:14px;top:50%;transform:translateY(-50%)}.settings-container>*{margin:0 2px;cursor:pointer}#info-bar svg{font-size:16px}#info-bar .divider{margin:0 8px}svg:focus{border:none}.visualization-card{border-left:8px solid #eee}.active-tab{border-left:8px solid var(--visualization-primary)!important;border-image-slice:1}[id^=frame-]{padding:1px;display:flex;flex-flow:column}.tooltip{display:block!important;z-index:10000}.tooltip .tooltip-inner{background:var(--visualization-primary);color:#fff;border-radius:16px;padding:5px 10px 4px}.tooltip .tooltip-arrow{width:0;height:0;border-style:solid;position:absolute;margin:5px;border-color:var(--visualization-primary);z-index:1}.tooltip[x-placement^=top]{margin-bottom:5px}.tooltip[x-placement^=top] .tooltip-arrow{border-width:5px 5px 0 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;bottom:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=bottom]{margin-top:5px}.tooltip[x-placement^=bottom] .tooltip-arrow{border-width:0 5px 5px 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;top:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=right]{margin-left:5px}.tooltip[x-placement^=right] .tooltip-arrow{border-width:5px 5px 5px 0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important;left:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip[x-placement^=left]{margin-right:5px}.tooltip[x-placement^=left] .tooltip-arrow{border-width:5px 0 5px 5px;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip.popover .popover-inner{background:#f9f9f9;color:#000;padding:24px;border-radius:5px;box-shadow:0 5px 30px rgba(black,.1)}.tooltip.popover .popover-arrow{border-color:#f9f9f9}.tooltip[aria-hidden=true]{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s}.tooltip[aria-hidden=false]{visibility:visible;opacity:1;transition:opacity .15s}
1
+ .frame-container>div[data-v-20a23fbe]{max-height:100%}.frame-container[data-v-20a23fbe]{background-color:#000;display:flex;justify-content:center}.dummy-frame[data-v-20a23fbe],.frame-content[data-v-20a23fbe]{display:flex;align-items:center;justify-content:center}.frame-content video[data-v-20a23fbe]{flex-grow:1;-o-object-fit:fill;object-fit:fill;z-index:0}.overlay[data-v-20a23fbe]{width:100%;height:100%;z-index:5;position:absolute;top:0;left:0;border:4px solid transparent}.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-primary)}.between-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-secondary)}.between-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-secondary)}.initial-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start)}.initial-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-start)}.end-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-end)}.end-time.active .overlay[data-v-20a23fbe]{border-color:var(--visualization-end)}.initial-time.end-time .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start);border-bottom-color:var(--visualization-end)}.initial-time.end-time.active .overlay[data-v-20a23fbe]{border-top-color:var(--visualization-start);border-left-color:var(--visualization-start);border-bottom-color:var(--visualization-end);border-right-color:var(--visualization-end)}#progress[data-v-7fe6f244]{position:relative;cursor:pointer;width:80%;height:15px;background-color:#dfdfdf;margin:5px auto;border-radius:6px}.progressBar[data-v-7fe6f244]{display:absolute;height:15px;position:absolute;top:0;left:0;background-color:var(--visualization-secondary);z-index:2;width:50%;border-radius:inherit}.progressBar[data-v-7fe6f244]:after{content:"";width:17px;height:17px;position:absolute;top:-1px;right:-8.5px;border-radius:50%;background-color:var(--visualization-primary);z-index:3}.progressLabel[data-v-7fe6f244]{z-index:4;margin:0 auto;font-weight:700;line-height:17px;font-size:14px;text-shadow:-1px 0 #dfdfdf,0 1px #dfdfdf,1px 0 #dfdfdf,0 -1px #dfdfdf;-webkit-user-select:none;-moz-user-select:none;user-select:none}dialog[data-v-9f47e4d0]{max-width:60vw;border:none;background:#fff;border-radius:6px;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%)}.visualization-row{display:flex;flex-wrap:wrap;flex:1 1 auto}.visualization-col{flex-basis:0;flex-grow:1;max-width:100%;padding:12px}.visualization-divider{display:block;flex:1 1 100%;height:0;max-height:0;opacity:1;transition:inherit;border-style:solid;border-width:thin 0 0 0;border-color:rgba(0,0,0,.12);margin:0}.visualization-divider.vertical{align-self:stretch;border-width:0 thin 0 0;display:inline-flex;height:inherit;margin-left:-1px;max-height:100%;max-width:0;vertical-align:text-bottom;width:0}.visualization-card{flex-basis:0;flex-grow:1;max-width:100%;padding:12px;width:100%;transition-property:box-shadow,opacity;overflow-wrap:break-word}.visualization-justify-center{justify-content:center}.visualization-align-center{align-items:center}#visualization-container{max-width:100%!important;margin:0 auto!important;height:100%;border-bottom:none}#visualization-container>.card{border-radius:0!important;font-size:12px;width:100%;box-shadow:none;height:100%}#command-bar,#info-bar{background-color:#f5f5f5;box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}#command-bar button{width:42px;height:36px;border:none;background:none}#command-bar button:hover{cursor:pointer;background:rgba(0,0,0,.12)}#command-bar svg{font-size:16px}#command-bar{padding:0!important}#info-bar{padding:4px;font-size:14px;position:relative}.settings-container{position:absolute;right:14px;top:50%;transform:translateY(-50%)}.settings-container>*{margin:0 2px;cursor:pointer}#info-bar svg{font-size:16px}#info-bar .divider{margin:0 8px}svg:focus{border:none}.visualization-card{border-left:8px solid #eee}.active-tab{border-left:8px solid var(--visualization-primary)!important;border-image-slice:1}[id^=frame-]{padding:1px;display:flex;flex-flow:column}.tooltip{display:block!important;z-index:10000}.tooltip .tooltip-inner{background:var(--visualization-primary);color:#fff;border-radius:16px;padding:5px 10px 4px}.tooltip .tooltip-arrow{width:0;height:0;border-style:solid;position:absolute;margin:5px;border-color:var(--visualization-primary);z-index:1}.tooltip[x-placement^=top]{margin-bottom:5px}.tooltip[x-placement^=top] .tooltip-arrow{border-width:5px 5px 0 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;bottom:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=bottom]{margin-top:5px}.tooltip[x-placement^=bottom] .tooltip-arrow{border-width:0 5px 5px 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;top:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=right]{margin-left:5px}.tooltip[x-placement^=right] .tooltip-arrow{border-width:5px 5px 5px 0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important;left:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip[x-placement^=left]{margin-right:5px}.tooltip[x-placement^=left] .tooltip-arrow{border-width:5px 0 5px 5px;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip.popover .popover-inner{background:#f9f9f9;color:#000;padding:24px;border-radius:5px;box-shadow:0 5px 30px rgba(black,.1)}.tooltip.popover .popover-arrow{border-color:#f9f9f9}.tooltip[aria-hidden=true]{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s}.tooltip[aria-hidden=false]{visibility:visible;opacity:1;transition:opacity .15s}
package/dist/css/95.90e920d4.css ADDED
@@ -0,0 +1,340 @@
1
+
2
+ .frame-container > div[data-v-20a23fbe] {
3
+ max-height: 100%;
4
+ }
5
+ .frame-container[data-v-20a23fbe] {
6
+ background-color: black;
7
+ display: flex;
8
+ justify-content: center;
9
+ }
10
+ .frame-content[data-v-20a23fbe],
11
+ .dummy-frame[data-v-20a23fbe] {
12
+ display: flex;
13
+ align-items: center;
14
+ justify-content: center;
15
+ }
16
+ .frame-content video[data-v-20a23fbe] {
17
+ flex-grow: 1;
18
+ -o-object-fit: fill;
19
+ object-fit: fill;
20
+ z-index: 0;
21
+ }
22
+ .overlay[data-v-20a23fbe] {
23
+ width: 100%;
24
+ height: 100%;
25
+ z-index: 5;
26
+ position: absolute;
27
+ top: 0;
28
+ left: 0;
29
+ border: 4px solid transparent;
30
+ }
31
+ .active .overlay[data-v-20a23fbe] {
32
+ border-color: var(--visualization-primary);
33
+ }
34
+ .between-time .overlay[data-v-20a23fbe] {
35
+ border-top-color: var(--visualization-secondary);
36
+ }
37
+ .between-time.active .overlay[data-v-20a23fbe] {
38
+ border-color: var(--visualization-secondary);
39
+ }
40
+ .initial-time .overlay[data-v-20a23fbe] {
41
+ border-top-color: var(--visualization-start);
42
+ }
43
+ .initial-time.active .overlay[data-v-20a23fbe] {
44
+ border-color: var(--visualization-start);
45
+ }
46
+ .end-time .overlay[data-v-20a23fbe] {
47
+ border-top-color: var(--visualization-end);
48
+ }
49
+ .end-time.active .overlay[data-v-20a23fbe] {
50
+ border-color: var(--visualization-end);
51
+ }
52
+ .initial-time.end-time .overlay[data-v-20a23fbe] {
53
+ border-top-color: var(--visualization-start);
54
+ border-bottom-color: var(--visualization-end);
55
+ }
56
+ .initial-time.end-time.active .overlay[data-v-20a23fbe] {
57
+ border-top-color: var(--visualization-start);
58
+ border-left-color: var(--visualization-start);
59
+ border-bottom-color: var(--visualization-end);
60
+ border-right-color: var(--visualization-end);
61
+ }
62
+
63
+
64
+ #progress[data-v-7fe6f244] {
65
+ position: relative;
66
+ cursor: pointer;
67
+ width: 80%;
68
+ height: 15px;
69
+ background-color: #dfdfdf;
70
+ margin: 5px auto;
71
+ border-radius: 6px;
72
+ }
73
+ .progressBar[data-v-7fe6f244] {
74
+ display: absolute;
75
+ height: 15px;
76
+ position: absolute;
77
+ top: 0;
78
+ left: 0;
79
+ background-color: var(--visualization-secondary);
80
+ z-index: 2;
81
+ width: 50%;
82
+ border-radius: inherit;
83
+ }
84
+ .progressBar[data-v-7fe6f244]::after {
85
+ content: '';
86
+ width: 17px;
87
+ height: 17px;
88
+ position: absolute;
89
+ top: -1px;
90
+ right: -8.5px;
91
+ border-radius: 50%;
92
+ background-color: var(--visualization-primary);
93
+ z-index: 3;
94
+ }
95
+ .progressLabel[data-v-7fe6f244] {
96
+ z-index: 4;
97
+ margin: 0 auto;
98
+ font-weight: bold;
99
+ line-height: 17px;
100
+ font-size: 14px;
101
+ text-shadow: -1px 0 #dfdfdf, 0 1px #dfdfdf, 1px 0 #dfdfdf, 0 -1px #dfdfdf;
102
+
103
+ -webkit-user-select: none;
104
+
105
+ -moz-user-select: none;
106
+
107
+ user-select: none;
108
+ }
109
+
110
+
111
+ dialog[data-v-9f47e4d0] {
112
+ max-width: 60vw;
113
+ /* padding: 12px; */
114
+ border: none;
115
+ background: white;
116
+ border-radius: 6px;
117
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
118
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);
119
+ position: fixed;
120
+ top: 50%;
121
+ left: 50%;
122
+ transform: translateY(-50%) translateX(-50%);
123
+ }
124
+
125
+ .visualization-row {
126
+ display: flex;
127
+ flex-wrap: wrap;
128
+ flex: 1 1 auto;
129
+ }
130
+ .visualization-col {
131
+ flex-basis: 0;
132
+ flex-grow: 1;
133
+ max-width: 100%;
134
+ padding: 12px;
135
+ }
136
+ .visualization-divider {
137
+ display: block;
138
+ flex: 1 1 100%;
139
+ height: 0px;
140
+ max-height: 0px;
141
+ opacity: 1;
142
+ transition: inherit;
143
+ border-style: solid;
144
+ border-width: thin 0 0 0;
145
+ border-color: rgba(0, 0, 0, 0.12);
146
+ margin: 0;
147
+ }
148
+ .visualization-divider.vertical {
149
+ align-self: stretch;
150
+ border-width: 0 thin 0 0;
151
+ display: inline-flex;
152
+ height: inherit;
153
+ margin-left: -1px;
154
+ max-height: 100%;
155
+ max-width: 0px;
156
+ vertical-align: text-bottom;
157
+ width: 0px;
158
+ }
159
+ .visualization-card {
160
+ flex-basis: 0;
161
+ flex-grow: 1;
162
+ max-width: 100%;
163
+ padding: 12px;
164
+ width: 100%;
165
+ transition-property: box-shadow, opacity;
166
+ overflow-wrap: break-word;
167
+ /*box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
168
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);*/
169
+ }
170
+ .visualization-justify-center {
171
+ justify-content: center;
172
+ }
173
+ .visualization-align-center {
174
+ align-items: center;
175
+ }
176
+ #visualization-container {
177
+ max-width: 100% !important;
178
+ margin: 0 auto !important;
179
+ height: 100%;
180
+ border-bottom: none;
181
+ }
182
+ #visualization-container > .card {
183
+ border-radius: 0 !important;
184
+ font-size: 12px;
185
+ width: 100%;
186
+ box-shadow: none;
187
+ height: 100%;
188
+ }
189
+ #command-bar,
190
+ #info-bar {
191
+ background-color: #f5f5f5;
192
+ box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14),
193
+ 0 1px 5px 0 rgba(0, 0, 0, 0.12);
194
+ }
195
+ #command-bar button {
196
+ width: 42px;
197
+ height: 36px;
198
+ border: none;
199
+ background: none;
200
+ }
201
+ #command-bar button:hover {
202
+ cursor: pointer;
203
+ background: rgba(0, 0, 0, 0.12);
204
+ }
205
+ #command-bar svg {
206
+ font-size: 16px;
207
+ }
208
+ #command-bar {
209
+ padding: 0 !important;
210
+ }
211
+ #info-bar {
212
+ padding: 4px;
213
+ font-size: 14px;
214
+ position: relative;
215
+ }
216
+ .settings-container {
217
+ position: absolute;
218
+ right: 14px;
219
+ top: 50%;
220
+ transform: translateY(-50%);
221
+ }
222
+ .settings-container > * {
223
+ margin: 0 2px;
224
+ cursor: pointer;
225
+ }
226
+ #info-bar svg {
227
+ font-size: 16px;
228
+ }
229
+ #info-bar .divider {
230
+ margin: 0 8px;
231
+ }
232
+ svg:focus {
233
+ border: none;
234
+ }
235
+ .visualization-card {
236
+ border-left: 8px solid #eee;
237
+ }
238
+ .active-tab {
239
+ border-left: 8px solid var(--visualization-primary) !important;
240
+ border-image-slice: 1;
241
+ }
242
+ [id^='frame-'] {
243
+ padding: 1px;
244
+ display: flex;
245
+ flex-flow: column;
246
+ }
247
+ .tooltip {
248
+ display: block !important;
249
+ z-index: 10000;
250
+ }
251
+ .tooltip .tooltip-inner {
252
+ background: var(--visualization-primary);
253
+ color: white;
254
+ border-radius: 16px;
255
+ padding: 5px 10px 4px;
256
+ }
257
+ .tooltip .tooltip-arrow {
258
+ width: 0;
259
+ height: 0;
260
+ border-style: solid;
261
+ position: absolute;
262
+ margin: 5px;
263
+ border-color: var(--visualization-primary);
264
+ z-index: 1;
265
+ }
266
+ .tooltip[x-placement^='top'] {
267
+ margin-bottom: 5px;
268
+ }
269
+ .tooltip[x-placement^='top'] .tooltip-arrow {
270
+ border-width: 5px 5px 0 5px;
271
+ border-left-color: transparent !important;
272
+ border-right-color: transparent !important;
273
+ border-bottom-color: transparent !important;
274
+ bottom: -5px;
275
+ left: calc(50% - 5px);
276
+ margin-top: 0;
277
+ margin-bottom: 0;
278
+ }
279
+ .tooltip[x-placement^='bottom'] {
280
+ margin-top: 5px;
281
+ }
282
+ .tooltip[x-placement^='bottom'] .tooltip-arrow {
283
+ border-width: 0 5px 5px 5px;
284
+ border-left-color: transparent !important;
285
+ border-right-color: transparent !important;
286
+ border-top-color: transparent !important;
287
+ top: -5px;
288
+ left: calc(50% - 5px);
289
+ margin-top: 0;
290
+ margin-bottom: 0;
291
+ }
292
+ .tooltip[x-placement^='right'] {
293
+ margin-left: 5px;
294
+ }
295
+ .tooltip[x-placement^='right'] .tooltip-arrow {
296
+ border-width: 5px 5px 5px 0;
297
+ border-left-color: transparent !important;
298
+ border-top-color: transparent !important;
299
+ border-bottom-color: transparent !important;
300
+ left: -5px;
301
+ top: calc(50% - 5px);
302
+ margin-left: 0;
303
+ margin-right: 0;
304
+ }
305
+ .tooltip[x-placement^='left'] {
306
+ margin-right: 5px;
307
+ }
308
+ .tooltip[x-placement^='left'] .tooltip-arrow {
309
+ border-width: 5px 0 5px 5px;
310
+ border-top-color: transparent !important;
311
+ border-right-color: transparent !important;
312
+ border-bottom-color: transparent !important;
313
+ right: -5px;
314
+ top: calc(50% - 5px);
315
+ margin-left: 0;
316
+ margin-right: 0;
317
+ }
318
+ .tooltip.popover .popover-inner {
319
+ background: #f9f9f9;
320
+ color: black;
321
+ padding: 24px;
322
+ border-radius: 5px;
323
+ box-shadow: 0 5px 30px rgba(black, 0.1);
324
+ }
325
+ .tooltip.popover .popover-arrow {
326
+ border-color: #f9f9f9;
327
+ }
328
+ .tooltip[aria-hidden='true'] {
329
+ visibility: hidden;
330
+ opacity: 0;
331
+ transition: opacity 0.15s, visibility 0.15s;
332
+ }
333
+ .tooltip[aria-hidden='false'] {
334
+ visibility: visible;
335
+ opacity: 1;
336
+ transition: opacity 0.15s;
337
+ }
338
+
339
+
340
+