@viewlift/player-backup 2.0.321-backup → 2.0.322-backup

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 (55) hide show
  1. package/cjs/bundle.css +999 -992
  2. package/cjs/{features-ead9312b.js → features-db5508ee.js} +1 -1
  3. package/cjs/{index-1a660cab.js → index-7872810d.js} +1 -1
  4. package/cjs/index.js +1 -1
  5. package/cjs/{nextEpisodeButton-a697a365.js → nextEpisodeButton-a0a60ba4.js} +1 -1
  6. package/cjs/{series-d741435e.js → series-ea8c865c.js} +1 -1
  7. package/cjs/{series-v2-63fad536.js → series-v2-9dd40100.js} +1 -1
  8. package/cjs/{settings-icon-0642c8ef.js → settings-icon-8bb0d3f0.js} +1 -1
  9. package/cjs/{skin-077cde6d.js → skin-183b653f.js} +1 -1
  10. package/cjs/{skin-0b299876.js → skin-2e66860e.js} +1 -1
  11. package/cjs/{skin-10a484ea.js → skin-671692b8.js} +1 -1
  12. package/cjs/{skin-d42aa49e.js → skin-723fa423.js} +1 -1
  13. package/cjs/{skin-ca146ade.js → skin-9aa305cd.js} +1 -1
  14. package/cjs/skin-b5f248db.js +1 -0
  15. package/cjs/{skin-afc822cd.js → skin-b8d3d8eb.js} +1 -1
  16. package/cjs/{skin-b129934d.js → skin-ede3604c.js} +1 -1
  17. package/esm/{autoNextVideo-e5094e69.js → autoNextVideo-b094b4eb.js} +1 -1
  18. package/esm/bundle.css +999 -992
  19. package/esm/{caption-settings-8dfcb482.js → caption-settings-567b8533.js} +1 -1
  20. package/esm/{captions-75f20905.js → captions-15915fce.js} +1 -1
  21. package/esm/components/chapters/bootstrap.d.ts +2 -0
  22. package/esm/components/chapters/index.d.ts +3 -2
  23. package/esm/{features-c1140e31.js → features-d1c0969b.js} +1 -1
  24. package/esm/{generic-617ae917.js → generic-279952e4.js} +1 -1
  25. package/esm/{index-72c93f98.js → index-76ed817b.js} +1 -1
  26. package/esm/{index-14a1856f.js → index-7814cd08.js} +1 -1
  27. package/esm/{index-ec92c082.js → index-85c4eeac.js} +1 -1
  28. package/esm/{index-7cc84012.js → index-9064019b.js} +1 -1
  29. package/esm/index.js +1 -1
  30. package/esm/{multicamv2-87ae9104.js → multicamv2-68192e76.js} +1 -1
  31. package/esm/{multicamv2-05d8804a.js → multicamv2-bdfc13c0.js} +1 -1
  32. package/esm/{nextEpisodeButton-9f887be1.js → nextEpisodeButton-a1b670a6.js} +1 -1
  33. package/esm/{playlist-4b9c88cb.js → playlist-cab0eaa2.js} +1 -1
  34. package/esm/{series-c9d76061.js → series-ffaee63d.js} +1 -1
  35. package/esm/{series-v2-50bc486c.js → series-v2-5717bfa3.js} +1 -1
  36. package/esm/series-v2-e27f4583.js +1 -0
  37. package/esm/{skin-3fcf1ead.js → skin-020af4ff.js} +1 -1
  38. package/esm/{skin-fd365cae.js → skin-120caa60.js} +1 -1
  39. package/esm/{skin-6573096c.js → skin-2c35d22d.js} +1 -1
  40. package/esm/{skin-35d860af.js → skin-2d147bae.js} +1 -1
  41. package/esm/{skin-c5f65efa.js → skin-3c5e5bca.js} +1 -1
  42. package/esm/{skin-7afa0cd0.js → skin-80480af1.js} +1 -1
  43. package/esm/{skin-ea1f1039.js → skin-85e53acf.js} +1 -1
  44. package/esm/skin-961379a6.js +1 -0
  45. package/esm/{skin-3a6f74c2.js → skin-c27a730c.js} +1 -1
  46. package/esm/{skin-bc97f378.js → skin-f685cb99.js} +1 -1
  47. package/esm/{videoSelector-c8f11e23.js → videoSelector-89ff2577.js} +1 -1
  48. package/esm/videoSelector-a3f01f77.js +1 -0
  49. package/package.json +29 -29
  50. package/cjs/index-826e1008.js +0 -1
  51. package/cjs/skin-52203b41.js +0 -1
  52. package/esm/index-9742ce03.js +0 -1
  53. package/esm/series-v2-35fd8e52.js +0 -1
  54. package/esm/skin-17ec701c.js +0 -1
  55. package/esm/videoSelector-1bcc2f06.js +0 -1
package/cjs/bundle.css CHANGED
@@ -1,145 +1,481 @@
1
1
 
2
2
 
3
3
 
4
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
5
- font-size: 2.2em;
6
- line-height: 2.6;
7
- }
8
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
9
- background: white;
10
- }
11
- .video-js.skin_news .vjs-control-bar{
12
- z-index: 1 !important;
13
- height: 5em !important;
14
- background: black !important;
15
- }
16
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
4
+
5
+
6
+
7
+
8
+ .video-js.skin_cn_news .vjs-control-bar {
9
+ z-index: 1 !important;
10
+ height: auto !important;
11
+ padding: 0.8em 30px 0.6em;
12
+ background: transparent !important;
17
13
  display: flex;
14
+ flex-wrap: wrap;
18
15
  align-items: center;
19
- justify-content: center;
16
+ column-gap: 10px;
20
17
  }
21
18
 
22
- .video-js.skin_news .vjs-fade>* {
23
- visibility: hidden !important;
24
- opacity: 0 !important;
25
- transition: visibility 1s, opacity 1s !important;
26
- }
27
19
 
28
- .video-js.skin_news .custom-spaced-progress-bar {
20
+ .video-js.skin_cn_news .vjs-control-bar::before {
21
+ content: '';
29
22
  position: absolute;
30
- width: 100%;
31
- display: flex;
32
- height: 0.5em;
33
- top: -0.5em;
23
+ left: 0;
24
+ right: 0;
25
+ bottom: 0;
26
+ top: -3em;
27
+ background: linear-gradient(
28
+ to top,
29
+ rgba(0, 0, 0, 0.85) 0%,
30
+ rgba(0, 0, 0, 0.7) 40%,
31
+ rgba(0, 0, 0, 0.55) 70%,
32
+ rgba(0, 0, 0, 0.38) 86%,
33
+ transparent 100%
34
+ );
35
+ pointer-events: none;
36
+ z-index: -1;
34
37
  }
35
38
 
36
- .video-js.skin_news .vjs-progress-control {
37
- /* left: -6px; */
39
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
40
+ order: -1;
41
+ flex: 0 0 100%;
42
+ width: 80%;
43
+ margin: 0 0 5em;
38
44
  position: relative;
39
- width: 100%;
40
- height: 0.5em;
41
- transition: height 0.1s, top 0.1s;
42
45
  }
43
46
 
47
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
48
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
49
+ width: auto;
50
+ min-width: 0;
51
+ }
52
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
53
+ display: inline-flex;
54
+ align-items: center;
55
+ justify-content: center;
56
+ height: 7em;
57
+ padding: 0 10px;
58
+ color: #fff;
59
+ }
44
60
 
61
+ .video-js.skin_cn_news .vjs-svg-icon::before {
62
+ content: none !important;
63
+ }
45
64
 
46
65
 
47
- .video-js.skin_news .vjs-custom-control-spacer {
66
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
67
+ display: inline-flex;
68
+ align-items: center;
69
+ justify-content: center;
70
+ }
71
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
72
+ .video-js.skin_cn_news .vjs-rewind-button svg {
73
+ width: 24px;
74
+ height: 24px;
48
75
  display: block;
49
- flex: 1 1 auto;
50
76
  }
51
77
 
52
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
53
- margin: 0 0px 0 0px;
54
- }
55
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
56
- display: none;
78
+
79
+
80
+ .video-js.skin_cn_news .vjs-subs-caps-button {
81
+ opacity: 1;
57
82
  }
58
83
 
59
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
60
- font-size: 14px;
61
- font-weight: 500;
84
+
85
+
86
+ .video-js.skin_cn_news .vjs-volume-panel {
87
+ margin: 0;
88
+ display: inline-flex;
89
+ align-items: center;
62
90
  align-self: center;
63
- height: min-content;
64
- padding: 5px 2px;
65
- border-radius: 8px;
91
+ height: 2.2em;
92
+ min-width: 7em;
93
+ transition: none;
66
94
  }
67
-
68
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
69
- height: 6px !important;
95
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
96
+ width: 0;
97
+ height: 100%;
98
+ display: flex;
99
+ align-items: center;
100
+ overflow: hidden;
101
+ opacity: 0;
102
+ transition: width 0.15s ease, opacity 0.15s ease;
103
+ }
104
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
105
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
106
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
107
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
108
+ width: 5em;
109
+ opacity: 1;
70
110
  }
71
111
 
72
- .video-js.skin_news .vjs-play-progress:before {
73
- font-size: 1.5em;
74
- line-height: unset;
75
- top: -0.3333333333em;
112
+ .video-js.skin_cn_news .vjs-volume-bar {
113
+ width: 4em;
114
+ height: 0.3em;
115
+ margin: 0 0.45em;
76
116
  }
77
117
 
78
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
118
+
119
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
79
120
  display: none !important;
80
121
  }
81
122
 
82
- /* */
83
- .video-js.skin_news .vjs-mouse-display{
84
- font-size: 1.6666666667em;
123
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
124
+ width: 0 !important;
85
125
  }
86
126
 
87
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
88
- font-size: 1em !important;
127
+
128
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
129
+ display: block !important;
130
+ flex: 1 1 auto;
89
131
  }
90
132
 
91
- .video-js.skin_news .vjs-button{
92
- width: 5.3em;
133
+
134
+ .video-js.skin_cn_news .vjs-big-play-button {
135
+ display: none;
136
+ }
137
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
138
+ position: relative !important;
139
+ display: flex;
140
+ left: 0;
141
+ top: -1px;
142
+ }
143
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
93
144
  display: flex;
94
- align-items: center;
95
145
  justify-content: center;
146
+ align-items: center;
147
+ position: absolute;
148
+ top: 0;
149
+ left: 0;
150
+ right: 0;
151
+ bottom: 0;
152
+ margin: auto;
153
+ width: 80px;
154
+ height: 80px;
155
+ border: none;
156
+ border-radius: 50%;
157
+ background: rgba(0, 0, 0, 0.55);
158
+ font-size: 5em;
159
+ line-height: 1.3em;
160
+ transform: none !important;
96
161
  }
97
162
 
98
163
 
99
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
100
- .icon-maximize {
101
- display: block;
102
- height: 32px;
164
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
165
+ height: 4px !important;
166
+ margin: 0;
167
+ border-radius: 20px;
168
+ background-color: #393944;
103
169
  }
104
170
 
105
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
106
- line-height: 4;
171
+ .video-js.skin_cn_news .vjs-play-progress {
172
+ background-color: #ffffff;
173
+ border-radius: 20px;
107
174
  }
108
175
 
109
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
110
- .icon-minimize {
111
- display: none;
112
- height: 32px;
176
+ .video-js.skin_cn_news .vjs-load-progress,
177
+ .video-js.skin_cn_news .vjs-load-progress div {
178
+ background: rgba(255, 255, 255, 0.15);
179
+ border-radius: 20px;
113
180
  }
114
181
 
115
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
116
- outline: none !important;
182
+
183
+ .video-js.skin_cn_news .vjs-play-progress:before {
184
+ content: '';
185
+ width: 16px;
186
+ height: 16px;
187
+ border-radius: 50%;
188
+ background: #ffffff;
189
+ border: 2px solid rgba(0, 0, 0, 0.6);
190
+ box-sizing: border-box;
191
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
192
+ top: -6px;
193
+ right: -8px;
194
+ position: absolute;
117
195
  }
118
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
119
- .vjs-icon-fullscreen-enter:before {
120
- /* content: '' !important; */
196
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
197
+ display: none !important;
121
198
  }
122
199
 
123
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
124
- display: flex;
125
- justify-content: center;
126
- align-items: center;
127
- /* transform: rotate(90deg); */
200
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
201
+ background: #ffffff;
202
+ color: #0a0e17;
203
+ font-weight: 700;
204
+ border-radius: 3px;
128
205
  }
129
206
 
130
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
131
- display: none;
132
- }
133
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
134
- margin-left: -10px;
207
+ .video-js.skin_cn_news .vjs-live-control {
208
+ display: none !important;
135
209
  }
136
-
137
- .video-js.skin_news .skipbtn:hover{
210
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
211
+ display: inline-flex;
212
+ align-items: center;
213
+ align-self: center;
214
+ height: 2.2em;
215
+ gap: 5px;
216
+ width: auto;
217
+ padding: 0 10px;
218
+ border: 1px solid rgba(255, 255, 255, 0.45);
219
+ border-radius: 4px;
138
220
  cursor: pointer;
139
221
  }
140
222
 
141
- .video-js.skin_news .rewindbtn:hover{
142
- cursor: pointer;
223
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
224
+ display: none;
225
+ }
226
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
227
+ display: inline-flex;
228
+ align-items: center;
229
+ }
230
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
231
+ content: '';
232
+ display: inline-block;
233
+ width: 8px;
234
+ height: 8px;
235
+ border-radius: 50%;
236
+ background: #ff2d2d; /* red live dot */
237
+ }
238
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
239
+ color: #ffffff;
240
+ font-weight: 700;
241
+ font-size: 12px;
242
+ letter-spacing: 0.03em;
243
+ }
244
+
245
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
246
+ border-color: transparent;
247
+ }
248
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
249
+ color: #ff2d2d;
250
+ }
251
+
252
+ /* ---- time controls ---- */
253
+ .video-js.skin_cn_news .vjs-current-time,
254
+ .video-js.skin_cn_news .vjs-duration,
255
+ .video-js.skin_cn_news .vjs-time-divider {
256
+ display: none !important;
257
+ }
258
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
259
+ display: none;
260
+ align-items: center;
261
+ justify-content: center;
262
+ font-size: 11px;
263
+ font-weight: 700;
264
+ color: #fff;
265
+ padding: 0 6px;
266
+ user-select: none;
267
+ }
268
+
269
+
270
+ .video-js.skin_cn_news .vjs-chapter-marker {
271
+ z-index: 2;
272
+ width: var(--vl-chapter-size, 8px);
273
+ height: var(--vl-chapter-size, 8px);
274
+ top: 50%;
275
+ bottom: auto;
276
+ background: var(--vl-chapter-color, #ffffff);
277
+ opacity: var(--vl-chapter-opacity, 1);
278
+ border-radius: 50%;
279
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
280
+ transform: translate(-50%, -50%) scale(1);
281
+ transition: background-color 0.12s ease;
282
+ }
283
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
284
+ background: var(--vl-chapter-hover, #0a5cff);
285
+ }
286
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
287
+ background: var(--vl-chapter-active, #0a5cff);
288
+ }
289
+
290
+
291
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
292
+ width: 16px;
293
+ height: 16px;
294
+ bottom: 160%;
295
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
296
+ }
297
+
298
+
299
+ .video-js.skin_cn_news .vjs-chapter-preview {
300
+ background: var(--vl-chapter-tooltip, #0a5cff);
301
+ border-radius: 6px;
302
+ padding: 8px 10px;
303
+ width: max-content;
304
+ max-width: 300px;
305
+ text-align: left;
306
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
307
+ }
308
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
309
+ color: #ffffff;
310
+ font-size: 13px;
311
+ font-weight: 400;
312
+ margin-bottom: 2px;
313
+ }
314
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
315
+ color: #ffffff;
316
+ font-size: 13px;
317
+ font-weight: 400;
318
+ line-height: 1.3;
319
+ white-space: normal;
320
+ text-align: left;
321
+ }
322
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
323
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
324
+ }
325
+
326
+ /* ---- responsive ---- */
327
+ @media (max-width: 576px) {
328
+ .video-js.skin_cn_news .vjs-control-bar {
329
+ height: 3.2em !important;
330
+ padding: 0 8px;
331
+ }
332
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
333
+ padding: 0 6px;
334
+ }
335
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
336
+ display: none !important;
337
+ }
338
+ }
339
+
340
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
341
+ font-size: 2.2em;
342
+ line-height: 2.6;
343
+ }
344
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
345
+ background: white;
346
+ }
347
+ .video-js.skin_news .vjs-control-bar{
348
+ z-index: 1 !important;
349
+ height: 5em !important;
350
+ background: black !important;
351
+ }
352
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
353
+ display: flex;
354
+ align-items: center;
355
+ justify-content: center;
356
+ }
357
+
358
+ .video-js.skin_news .vjs-fade>* {
359
+ visibility: hidden !important;
360
+ opacity: 0 !important;
361
+ transition: visibility 1s, opacity 1s !important;
362
+ }
363
+
364
+ .video-js.skin_news .custom-spaced-progress-bar {
365
+ position: absolute;
366
+ width: 100%;
367
+ display: flex;
368
+ height: 0.5em;
369
+ top: -0.5em;
370
+ }
371
+
372
+ .video-js.skin_news .vjs-progress-control {
373
+ /* left: -6px; */
374
+ position: relative;
375
+ width: 100%;
376
+ height: 0.5em;
377
+ transition: height 0.1s, top 0.1s;
378
+ }
379
+
380
+
381
+
382
+
383
+ .video-js.skin_news .vjs-custom-control-spacer {
384
+ display: block;
385
+ flex: 1 1 auto;
386
+ }
387
+
388
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
389
+ margin: 0 0px 0 0px;
390
+ }
391
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
392
+ display: none;
393
+ }
394
+
395
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
396
+ font-size: 14px;
397
+ font-weight: 500;
398
+ align-self: center;
399
+ height: min-content;
400
+ padding: 5px 2px;
401
+ border-radius: 8px;
402
+ }
403
+
404
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
405
+ height: 6px !important;
406
+ }
407
+
408
+ .video-js.skin_news .vjs-play-progress:before {
409
+ font-size: 1.5em;
410
+ line-height: unset;
411
+ top: -0.3333333333em;
412
+ }
413
+
414
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
415
+ display: none !important;
416
+ }
417
+
418
+ /* */
419
+ .video-js.skin_news .vjs-mouse-display{
420
+ font-size: 1.6666666667em;
421
+ }
422
+
423
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
424
+ font-size: 1em !important;
425
+ }
426
+
427
+ .video-js.skin_news .vjs-button{
428
+ width: 5.3em;
429
+ display: flex;
430
+ align-items: center;
431
+ justify-content: center;
432
+ }
433
+
434
+
435
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
436
+ .icon-maximize {
437
+ display: block;
438
+ height: 32px;
439
+ }
440
+
441
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
442
+ line-height: 4;
443
+ }
444
+
445
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
446
+ .icon-minimize {
447
+ display: none;
448
+ height: 32px;
449
+ }
450
+
451
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
452
+ outline: none !important;
453
+ }
454
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
455
+ .vjs-icon-fullscreen-enter:before {
456
+ /* content: '' !important; */
457
+ }
458
+
459
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
460
+ display: flex;
461
+ justify-content: center;
462
+ align-items: center;
463
+ /* transform: rotate(90deg); */
464
+ }
465
+
466
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
467
+ display: none;
468
+ }
469
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
470
+ margin-left: -10px;
471
+ }
472
+
473
+ .video-js.skin_news .skipbtn:hover{
474
+ cursor: pointer;
475
+ }
476
+
477
+ .video-js.skin_news .rewindbtn:hover{
478
+ cursor: pointer;
143
479
  }
144
480
 
145
481
  .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
@@ -529,223 +865,31 @@
529
865
 
530
866
 
531
867
 
532
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
533
- height: 0.7em;
534
- position: absolute;
535
- top: -0.7em;
536
- width: 100%;
537
- }
538
-
539
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
540
- height: 100%;
541
- }
542
-
543
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
544
- line-height: 2.5;
545
- }
546
-
547
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
548
- height: 19px;
549
- width: 19px;
550
- cursor: pointer;
551
- }
552
- .video-js.skin_vlone .vjs-control {
553
- user-select: none;
554
- }
555
- .video-js.skin_vlone .vjs-custom-control-spacer{
556
- user-select: none;
557
- }
558
-
559
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
560
- height: 19px;
561
- width: 19px;
562
- cursor: pointer;
563
- }
564
-
565
- .video-js.skin_vlone .vjs-play-progress:before {
566
- display: none !important;
567
- }
568
-
569
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
570
- margin: 0 !important;
571
-
572
- }
573
-
574
-
575
- .video-js.skin_vlone .vjs-custom-control-spacer {
576
- display: block;
577
- flex: 1 1 auto;
578
- }
579
-
580
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
581
- z-index: 1;
582
- }
583
-
584
-
585
- .video-js.skin_vlone .vjs-control-bar {
586
- height: 40px;
587
- }
588
-
589
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
590
- .vjs-button>.vjs-icon-placeholder:before {
591
- position: relative !important;
592
- }
593
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
594
- display: flex;
595
- left: 0px;
596
- top: -1px;
597
- }
598
-
599
- .vjs-button>.vjs-icon-placeholder:before {
600
- font-size: 2em !important;
601
- }
602
-
603
- .video-js.skin_vlone .vjs-control {
604
- width: 4.3em;
605
- }
606
-
607
- .vjs-menu-button-popup .vjs-menu {
608
- bottom: 10px !important;
609
- }
610
-
611
-
612
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
613
- height: 1.3em;
614
- position: absolute;
615
- top: -1.3em;
616
- transition: height 0.3s, top 0.3s;
617
- }
618
-
619
-
620
- .video-js.skin_vlone.vjs-live .vjs-time-control{
621
- display: none !important;
622
- }
623
-
624
- .video-js.skin_vlone .vjs-time-control {
625
- display: block;
626
- }
627
- .video-js.skin_vlone .vjs-remaining-time {
628
- display: none;
629
- }
630
-
631
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
632
- line-height: 3.5em;
633
- font-size: 1.1em;
634
- min-width: 4em;
635
- }
636
-
637
- .video-js.skin_vlone .vjs-time-divider > div{
638
- display: flex;
639
- justify-content: center;
640
- }
641
-
642
- .video-js.skin_vlone .vjs-live-control{
643
- align-items: center;
644
- }
645
- .video-js.skin_vlone .vjs-live-display{
646
- height: 2.2em;
647
- display: flex;
648
- align-items: center;
649
- font-family: monospace;
650
- width: 4em;
651
- justify-content: center;
652
- background: red;
653
- margin: 4px 0px 4px 12px;
654
- }
655
- .video-js.skin_vlone .vjs-live-display:hover{
656
- cursor: pointer;
657
- }
658
-
659
- .video-js.skin_vlone .vjs-time-control {
660
- line-height: 3.5em !important;
661
- font-size: 1.1em !important;
662
- width: min-content !important;
663
- min-width: 1.5em;
664
- padding: 0 !important;
665
- user-select: none;
666
- }
667
-
668
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
669
- margin-left: 16px !important;
670
- }
671
-
672
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
673
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
674
- font-size: 1.2em !important;
675
- line-height: 1.5em !important;
676
- padding: 0.2em 0.8em !important;
677
- }
678
-
679
-
680
- /* Big play */
681
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
682
- width: 80px;
683
- height: 80px;
684
- display: flex;
685
- justify-content: center;
686
- align-items: center;
687
- border: none;
688
- position: absolute;
689
- top: 0;
690
- left: 0;
691
- right: 0;
692
- bottom: 0;
693
- margin: auto;
694
- font-size: 5em;
695
- line-height: 1.3em;
696
- transform: none !important;
697
- border-radius: 1.3em;
698
- }
699
- .video-js.skin_vlone .ssai-ad-container{
700
- position: absolute;
701
- bottom: 4px;
702
- }
703
-
704
- @media(max-width:600px){
705
- .video-js.skin_vlone button.vjs-big-play-button {
706
- width: 50px !important;
707
- height: 50px !important;
708
- font-size: 2.1rem !important;
709
- }
710
-
711
- .video-js.skin_vlone .ssai-ad-container {
712
- position: absolute;
713
- bottom: 2px;
714
- }
715
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
716
- display: none;
717
- }
718
-
719
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
720
- /* display: none; */
721
- }
722
-
723
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
724
- /* display: none; */
725
- }
726
- }
727
-
728
-
729
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
868
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
730
869
  font-size: 2.2em;
731
870
  line-height: 2.6;
732
871
  }
733
- .video-js.skin_mini{
734
- overflow: hidden;
872
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
873
+ background: #fcb700;
735
874
  }
736
- .video-js.skin_mini .vjs-control-bar{
875
+ .video-js.skin_news_live .vjs-control-bar{
737
876
  z-index: 1 !important;
738
- height: 4em !important;
877
+ height: 5em !important;
739
878
  background: black !important;
740
879
  }
880
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
881
+ display: flex;
882
+ align-items: center;
883
+ justify-content: center;
884
+ }
741
885
 
742
- .video-js.skin_mini .vjs-fade>* {
886
+ .video-js.skin_news_live .vjs-fade>* {
743
887
  visibility: hidden !important;
744
888
  opacity: 0 !important;
745
889
  transition: visibility 1s, opacity 1s !important;
746
890
  }
747
891
 
748
- .video-js.skin_mini .custom-spaced-progress-bar {
892
+ .video-js.skin_news_live .custom-spaced-progress-bar {
749
893
  position: absolute;
750
894
  width: 100%;
751
895
  display: flex;
@@ -753,7 +897,7 @@
753
897
  top: -0.5em;
754
898
  }
755
899
 
756
- .video-js.skin_mini .vjs-progress-control {
900
+ .video-js.skin_news_live .vjs-progress-control {
757
901
  /* left: -6px; */
758
902
  position: relative;
759
903
  width: 100%;
@@ -761,22 +905,25 @@
761
905
  transition: height 0.1s, top 0.1s;
762
906
  }
763
907
 
908
+ .video-js.skin_news_live .vjs-volume-panel{
909
+ min-width: 5.3em;
910
+ }
764
911
 
765
912
 
766
913
 
767
- .video-js.skin_mini .vjs-custom-control-spacer {
768
- display: block;
769
- flex: 1 1 auto;
914
+ .video-js.skin_news_live .vjs-custom-control-spacer {
915
+ /* display: block; */
916
+ /* flex: 1 1 auto; */
770
917
  }
771
918
 
772
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
919
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
773
920
  margin: 0 0px 0 0px;
774
921
  }
775
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
922
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
776
923
  display: none;
777
924
  }
778
925
 
779
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
926
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
780
927
  font-size: 14px;
781
928
  font-weight: 500;
782
929
  align-self: center;
@@ -785,207 +932,199 @@
785
932
  border-radius: 8px;
786
933
  }
787
934
 
788
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
789
- height: 5px !important;
935
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
936
+ height: 6px !important;
790
937
  }
791
938
 
792
- .video-js.skin_mini .vjs-play-progress:before {
793
- font-size: 1.3em;
939
+ .video-js.skin_news_live .vjs-play-progress:before {
940
+ font-size: 1.5em;
794
941
  line-height: unset;
795
942
  top: -0.3333333333em;
796
943
  }
797
944
 
798
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
945
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
799
946
  display: none !important;
800
947
  }
801
948
 
802
949
  /* */
803
- .video-js.skin_mini .vjs-mouse-display{
950
+ .video-js.skin_news_live .vjs-mouse-display{
804
951
  font-size: 1.6666666667em;
805
952
  }
806
953
 
807
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
954
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
808
955
  font-size: 1em !important;
809
956
  }
810
957
 
811
- .video-js.skin_mini .vjs-button{
812
- width: 3em;
958
+ .video-js.skin_news_live .vjs-button{
959
+ width: 5.3em;
813
960
  display: flex;
814
961
  align-items: center;
815
962
  justify-content: center;
816
963
  }
817
964
 
818
965
 
819
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
966
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
820
967
  .icon-maximize {
821
968
  display: block;
822
969
  height: 32px;
823
970
  }
824
971
 
825
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
972
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
826
973
  line-height: 4;
827
974
  }
828
975
 
829
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
976
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
830
977
  .icon-minimize {
831
978
  display: none;
832
979
  height: 32px;
833
980
  }
834
981
 
835
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
982
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
836
983
  outline: none !important;
984
+ /* flex: 1; */
837
985
  }
838
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
986
+ .video-js.skin_news_live .vjs-play-toggle-container{
987
+ display: flex;
988
+ flex: 1;
989
+ justify-content: center;
990
+ }
991
+
992
+
993
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
839
994
  .vjs-icon-fullscreen-enter:before {
840
995
  /* content: '' !important; */
841
996
  }
842
997
 
843
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
998
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
844
999
  display: flex;
845
1000
  justify-content: center;
846
1001
  align-items: center;
847
1002
  /* transform: rotate(90deg); */
848
1003
  }
849
1004
 
850
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1005
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
851
1006
  display: none;
852
1007
  }
853
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1008
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
854
1009
  margin-left: -10px;
855
- display: none;
856
- }
857
-
858
- .video-js.skin_mini .vjs-loading-spinner {
859
- position: absolute;
860
- top: 50%;
861
- left: 50%;
862
- transform: translate(-50%, -50%);
863
- opacity: .85;
864
- text-align: left;
865
- border: .2em solid rgba(43, 51, 63, .7);
866
- box-sizing: border-box;
867
- background-clip: padding-box;
868
- width: 3em;
869
- height: 3em;
870
- border-radius: 50%;
871
- visibility: hidden;
872
1010
  }
873
1011
 
874
- .video-js.skin_mini .skipbtn:hover{
1012
+ .video-js.skin_news_live .skipbtn:hover{
875
1013
  cursor: pointer;
876
1014
  }
877
1015
 
878
- .video-js.skin_mini .rewindbtn:hover{
1016
+ .video-js.skin_news_live .rewindbtn:hover{
879
1017
  cursor: pointer;
880
1018
  }
881
1019
 
882
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1020
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
883
1021
  position: relative;
884
1022
  padding-left: 0;
885
1023
  }
886
1024
 
887
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
888
- width: 40px;
889
- height: 40px;
890
- display: flex;
891
- justify-content: center;
892
- align-items: center;
893
- border: none;
894
- position: absolute;
895
- top: 0;
896
- left: 0;
897
- right: 0;
898
- bottom: 0;
899
- margin: auto;
900
- font-size: 3em;
901
- line-height: 1.3em;
902
- transform: none !important;
903
- border-radius: 1.3em;
1025
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1026
+ display: none !important;
904
1027
  }
905
1028
 
906
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1029
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1030
+ /* width: 90px;
1031
+ height: 90px;
1032
+ display: flex;
1033
+ justify-content: center;
1034
+ align-items: center;
1035
+ border-radius: 50%;
1036
+ position: absolute;
1037
+ top: 0;
1038
+ left: 0;
1039
+ right: 0;
1040
+ bottom: 0;
1041
+ margin: auto;
1042
+ font-size: 6em;
1043
+ line-height: 1.4em;
1044
+ border: 0.05em solid;
1045
+ color: inherit; */
1046
+ display: none !important;
1047
+ }
1048
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
907
1049
  font-weight: bold;
908
1050
  }
909
1051
 
910
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
911
- bottom: 1.1em !important;
912
- right: 1em;
1052
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1053
+ bottom: 2.4em !important;
1054
+ right: -1em;
913
1055
  z-index: 1;
914
- font-size: 10px;
915
1056
  }
916
1057
 
917
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1058
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
918
1059
  width: 24px !important;
919
1060
  height: 24px !important;
920
1061
  }
921
- .video-js.skin_mini .settings-selector-icon>svg{
1062
+ .settings-selector-icon>svg{
922
1063
  height: 19px !important;
923
1064
  width: 19px !important;
924
1065
  }
925
1066
 
926
1067
 
927
- .video-js.skin_mini button.vjs-rewind-button{
1068
+ .video-js.skin_news_live button.vjs-rewind-button{
928
1069
  cursor: pointer;
929
1070
  }
930
1071
 
931
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1072
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
932
1073
  padding-right: 0;
1074
+ display: none;
933
1075
  }
934
1076
 
935
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1077
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
936
1078
  padding-left: 0;
1079
+ display: none;
937
1080
  }
938
1081
 
939
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1082
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
940
1083
  padding-left: 0;
941
1084
  padding-right: 0;
942
- display: flex;
943
- justify-content: center;
944
- width: min-content;
1085
+ display: none;
945
1086
  }
946
1087
 
947
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1088
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
948
1089
  display: none
949
1090
  }
950
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1091
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
951
1092
  display: none
952
1093
  }
953
1094
 
954
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
955
- display: flex;
956
- align-items: center;
957
- font-weight: 700;
958
- font-size: 9px;
959
- min-width: 0.8em;
960
- padding-left: 0;
1095
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1096
+ display: flex;
1097
+ align-items: center;
1098
+ font-weight: 700;
1099
+ font-size: 12px;
1100
+ min-width: 1.2em;
961
1101
  }
962
1102
 
963
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1103
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
964
1104
  display: none;
965
1105
  font-size: 11px;
966
1106
  justify-content: center;
967
1107
  align-items: center;
968
1108
  user-select: none;
969
1109
  }
970
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1110
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
971
1111
  display: none;
972
1112
  }
973
1113
 
974
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1114
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
975
1115
  height: min-content;
976
1116
  width: min-content;
977
1117
  }
978
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
979
- width: 3em;
980
- margin-right: 4px;
1118
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1119
+ width: 6em;
981
1120
  }
982
1121
 
983
- .video-js.skin_mini .content{
1122
+ .video-js.skin_news_live .content{
984
1123
  bottom: 3.4rem !important;
985
1124
  right: -4rem !important;
986
1125
  }
987
1126
 
988
- .video-js.skin_mini .setting-icon > svg{
1127
+ .setting-icon > svg{
989
1128
  height:18px !important;
990
1129
  }
991
1130
 
@@ -999,16 +1138,16 @@
999
1138
  pointer-events:none
1000
1139
  }
1001
1140
 
1002
- .video-js.skin_mini iframe{
1141
+ .video-js.skin_news_live iframe{
1003
1142
  width: 100%;
1004
1143
  height: 100%;
1005
1144
  }
1006
1145
 
1007
- .video-js.skin_mini .vjs-live-control{
1146
+ .video-js.skin_news_live .vjs-live-control{
1008
1147
  align-items: center;
1009
- max-width: 5em;
1148
+ display: none;
1010
1149
  }
1011
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1150
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1012
1151
  height: 2.2em;
1013
1152
  display: flex;
1014
1153
  align-items: center;
@@ -1016,543 +1155,434 @@
1016
1155
  width: 4em;
1017
1156
  justify-content: center;
1018
1157
  background: red;
1019
- margin: 4px 0px 4px 2px;
1158
+ margin: 4px 0px 4px 12px;
1020
1159
  }
1021
1160
 
1022
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1161
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1023
1162
  text-shadow: none;
1024
1163
  }
1025
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1026
- display: none;
1027
- font-size: 12px;
1028
- }
1029
1164
 
1030
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1031
- height: 1.8em;
1032
- display: inline-flex;
1033
- align-items: center;
1034
- font-family: monospace;
1165
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1166
+ display: flex;
1035
1167
  justify-content: center;
1036
- border: 1.5px solid;
1037
- margin: 4px 0px 4px 2px;
1038
- white-space: pre;
1039
- padding: 2px 4px;
1040
- font-size: 1.2em;
1041
- font-weight: 500;
1042
- color: rgba(255, 255, 2555, 0.7);
1168
+ min-width: 5.3em;
1169
+ pointer-events: none;
1170
+ user-select: none;
1043
1171
  }
1044
1172
 
1045
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1046
- content: "NOT LIVE";
1047
- word-spacing: -4px;
1173
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1174
+ color: white;
1048
1175
  }
1049
1176
 
1050
1177
 
1051
- @media(max-width:600px){
1178
+ .settings-selection.vjs-control.vjs-button{
1179
+ display: flex !important;
1180
+ }
1181
+
1182
+ @media(max-width:576px){
1183
+ .settings-selection.vjs-control.vjs-button{
1184
+ display: none !important;
1185
+ }
1186
+ }
1187
+
1188
+
1189
+ @media(max-width:576px){
1052
1190
  .tvProviderImage{
1053
1191
  display: none
1054
1192
  }
1055
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1193
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1056
1194
  .icon-maximize {
1057
1195
  height: 30px !important;
1058
1196
  }
1059
1197
 
1060
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1198
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1061
1199
  .icon-minimize {
1062
1200
  height: 30px !important;
1063
1201
  }
1064
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1065
- width: 3.5em;
1202
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1203
+ width: 4.5em;
1066
1204
  }
1067
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1205
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1068
1206
  height: min-content;
1069
1207
  }
1070
1208
 
1071
- .video-js.skin_mini button.vjs-slowmo-button{
1209
+ .video-js.skin_news_live button.vjs-slowmo-button{
1072
1210
  display: none;
1073
1211
  }
1074
- .video-js.skin_mini button.vjs-rewind-button{
1212
+ .video-js.skin_news_live button.vjs-rewind-button{
1075
1213
  display: none;
1076
1214
  }
1077
- .video-js.skin_mini button.vjs-rewind-button>svg{
1215
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1078
1216
  height: 20px;
1079
1217
  }
1080
- .video-js.skin_mini .vjs-button{
1081
- width: 3em;
1218
+ .video-js.skin_news_live .vjs-button{
1219
+ width: 4.8em;
1082
1220
  }
1083
- .video-js.skin_mini .widget-selection{
1221
+ .video-js.skin_news_live .widget-selection{
1084
1222
  display: none;
1085
1223
  }
1086
- .video-js.skin_mini .container{
1224
+ .video-js.skin_news_live .container{
1087
1225
  display: none !important;
1088
1226
  }
1089
- .video-js.skin_mini .vjs-control-bar{
1227
+ .video-js.skin_news_live .vjs-control-bar{
1090
1228
  height: 4em !important;
1091
1229
  }
1092
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1230
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1093
1231
  font-size: 2.5em;
1094
1232
  line-height: 1.5;
1095
1233
  }
1096
- .video-js.skin_mini .vjs-play-progress:before {
1234
+ .video-js.skin_news_live .vjs-play-progress:before {
1097
1235
  font-size: 1.2em;
1098
1236
  position: absolute;
1099
1237
  right: -0.5em;
1100
1238
  z-index: 1;
1101
1239
  }
1102
- .video-js.skin_mini button.vjs-skip-button>svg{
1240
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1103
1241
  height: 20px;
1104
1242
  }
1243
+ .video-js.skin_news_live button.vjs-big-play-button {
1244
+ width: 50px !important;
1245
+ height: 50px !important;
1246
+ font-size: 2.1rem !important;
1247
+ }
1105
1248
 
1106
1249
  .stream-selector-icon>svg{
1107
1250
  width: 24px;
1108
1251
  height: 24px;
1109
1252
  }
1110
- .video-js.skin_mini .vjs-seek-to-live-text{
1111
- font-size: 12px;
1112
- }
1113
-
1114
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1115
- color: white !important;
1116
- font-size: 16px !important;
1117
- background-color: rgba(0,0,0,0.2) !important;
1118
- }
1253
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1254
+ margin: 0 12px 0 12px;
1119
1255
  }
1120
-
1121
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1122
- color: white !important;
1123
- font-size: 16px !important;
1124
- background-color: rgba(0,0,0,0.2) !important;
1256
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1257
+ font-size: 12px;
1125
1258
  }
1126
-
1127
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1128
- font-size: 18px !important;
1259
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1260
+ margin: 0 12px 0 12px;
1129
1261
  }
1130
-
1131
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1132
- margin-bottom: 1rem !important;
1133
1262
  }
1134
-
1135
-
1136
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1137
- display: flex;
1138
- justify-content: center;
1263
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1264
+ width: 90px;
1265
+ height: 90px;
1266
+ display: flex;
1267
+ justify-content: center;
1268
+ align-items: center;
1269
+ border-radius: 50%;
1270
+ position: absolute;
1271
+ top: 0;
1272
+ left: 0;
1273
+ right: 0;
1274
+ bottom: 0;
1275
+ margin: auto;
1276
+ font-size: 6em;
1277
+ line-height: 1.4em;
1278
+ }
1279
+
1280
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1281
+ display: flex;
1282
+ justify-content: center;
1139
1283
  align-items: center;
1140
1284
  height: 100%;
1141
1285
  transition: width 0.1s;
1142
1286
  }
1143
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1144
- margin: 2px;
1145
- }
1146
1287
 
1147
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1288
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1148
1289
  display: flex;
1149
1290
  justify-content: center;
1150
1291
  align-items: center;
1151
1292
  height: 100%;
1152
1293
  transition: width 0.1s;
1153
1294
  }
1154
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1155
- display: grid;
1156
- font-size: 10px;
1157
- grid-template-columns: 1fr;
1158
- grid-template-rows: 1fr;
1159
- padding: 1px 0px 0 0px;
1160
- margin: 0;
1295
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1296
+ display: none !important;
1161
1297
  }
1162
1298
 
1163
- @media (max-width: 600px) {
1164
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1299
+ @media (max-width: 576px) {
1300
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1165
1301
  height: 5px !important;
1166
1302
  }
1303
+ .video-js.skin_news_live button.vjs-big-play-button {
1304
+ width: 50px !important;
1305
+ height: 50px !important;
1306
+ font-size: 2.1rem !important;
1307
+ }
1167
1308
 
1168
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1309
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1169
1310
  display: none;
1170
1311
  }
1171
-
1312
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1313
+ bottom: 2.4em !important;
1314
+ right: -1em;
1315
+ z-index: 1;
1172
1316
  }
1317
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1318
+ display: none !important;
1319
+ }
1173
1320
 
1174
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1175
- content: none !important;
1176
- fill: none !important;
1177
- filter: none !important;
1321
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1322
+ color: white !important;
1323
+ font-size: 13px !important;
1324
+ background-color: black !important;
1325
+ }
1178
1326
  }
1179
1327
 
1180
- /* svg icons opacity and hover effect */
1181
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1182
- opacity: 0.7 !important;
1328
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1329
+ width: 100% !important;
1183
1330
  }
1184
1331
 
1185
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1186
- opacity: 1 !important;
1332
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1333
+ color: white !important;
1334
+ font-size: 16px !important;
1335
+ background-color: black !important;
1187
1336
  }
1188
1337
 
1189
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1190
- color: rgba(255, 255, 2555, 0.7)!important;
1338
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1339
+ margin-bottom: 2rem !important;
1191
1340
  }
1192
1341
 
1193
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1194
- color: rgba(255, 255, 2555, 1)!important;
1342
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
1343
+ font-size: 18px !important;
1195
1344
  }
1196
1345
 
1197
1346
 
1198
-
1199
- .video-js.skin_cn_news .vjs-control-bar {
1200
- z-index: 1 !important;
1201
- height: auto !important;
1202
- padding: 0.8em 30px 0.6em;
1203
- background: transparent !important;
1204
- display: flex;
1205
- flex-wrap: wrap;
1206
- align-items: center;
1207
- column-gap: 10px;
1347
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1348
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1349
+ font-size: 1.2em !important;
1350
+ line-height: 1.5em !important;
1351
+ padding: 0.2em 0.8em !important;
1208
1352
  }
1209
1353
 
1210
-
1211
- .video-js.skin_cn_news .vjs-control-bar::before {
1212
- content: '';
1213
- position: absolute;
1214
- left: 0;
1215
- right: 0;
1216
- bottom: 0;
1217
- top: -3em;
1218
- background: linear-gradient(
1219
- to top,
1220
- rgba(0, 0, 0, 0.85) 0%,
1221
- rgba(0, 0, 0, 0.7) 40%,
1222
- rgba(0, 0, 0, 0.55) 70%,
1223
- rgba(0, 0, 0, 0.38) 86%,
1224
- transparent 100%
1225
- );
1226
- pointer-events: none;
1227
- z-index: -1;
1354
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1355
+ content: none !important;
1356
+ fill: none !important;
1357
+ filter: none !important;
1228
1358
  }
1229
1359
 
1230
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1231
- order: -1;
1232
- flex: 0 0 100%;
1233
- width: 80%;
1234
- margin: 0 0 5em;
1235
- position: relative;
1360
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1361
+ color: rgba(255, 255, 2555, 0.7)!important;
1236
1362
  }
1237
1363
 
1238
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1239
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1240
- width: auto;
1241
- min-width: 0;
1242
- }
1243
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1244
- display: inline-flex;
1245
- align-items: center;
1246
- justify-content: center;
1247
- height: 7em;
1248
- padding: 0 10px;
1249
- color: #fff;
1364
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1365
+ color: rgba(255, 255, 2555, 1)!important;
1250
1366
  }
1251
1367
 
1252
- .video-js.skin_cn_news .vjs-svg-icon::before {
1253
- content: none !important;
1254
- }
1255
1368
 
1256
1369
 
1257
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1258
- display: inline-flex;
1259
- align-items: center;
1260
- justify-content: center;
1261
- }
1262
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1263
- .video-js.skin_cn_news .vjs-rewind-button svg {
1264
- width: 24px;
1265
- height: 24px;
1266
- display: block;
1370
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
1371
+ height: 0.7em;
1372
+ position: absolute;
1373
+ top: -0.7em;
1374
+ width: 100%;
1267
1375
  }
1268
1376
 
1269
-
1270
-
1271
- .video-js.skin_cn_news .vjs-subs-caps-button {
1272
- opacity: 1;
1377
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
1378
+ height: 100%;
1273
1379
  }
1274
1380
 
1381
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
1382
+ line-height: 2.5;
1383
+ }
1275
1384
 
1276
-
1277
- .video-js.skin_cn_news .vjs-volume-panel {
1278
- margin: 0;
1279
- display: inline-flex;
1280
- align-items: center;
1281
- align-self: center;
1282
- height: 2.2em;
1283
- min-width: 7em;
1284
- transition: none;
1385
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
1386
+ height: 19px;
1387
+ width: 19px;
1388
+ cursor: pointer;
1285
1389
  }
1286
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1287
- width: 0;
1288
- height: 100%;
1289
- display: flex;
1290
- align-items: center;
1291
- overflow: hidden;
1292
- opacity: 0;
1293
- transition: width 0.15s ease, opacity 0.15s ease;
1390
+ .video-js.skin_vlone .vjs-control {
1391
+ user-select: none;
1294
1392
  }
1295
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1296
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1297
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1298
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1299
- width: 5em;
1300
- opacity: 1;
1393
+ .video-js.skin_vlone .vjs-custom-control-spacer{
1394
+ user-select: none;
1301
1395
  }
1302
1396
 
1303
- .video-js.skin_cn_news .vjs-volume-bar {
1304
- width: 4em;
1305
- height: 0.3em;
1306
- margin: 0 0.45em;
1397
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
1398
+ height: 19px;
1399
+ width: 19px;
1400
+ cursor: pointer;
1307
1401
  }
1308
1402
 
1309
-
1310
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1311
- display: none !important;
1403
+ .video-js.skin_vlone .vjs-play-progress:before {
1404
+ display: none !important;
1312
1405
  }
1313
1406
 
1314
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1315
- width: 0 !important;
1407
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
1408
+ margin: 0 !important;
1409
+
1316
1410
  }
1317
1411
 
1318
1412
 
1319
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1320
- display: block !important;
1321
- flex: 1 1 auto;
1413
+ .video-js.skin_vlone .vjs-custom-control-spacer {
1414
+ display: block;
1415
+ flex: 1 1 auto;
1416
+ }
1417
+
1418
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
1419
+ z-index: 1;
1322
1420
  }
1323
1421
 
1324
1422
 
1325
- .video-js.skin_cn_news .vjs-big-play-button {
1326
- display: none;
1423
+ .video-js.skin_vlone .vjs-control-bar {
1424
+ height: 40px;
1327
1425
  }
1328
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1329
- position: relative !important;
1330
- display: flex;
1331
- left: 0;
1332
- top: -1px;
1426
+
1427
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
1428
+ .vjs-button>.vjs-icon-placeholder:before {
1429
+ position: relative !important;
1333
1430
  }
1334
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1335
- display: flex;
1336
- justify-content: center;
1337
- align-items: center;
1338
- position: absolute;
1339
- top: 0;
1340
- left: 0;
1341
- right: 0;
1342
- bottom: 0;
1343
- margin: auto;
1344
- width: 80px;
1345
- height: 80px;
1346
- border: none;
1347
- border-radius: 50%;
1348
- background: rgba(0, 0, 0, 0.55);
1349
- font-size: 5em;
1350
- line-height: 1.3em;
1351
- transform: none !important;
1431
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
1432
+ display: flex;
1433
+ left: 0px;
1434
+ top: -1px;
1352
1435
  }
1353
1436
 
1354
-
1355
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1356
- height: 4px !important;
1357
- margin: 0;
1358
- border-radius: 20px;
1359
- background-color: #393944;
1437
+ .vjs-button>.vjs-icon-placeholder:before {
1438
+ font-size: 2em !important;
1360
1439
  }
1361
1440
 
1362
- .video-js.skin_cn_news .vjs-play-progress {
1363
- background-color: #ffffff;
1364
- border-radius: 20px;
1441
+ .video-js.skin_vlone .vjs-control {
1442
+ width: 4.3em;
1365
1443
  }
1366
1444
 
1367
- .video-js.skin_cn_news .vjs-load-progress,
1368
- .video-js.skin_cn_news .vjs-load-progress div {
1369
- background: rgba(255, 255, 255, 0.15);
1370
- border-radius: 20px;
1445
+ .vjs-menu-button-popup .vjs-menu {
1446
+ bottom: 10px !important;
1371
1447
  }
1372
1448
 
1373
1449
 
1374
- .video-js.skin_cn_news .vjs-play-progress:before {
1375
- content: '';
1376
- width: 16px;
1377
- height: 16px;
1378
- border-radius: 50%;
1379
- background: #ffffff;
1380
- border: 2px solid rgba(0, 0, 0, 0.6);
1381
- box-sizing: border-box;
1382
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1383
- top: -6px;
1384
- right: -8px;
1385
- position: absolute;
1386
- }
1387
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1388
- display: none !important;
1450
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
1451
+ height: 1.3em;
1452
+ position: absolute;
1453
+ top: -1.3em;
1454
+ transition: height 0.3s, top 0.3s;
1389
1455
  }
1390
1456
 
1391
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1392
- background: #ffffff;
1393
- color: #0a0e17;
1394
- font-weight: 700;
1395
- border-radius: 3px;
1396
- }
1397
1457
 
1398
- .video-js.skin_cn_news .vjs-live-control {
1399
- display: none !important;
1400
- }
1401
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1402
- display: inline-flex;
1403
- align-items: center;
1404
- align-self: center;
1405
- height: 2.2em;
1406
- gap: 5px;
1407
- width: auto;
1408
- padding: 0 10px;
1409
- border: 1px solid rgba(255, 255, 255, 0.45);
1410
- border-radius: 4px;
1411
- cursor: pointer;
1458
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
1459
+ display: none !important;
1412
1460
  }
1413
1461
 
1414
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1415
- display: none;
1416
- }
1417
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1418
- display: inline-flex;
1419
- align-items: center;
1420
- }
1421
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1422
- content: '';
1423
- display: inline-block;
1424
- width: 8px;
1425
- height: 8px;
1426
- border-radius: 50%;
1427
- background: #ff2d2d; /* red live dot */
1462
+ .video-js.skin_vlone .vjs-time-control {
1463
+ display: block;
1428
1464
  }
1429
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1430
- color: #ffffff;
1431
- font-weight: 700;
1432
- font-size: 12px;
1433
- letter-spacing: 0.03em;
1465
+ .video-js.skin_vlone .vjs-remaining-time {
1466
+ display: none;
1434
1467
  }
1435
1468
 
1436
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1437
- border-color: transparent;
1438
- }
1439
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1440
- color: #ff2d2d;
1469
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
1470
+ line-height: 3.5em;
1471
+ font-size: 1.1em;
1472
+ min-width: 4em;
1441
1473
  }
1442
1474
 
1443
- /* ---- time controls ---- */
1444
- .video-js.skin_cn_news .vjs-current-time,
1445
- .video-js.skin_cn_news .vjs-duration,
1446
- .video-js.skin_cn_news .vjs-time-divider {
1447
- display: none !important;
1448
- }
1449
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1450
- display: none;
1451
- align-items: center;
1452
- justify-content: center;
1453
- font-size: 11px;
1454
- font-weight: 700;
1455
- color: #fff;
1456
- padding: 0 6px;
1457
- user-select: none;
1475
+ .video-js.skin_vlone .vjs-time-divider > div{
1476
+ display: flex;
1477
+ justify-content: center;
1458
1478
  }
1459
1479
 
1460
-
1461
- .video-js.skin_cn_news .vjs-chapter-marker {
1462
- z-index: 2;
1463
- width: var(--vl-chapter-size, 8px);
1464
- height: var(--vl-chapter-size, 8px);
1465
- top: 50%;
1466
- bottom: auto;
1467
- background: var(--vl-chapter-color, #ffffff);
1468
- opacity: var(--vl-chapter-opacity, 1);
1469
- border-radius: 50%;
1470
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1471
- transform: translate(-50%, -50%) scale(1);
1472
- transition: background-color 0.12s ease;
1480
+ .video-js.skin_vlone .vjs-live-control{
1481
+ align-items: center;
1473
1482
  }
1474
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1475
- background: var(--vl-chapter-hover, #0a5cff);
1483
+ .video-js.skin_vlone .vjs-live-display{
1484
+ height: 2.2em;
1485
+ display: flex;
1486
+ align-items: center;
1487
+ font-family: monospace;
1488
+ width: 4em;
1489
+ justify-content: center;
1490
+ background: red;
1491
+ margin: 4px 0px 4px 12px;
1476
1492
  }
1477
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1478
- background: var(--vl-chapter-active, #0a5cff);
1493
+ .video-js.skin_vlone .vjs-live-display:hover{
1494
+ cursor: pointer;
1479
1495
  }
1480
1496
 
1497
+ .video-js.skin_vlone .vjs-time-control {
1498
+ line-height: 3.5em !important;
1499
+ font-size: 1.1em !important;
1500
+ width: min-content !important;
1501
+ min-width: 1.5em;
1502
+ padding: 0 !important;
1503
+ user-select: none;
1504
+ }
1481
1505
 
1482
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1483
- width: 16px;
1484
- height: 16px;
1485
- bottom: 160%;
1486
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1506
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
1507
+ margin-left: 16px !important;
1487
1508
  }
1488
1509
 
1510
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1511
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1512
+ font-size: 1.2em !important;
1513
+ line-height: 1.5em !important;
1514
+ padding: 0.2em 0.8em !important;
1515
+ }
1489
1516
 
1490
- .video-js.skin_cn_news .vjs-chapter-preview {
1491
- background: var(--vl-chapter-tooltip, #0a5cff);
1492
- border-radius: 6px;
1493
- padding: 8px 10px;
1494
- width: max-content;
1495
- max-width: 300px;
1496
- text-align: left;
1497
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1517
+
1518
+ /* Big play */
1519
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
1520
+ width: 80px;
1521
+ height: 80px;
1522
+ display: flex;
1523
+ justify-content: center;
1524
+ align-items: center;
1525
+ border: none;
1526
+ position: absolute;
1527
+ top: 0;
1528
+ left: 0;
1529
+ right: 0;
1530
+ bottom: 0;
1531
+ margin: auto;
1532
+ font-size: 5em;
1533
+ line-height: 1.3em;
1534
+ transform: none !important;
1535
+ border-radius: 1.3em;
1498
1536
  }
1499
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1500
- color: #ffffff;
1501
- font-size: 13px;
1502
- font-weight: 400;
1503
- margin-bottom: 2px;
1537
+ .video-js.skin_vlone .ssai-ad-container{
1538
+ position: absolute;
1539
+ bottom: 4px;
1504
1540
  }
1505
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1506
- color: #ffffff;
1507
- font-size: 13px;
1508
- font-weight: 400;
1509
- line-height: 1.3;
1510
- white-space: normal;
1511
- text-align: left;
1541
+
1542
+ @media(max-width:600px){
1543
+ .video-js.skin_vlone button.vjs-big-play-button {
1544
+ width: 50px !important;
1545
+ height: 50px !important;
1546
+ font-size: 2.1rem !important;
1547
+ }
1548
+
1549
+ .video-js.skin_vlone .ssai-ad-container {
1550
+ position: absolute;
1551
+ bottom: 2px;
1512
1552
  }
1513
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1514
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1553
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
1554
+ display: none;
1515
1555
  }
1516
1556
 
1517
- /* ---- responsive ---- */
1518
- @media (max-width: 576px) {
1519
- .video-js.skin_cn_news .vjs-control-bar {
1520
- height: 3.2em !important;
1521
- padding: 0 8px;
1522
- }
1523
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1524
- padding: 0 6px;
1525
- }
1526
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1527
- display: none !important;
1528
- }
1557
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
1558
+ /* display: none; */
1529
1559
  }
1530
1560
 
1531
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1561
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
1562
+ /* display: none; */
1563
+ }
1564
+ }
1565
+
1566
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1532
1567
  font-size: 2.2em;
1533
1568
  line-height: 2.6;
1534
1569
  }
1535
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1536
- background: #fcb700;
1570
+ .video-js.skin_mini{
1571
+ overflow: hidden;
1537
1572
  }
1538
- .video-js.skin_news_live .vjs-control-bar{
1573
+ .video-js.skin_mini .vjs-control-bar{
1539
1574
  z-index: 1 !important;
1540
- height: 5em !important;
1575
+ height: 4em !important;
1541
1576
  background: black !important;
1542
1577
  }
1543
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1544
- display: flex;
1545
- align-items: center;
1546
- justify-content: center;
1547
- }
1548
1578
 
1549
- .video-js.skin_news_live .vjs-fade>* {
1579
+ .video-js.skin_mini .vjs-fade>* {
1550
1580
  visibility: hidden !important;
1551
1581
  opacity: 0 !important;
1552
1582
  transition: visibility 1s, opacity 1s !important;
1553
1583
  }
1554
1584
 
1555
- .video-js.skin_news_live .custom-spaced-progress-bar {
1585
+ .video-js.skin_mini .custom-spaced-progress-bar {
1556
1586
  position: absolute;
1557
1587
  width: 100%;
1558
1588
  display: flex;
@@ -1560,7 +1590,7 @@
1560
1590
  top: -0.5em;
1561
1591
  }
1562
1592
 
1563
- .video-js.skin_news_live .vjs-progress-control {
1593
+ .video-js.skin_mini .vjs-progress-control {
1564
1594
  /* left: -6px; */
1565
1595
  position: relative;
1566
1596
  width: 100%;
@@ -1568,25 +1598,22 @@
1568
1598
  transition: height 0.1s, top 0.1s;
1569
1599
  }
1570
1600
 
1571
- .video-js.skin_news_live .vjs-volume-panel{
1572
- min-width: 5.3em;
1573
- }
1574
1601
 
1575
1602
 
1576
1603
 
1577
- .video-js.skin_news_live .vjs-custom-control-spacer {
1578
- /* display: block; */
1579
- /* flex: 1 1 auto; */
1604
+ .video-js.skin_mini .vjs-custom-control-spacer {
1605
+ display: block;
1606
+ flex: 1 1 auto;
1580
1607
  }
1581
1608
 
1582
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1609
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1583
1610
  margin: 0 0px 0 0px;
1584
1611
  }
1585
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1612
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1586
1613
  display: none;
1587
1614
  }
1588
1615
 
1589
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1616
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1590
1617
  font-size: 14px;
1591
1618
  font-weight: 500;
1592
1619
  align-self: center;
@@ -1595,199 +1622,207 @@
1595
1622
  border-radius: 8px;
1596
1623
  }
1597
1624
 
1598
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1599
- height: 6px !important;
1625
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1626
+ height: 5px !important;
1600
1627
  }
1601
1628
 
1602
- .video-js.skin_news_live .vjs-play-progress:before {
1603
- font-size: 1.5em;
1629
+ .video-js.skin_mini .vjs-play-progress:before {
1630
+ font-size: 1.3em;
1604
1631
  line-height: unset;
1605
1632
  top: -0.3333333333em;
1606
1633
  }
1607
1634
 
1608
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1635
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1609
1636
  display: none !important;
1610
1637
  }
1611
1638
 
1612
1639
  /* */
1613
- .video-js.skin_news_live .vjs-mouse-display{
1640
+ .video-js.skin_mini .vjs-mouse-display{
1614
1641
  font-size: 1.6666666667em;
1615
1642
  }
1616
1643
 
1617
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1644
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1618
1645
  font-size: 1em !important;
1619
1646
  }
1620
1647
 
1621
- .video-js.skin_news_live .vjs-button{
1622
- width: 5.3em;
1648
+ .video-js.skin_mini .vjs-button{
1649
+ width: 3em;
1623
1650
  display: flex;
1624
1651
  align-items: center;
1625
1652
  justify-content: center;
1626
1653
  }
1627
1654
 
1628
1655
 
1629
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1656
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1630
1657
  .icon-maximize {
1631
1658
  display: block;
1632
1659
  height: 32px;
1633
1660
  }
1634
1661
 
1635
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1662
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1636
1663
  line-height: 4;
1637
1664
  }
1638
1665
 
1639
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1666
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1640
1667
  .icon-minimize {
1641
1668
  display: none;
1642
1669
  height: 32px;
1643
1670
  }
1644
1671
 
1645
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1672
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1646
1673
  outline: none !important;
1647
- /* flex: 1; */
1648
- }
1649
- .video-js.skin_news_live .vjs-play-toggle-container{
1650
- display: flex;
1651
- flex: 1;
1652
- justify-content: center;
1653
1674
  }
1654
-
1655
-
1656
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1675
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1657
1676
  .vjs-icon-fullscreen-enter:before {
1658
1677
  /* content: '' !important; */
1659
1678
  }
1660
1679
 
1661
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1680
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1662
1681
  display: flex;
1663
1682
  justify-content: center;
1664
1683
  align-items: center;
1665
1684
  /* transform: rotate(90deg); */
1666
1685
  }
1667
1686
 
1668
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1687
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1669
1688
  display: none;
1670
1689
  }
1671
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1690
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1672
1691
  margin-left: -10px;
1692
+ display: none;
1673
1693
  }
1674
1694
 
1675
- .video-js.skin_news_live .skipbtn:hover{
1695
+ .video-js.skin_mini .vjs-loading-spinner {
1696
+ position: absolute;
1697
+ top: 50%;
1698
+ left: 50%;
1699
+ transform: translate(-50%, -50%);
1700
+ opacity: .85;
1701
+ text-align: left;
1702
+ border: .2em solid rgba(43, 51, 63, .7);
1703
+ box-sizing: border-box;
1704
+ background-clip: padding-box;
1705
+ width: 3em;
1706
+ height: 3em;
1707
+ border-radius: 50%;
1708
+ visibility: hidden;
1709
+ }
1710
+
1711
+ .video-js.skin_mini .skipbtn:hover{
1676
1712
  cursor: pointer;
1677
1713
  }
1678
1714
 
1679
- .video-js.skin_news_live .rewindbtn:hover{
1715
+ .video-js.skin_mini .rewindbtn:hover{
1680
1716
  cursor: pointer;
1681
1717
  }
1682
1718
 
1683
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1719
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1684
1720
  position: relative;
1685
1721
  padding-left: 0;
1686
1722
  }
1687
1723
 
1688
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1689
- display: none !important;
1724
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1725
+ width: 40px;
1726
+ height: 40px;
1727
+ display: flex;
1728
+ justify-content: center;
1729
+ align-items: center;
1730
+ border: none;
1731
+ position: absolute;
1732
+ top: 0;
1733
+ left: 0;
1734
+ right: 0;
1735
+ bottom: 0;
1736
+ margin: auto;
1737
+ font-size: 3em;
1738
+ line-height: 1.3em;
1739
+ transform: none !important;
1740
+ border-radius: 1.3em;
1690
1741
  }
1691
1742
 
1692
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1693
- /* width: 90px;
1694
- height: 90px;
1695
- display: flex;
1696
- justify-content: center;
1697
- align-items: center;
1698
- border-radius: 50%;
1699
- position: absolute;
1700
- top: 0;
1701
- left: 0;
1702
- right: 0;
1703
- bottom: 0;
1704
- margin: auto;
1705
- font-size: 6em;
1706
- line-height: 1.4em;
1707
- border: 0.05em solid;
1708
- color: inherit; */
1709
- display: none !important;
1710
- }
1711
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1743
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1712
1744
  font-weight: bold;
1713
1745
  }
1714
1746
 
1715
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1716
- bottom: 2.4em !important;
1717
- right: -1em;
1747
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1748
+ bottom: 1.1em !important;
1749
+ right: 1em;
1718
1750
  z-index: 1;
1751
+ font-size: 10px;
1719
1752
  }
1720
1753
 
1721
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1754
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1722
1755
  width: 24px !important;
1723
1756
  height: 24px !important;
1724
1757
  }
1725
- .settings-selector-icon>svg{
1758
+ .video-js.skin_mini .settings-selector-icon>svg{
1726
1759
  height: 19px !important;
1727
1760
  width: 19px !important;
1728
1761
  }
1729
1762
 
1730
1763
 
1731
- .video-js.skin_news_live button.vjs-rewind-button{
1764
+ .video-js.skin_mini button.vjs-rewind-button{
1732
1765
  cursor: pointer;
1733
1766
  }
1734
1767
 
1735
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1768
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1736
1769
  padding-right: 0;
1737
- display: none;
1738
1770
  }
1739
1771
 
1740
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1772
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1741
1773
  padding-left: 0;
1742
- display: none;
1743
1774
  }
1744
1775
 
1745
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1776
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1746
1777
  padding-left: 0;
1747
1778
  padding-right: 0;
1748
- display: none;
1779
+ display: flex;
1780
+ justify-content: center;
1781
+ width: min-content;
1749
1782
  }
1750
1783
 
1751
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1784
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1752
1785
  display: none
1753
1786
  }
1754
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1787
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1755
1788
  display: none
1756
1789
  }
1757
1790
 
1758
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1759
- display: flex;
1760
- align-items: center;
1761
- font-weight: 700;
1762
- font-size: 12px;
1763
- min-width: 1.2em;
1791
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1792
+ display: flex;
1793
+ align-items: center;
1794
+ font-weight: 700;
1795
+ font-size: 9px;
1796
+ min-width: 0.8em;
1797
+ padding-left: 0;
1764
1798
  }
1765
1799
 
1766
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1800
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1767
1801
  display: none;
1768
1802
  font-size: 11px;
1769
1803
  justify-content: center;
1770
1804
  align-items: center;
1771
1805
  user-select: none;
1772
1806
  }
1773
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1807
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1774
1808
  display: none;
1775
1809
  }
1776
1810
 
1777
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1811
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1778
1812
  height: min-content;
1779
1813
  width: min-content;
1780
1814
  }
1781
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1782
- width: 6em;
1815
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1816
+ width: 3em;
1817
+ margin-right: 4px;
1783
1818
  }
1784
1819
 
1785
- .video-js.skin_news_live .content{
1820
+ .video-js.skin_mini .content{
1786
1821
  bottom: 3.4rem !important;
1787
1822
  right: -4rem !important;
1788
1823
  }
1789
1824
 
1790
- .setting-icon > svg{
1825
+ .video-js.skin_mini .setting-icon > svg{
1791
1826
  height:18px !important;
1792
1827
  }
1793
1828
 
@@ -1801,16 +1836,16 @@
1801
1836
  pointer-events:none
1802
1837
  }
1803
1838
 
1804
- .video-js.skin_news_live iframe{
1839
+ .video-js.skin_mini iframe{
1805
1840
  width: 100%;
1806
1841
  height: 100%;
1807
1842
  }
1808
1843
 
1809
- .video-js.skin_news_live .vjs-live-control{
1844
+ .video-js.skin_mini .vjs-live-control{
1810
1845
  align-items: center;
1811
- display: none;
1846
+ max-width: 5em;
1812
1847
  }
1813
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1848
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1814
1849
  height: 2.2em;
1815
1850
  display: flex;
1816
1851
  align-items: center;
@@ -1818,220 +1853,185 @@
1818
1853
  width: 4em;
1819
1854
  justify-content: center;
1820
1855
  background: red;
1821
- margin: 4px 0px 4px 12px;
1856
+ margin: 4px 0px 4px 2px;
1822
1857
  }
1823
1858
 
1824
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1859
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1825
1860
  text-shadow: none;
1826
1861
  }
1827
-
1828
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1829
- display: flex;
1830
- justify-content: center;
1831
- min-width: 5.3em;
1832
- pointer-events: none;
1833
- user-select: none;
1834
- }
1835
-
1836
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1837
- color: white;
1862
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1863
+ display: none;
1864
+ font-size: 12px;
1838
1865
  }
1839
1866
 
1840
-
1841
- .settings-selection.vjs-control.vjs-button{
1842
- display: flex !important;
1867
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1868
+ height: 1.8em;
1869
+ display: inline-flex;
1870
+ align-items: center;
1871
+ font-family: monospace;
1872
+ justify-content: center;
1873
+ border: 1.5px solid;
1874
+ margin: 4px 0px 4px 2px;
1875
+ white-space: pre;
1876
+ padding: 2px 4px;
1877
+ font-size: 1.2em;
1878
+ font-weight: 500;
1879
+ color: rgba(255, 255, 2555, 0.7);
1843
1880
  }
1844
1881
 
1845
- @media(max-width:576px){
1846
- .settings-selection.vjs-control.vjs-button{
1847
- display: none !important;
1848
- }
1882
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1883
+ content: "NOT LIVE";
1884
+ word-spacing: -4px;
1849
1885
  }
1850
1886
 
1851
1887
 
1852
- @media(max-width:576px){
1888
+ @media(max-width:600px){
1853
1889
  .tvProviderImage{
1854
1890
  display: none
1855
1891
  }
1856
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1892
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1857
1893
  .icon-maximize {
1858
1894
  height: 30px !important;
1859
1895
  }
1860
1896
 
1861
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1897
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1862
1898
  .icon-minimize {
1863
1899
  height: 30px !important;
1864
1900
  }
1865
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1866
- width: 4.5em;
1901
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1902
+ width: 3.5em;
1867
1903
  }
1868
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1904
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1869
1905
  height: min-content;
1870
1906
  }
1871
1907
 
1872
- .video-js.skin_news_live button.vjs-slowmo-button{
1908
+ .video-js.skin_mini button.vjs-slowmo-button{
1873
1909
  display: none;
1874
1910
  }
1875
- .video-js.skin_news_live button.vjs-rewind-button{
1911
+ .video-js.skin_mini button.vjs-rewind-button{
1876
1912
  display: none;
1877
1913
  }
1878
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1914
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1879
1915
  height: 20px;
1880
1916
  }
1881
- .video-js.skin_news_live .vjs-button{
1882
- width: 4.8em;
1917
+ .video-js.skin_mini .vjs-button{
1918
+ width: 3em;
1883
1919
  }
1884
- .video-js.skin_news_live .widget-selection{
1920
+ .video-js.skin_mini .widget-selection{
1885
1921
  display: none;
1886
1922
  }
1887
- .video-js.skin_news_live .container{
1923
+ .video-js.skin_mini .container{
1888
1924
  display: none !important;
1889
1925
  }
1890
- .video-js.skin_news_live .vjs-control-bar{
1926
+ .video-js.skin_mini .vjs-control-bar{
1891
1927
  height: 4em !important;
1892
1928
  }
1893
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1929
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1894
1930
  font-size: 2.5em;
1895
1931
  line-height: 1.5;
1896
1932
  }
1897
- .video-js.skin_news_live .vjs-play-progress:before {
1933
+ .video-js.skin_mini .vjs-play-progress:before {
1898
1934
  font-size: 1.2em;
1899
1935
  position: absolute;
1900
1936
  right: -0.5em;
1901
1937
  z-index: 1;
1902
1938
  }
1903
- .video-js.skin_news_live button.vjs-skip-button>svg{
1939
+ .video-js.skin_mini button.vjs-skip-button>svg{
1904
1940
  height: 20px;
1905
1941
  }
1906
- .video-js.skin_news_live button.vjs-big-play-button {
1907
- width: 50px !important;
1908
- height: 50px !important;
1909
- font-size: 2.1rem !important;
1910
- }
1911
1942
 
1912
1943
  .stream-selector-icon>svg{
1913
1944
  width: 24px;
1914
1945
  height: 24px;
1915
1946
  }
1916
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1917
- margin: 0 12px 0 12px;
1918
- }
1919
- .video-js.skin_news_live .vjs-seek-to-live-text{
1947
+ .video-js.skin_mini .vjs-seek-to-live-text{
1920
1948
  font-size: 12px;
1921
1949
  }
1922
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1923
- margin: 0 12px 0 12px;
1950
+
1951
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1952
+ color: white !important;
1953
+ font-size: 16px !important;
1954
+ background-color: rgba(0,0,0,0.2) !important;
1955
+ }
1924
1956
  }
1957
+
1958
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1959
+ color: white !important;
1960
+ font-size: 16px !important;
1961
+ background-color: rgba(0,0,0,0.2) !important;
1925
1962
  }
1926
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1927
- width: 90px;
1928
- height: 90px;
1929
- display: flex;
1930
- justify-content: center;
1931
- align-items: center;
1932
- border-radius: 50%;
1933
- position: absolute;
1934
- top: 0;
1935
- left: 0;
1936
- right: 0;
1937
- bottom: 0;
1938
- margin: auto;
1939
- font-size: 6em;
1940
- line-height: 1.4em;
1963
+
1964
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1965
+ font-size: 18px !important;
1941
1966
  }
1942
1967
 
1943
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1968
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1969
+ margin-bottom: 1rem !important;
1970
+ }
1971
+
1972
+
1973
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1944
1974
  display: flex;
1945
1975
  justify-content: center;
1946
1976
  align-items: center;
1947
1977
  height: 100%;
1948
1978
  transition: width 0.1s;
1949
1979
  }
1980
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1981
+ margin: 2px;
1982
+ }
1950
1983
 
1951
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1984
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1952
1985
  display: flex;
1953
1986
  justify-content: center;
1954
1987
  align-items: center;
1955
1988
  height: 100%;
1956
1989
  transition: width 0.1s;
1957
1990
  }
1958
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1959
- display: none !important;
1991
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1992
+ display: grid;
1993
+ font-size: 10px;
1994
+ grid-template-columns: 1fr;
1995
+ grid-template-rows: 1fr;
1996
+ padding: 1px 0px 0 0px;
1997
+ margin: 0;
1960
1998
  }
1961
1999
 
1962
- @media (max-width: 576px) {
1963
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
2000
+ @media (max-width: 600px) {
2001
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1964
2002
  height: 5px !important;
1965
2003
  }
1966
- .video-js.skin_news_live button.vjs-big-play-button {
1967
- width: 50px !important;
1968
- height: 50px !important;
1969
- font-size: 2.1rem !important;
1970
- }
1971
2004
 
1972
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2005
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1973
2006
  display: none;
1974
2007
  }
1975
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1976
- bottom: 2.4em !important;
1977
- right: -1em;
1978
- z-index: 1;
1979
- }
1980
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1981
- display: none !important;
1982
- }
1983
-
1984
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1985
- color: white !important;
1986
- font-size: 13px !important;
1987
- background-color: black !important;
1988
- }
1989
- }
1990
-
1991
- .video-js.skin_news_live .vjs-text-track-display-ttml {
1992
- width: 100% !important;
1993
- }
1994
-
1995
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1996
- color: white !important;
1997
- font-size: 16px !important;
1998
- background-color: black !important;
1999
- }
2000
2008
 
2001
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
2002
- margin-bottom: 2rem !important;
2003
2009
  }
2004
2010
 
2005
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
2006
- font-size: 18px !important;
2011
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2012
+ content: none !important;
2013
+ fill: none !important;
2014
+ filter: none !important;
2007
2015
  }
2008
2016
 
2009
-
2010
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
2011
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
2012
- font-size: 1.2em !important;
2013
- line-height: 1.5em !important;
2014
- padding: 0.2em 0.8em !important;
2017
+ /* svg icons opacity and hover effect */
2018
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2019
+ opacity: 0.7 !important;
2015
2020
  }
2016
2021
 
2017
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
2018
- content: none !important;
2019
- fill: none !important;
2020
- filter: none !important;
2022
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2023
+ opacity: 1 !important;
2021
2024
  }
2022
2025
 
2023
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2026
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2024
2027
  color: rgba(255, 255, 2555, 0.7)!important;
2025
2028
  }
2026
2029
 
2027
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2030
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2028
2031
  color: rgba(255, 255, 2555, 1)!important;
2029
2032
  }
2030
2033
 
2031
2034
 
2032
-
2033
-
2034
-
2035
2035
  /* CSS for videojs-dvr-seekbar */
2036
2036
 
2037
2037
  .video-js.vjs-dvr-seekbar {
@@ -2213,6 +2213,8 @@
2213
2213
 
2214
2214
 
2215
2215
 
2216
+
2217
+
2216
2218
  .video-js .multicamera-parent.default{
2217
2219
  height: 345px;
2218
2220
  position: absolute;
@@ -2293,7 +2295,6 @@
2293
2295
 
2294
2296
 
2295
2297
 
2296
-
2297
2298
  .vjs-custom-big-mute.vjs-control{
2298
2299
  position: absolute;
2299
2300
  align-items: center;
@@ -2342,7 +2343,6 @@
2342
2343
  width: 22px;
2343
2344
  }
2344
2345
 
2345
-
2346
2346
  /* nextep — up-next card (centered in player, scales with player size) */
2347
2347
  .video-js:has(.next-ep-preview),
2348
2348
  .video-js:has(.next-ep-preview-player-thumb) {
@@ -3395,27 +3395,6 @@
3395
3395
  }
3396
3396
 
3397
3397
  /* Airplay end */
3398
-
3399
- div:has(> .error-container){
3400
- position: relative;
3401
- }
3402
-
3403
- .error-container{
3404
- position: absolute;
3405
- top: 0px;
3406
- width: 100%;
3407
- height: 100%;
3408
- display: flex;
3409
- flex-direction: column;
3410
- justify-content: center;
3411
- color: White;
3412
- align-items: center;
3413
- text-transform: uppercase;
3414
- }
3415
-
3416
- .error-timer-message{
3417
- margin-left: 5px;
3418
- }
3419
3398
  /* Chapter markers on the seek bar.
3420
3399
  * Uses a dedicated class (NOT .vjs-seekbar-marker) so chapter markers and SSAI
3421
3400
  * ad markers coexist without clobbering each other's clear-and-rerender. */
@@ -3425,7 +3404,8 @@ div:has(> .error-container){
3425
3404
  bottom: 0;
3426
3405
  top: 0;
3427
3406
  width: 2px;
3428
- background-color: red;
3407
+ background-color: var(--vl-chapter-color, #fff);
3408
+ opacity: var(--vl-chapter-opacity, 1);
3429
3409
  transform: translateX(-50%);
3430
3410
  pointer-events: auto; /* clickable (ad markers use none) */
3431
3411
  cursor: pointer;
@@ -3435,7 +3415,12 @@ div:has(> .error-container){
3435
3415
  justify-content: center;
3436
3416
  }
3437
3417
 
3418
+ .vjs-chapter-marker:hover {
3419
+ background-color: var(--vl-chapter-hover, #ccc);
3420
+ }
3421
+
3438
3422
  .vjs-chapter-marker.vjs-chapter-marker--active {
3423
+ background-color: var(--vl-chapter-active, #0a5cff);
3439
3424
  z-index: 3;
3440
3425
  }
3441
3426
 
@@ -3465,7 +3450,7 @@ div:has(> .error-container){
3465
3450
  bottom: 100%;
3466
3451
  margin-bottom: 12px;
3467
3452
  transform: translateX(-50%);
3468
- background: rgba(0, 0, 0, 0.85);
3453
+ background: var(--vl-chapter-tooltip, rgba(0, 0, 0, 0.85));
3469
3454
  color: #fff;
3470
3455
  border-radius: 4px;
3471
3456
  padding: 6px 8px;
@@ -3503,7 +3488,7 @@ div:has(> .error-container){
3503
3488
  height: 0;
3504
3489
  border-left: 6px solid transparent;
3505
3490
  border-right: 6px solid transparent;
3506
- border-top: 6px solid #000;
3491
+ border-top: 6px solid var(--vl-chapter-tooltip, #000);
3507
3492
  }
3508
3493
 
3509
3494
  /* Time line (negative-from-live for DVR, plain timestamp for VOD) above the label.
@@ -3513,3 +3498,25 @@ div:has(> .error-container){
3513
3498
  text-align: left;
3514
3499
  margin-bottom: 4px;
3515
3500
  }
3501
+
3502
+
3503
+ div:has(> .error-container){
3504
+ position: relative;
3505
+ }
3506
+
3507
+ .error-container{
3508
+ position: absolute;
3509
+ top: 0px;
3510
+ width: 100%;
3511
+ height: 100%;
3512
+ display: flex;
3513
+ flex-direction: column;
3514
+ justify-content: center;
3515
+ color: White;
3516
+ align-items: center;
3517
+ text-transform: uppercase;
3518
+ }
3519
+
3520
+ .error-timer-message{
3521
+ margin-left: 5px;
3522
+ }