@viewlift/player-backup 2.0.325-backup → 2.0.326-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 (58) hide show
  1. package/cjs/{autoNextVideo-c5dd7b63.js → autoNextVideo-48c26383.js} +1 -1
  2. package/cjs/bundle.css +919 -919
  3. package/cjs/{features-0d81abc6.js → features-cbd133eb.js} +1 -1
  4. package/cjs/generic-3f85a6cc.js +1 -0
  5. package/cjs/{index-97959524.js → index-467c2357.js} +1 -1
  6. package/cjs/{index-8031c915.js → index-51f2472f.js} +1 -1
  7. package/cjs/{index-d62537f9.js → index-8c1ab404.js} +1 -1
  8. package/cjs/index.js +1 -1
  9. package/cjs/{multicamv2-2e168744.js → multicamv2-40b13aa4.js} +1 -1
  10. package/cjs/{multicamv2-1f7c21ce.js → multicamv2-44233377.js} +1 -1
  11. package/cjs/{nextEpisodeButton-8b080d5c.js → nextEpisodeButton-41a72963.js} +1 -1
  12. package/cjs/{playlist-39827f19.js → playlist-9e61bd0f.js} +1 -1
  13. package/cjs/{series-82e12e45.js → series-f4c17edf.js} +1 -1
  14. package/cjs/{series-v2-08088a22.js → series-v2-7dbdae1c.js} +1 -1
  15. package/cjs/{series-v2-d145e5d8.js → series-v2-ca04e855.js} +1 -1
  16. package/cjs/{skin-7079f895.js → skin-2a7a160e.js} +1 -1
  17. package/cjs/{skin-9eb790a9.js → skin-3470def8.js} +1 -1
  18. package/cjs/{skin-534deae0.js → skin-3b10552d.js} +1 -1
  19. package/cjs/{skin-07c2376e.js → skin-50386db4.js} +1 -1
  20. package/cjs/{skin-8a4d439d.js → skin-7be2d84c.js} +1 -1
  21. package/cjs/{skin-9c1b7493.js → skin-80cd46ec.js} +1 -1
  22. package/cjs/{skin-8ae0e53b.js → skin-8b98acc1.js} +1 -1
  23. package/cjs/{skin-c1eaea7b.js → skin-9904eef7.js} +1 -1
  24. package/cjs/{skin-6e1d2ea4.js → skin-e3a75bd5.js} +1 -1
  25. package/cjs/{skin-bb5825e5.js → skin-f392b7a2.js} +1 -1
  26. package/cjs/{videoSelector-1d3cfb5a.js → videoSelector-a13b5d80.js} +1 -1
  27. package/cjs/{videoSelector-f2550ea3.js → videoSelector-f018ca53.js} +1 -1
  28. package/esm/{autoNextVideo-5bb86272.js → autoNextVideo-8dd79ed6.js} +1 -1
  29. package/esm/bundle.css +919 -919
  30. package/esm/{features-d9bac531.js → features-a5a2e72f.js} +1 -1
  31. package/esm/generic-e783464c.js +1 -0
  32. package/esm/{index-f6dc7e2a.js → index-4a95669c.js} +1 -1
  33. package/esm/{index-737f2a9f.js → index-7db11ad8.js} +1 -1
  34. package/esm/{index-61262432.js → index-8a99e78b.js} +1 -1
  35. package/esm/index.js +1 -1
  36. package/esm/{multicamv2-fa0769b4.js → multicamv2-3f17bc42.js} +1 -1
  37. package/esm/{multicamv2-e21023f6.js → multicamv2-9a57666e.js} +1 -1
  38. package/esm/{nextEpisodeButton-a8cda463.js → nextEpisodeButton-b2b192a3.js} +1 -1
  39. package/esm/{playlist-2e5e2a51.js → playlist-9c446200.js} +1 -1
  40. package/esm/{series-2977422b.js → series-22d976f7.js} +1 -1
  41. package/esm/{series-v2-936a0134.js → series-v2-4a1c0d17.js} +1 -1
  42. package/esm/{series-v2-27b60661.js → series-v2-ac9023d0.js} +1 -1
  43. package/esm/{skin-e2bb1195.js → skin-0bcbb568.js} +1 -1
  44. package/esm/{skin-6dea6437.js → skin-136b3f83.js} +1 -1
  45. package/esm/{skin-02776869.js → skin-2f722d43.js} +1 -1
  46. package/esm/{skin-0129f8f3.js → skin-57acc225.js} +1 -1
  47. package/esm/{skin-710b0363.js → skin-5c4b3103.js} +1 -1
  48. package/esm/{skin-196bcadd.js → skin-811df927.js} +1 -1
  49. package/esm/{skin-e755071a.js → skin-879cf303.js} +1 -1
  50. package/esm/{skin-5a2bbfd2.js → skin-d4cbe790.js} +1 -1
  51. package/esm/{skin-9582414f.js → skin-f40400a4.js} +1 -1
  52. package/esm/{skin-8420eb31.js → skin-f4439340.js} +1 -1
  53. package/esm/utilities/beacon.d.ts +1 -0
  54. package/esm/{videoSelector-8dcd8e64.js → videoSelector-66433721.js} +1 -1
  55. package/esm/{videoSelector-c52dea5d.js → videoSelector-bdf6f403.js} +1 -1
  56. package/package.json +1 -1
  57. package/cjs/generic-2f477bae.js +0 -1
  58. package/esm/generic-f0a863fe.js +0 -1
package/esm/bundle.css CHANGED
@@ -1,8 +1,5 @@
1
1
 
2
2
 
3
-
4
-
5
-
6
3
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
7
4
  height: 0.7em;
8
5
  position: absolute;
@@ -203,31 +200,34 @@
203
200
  }
204
201
 
205
202
 
206
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
203
+
204
+
205
+
206
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
207
207
  font-size: 2.2em;
208
208
  line-height: 2.6;
209
209
  }
210
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
211
- background: #fcb700;
210
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
211
+ background: white;
212
212
  }
213
- .video-js.skin_news_live .vjs-control-bar{
213
+ .video-js.skin_news .vjs-control-bar{
214
214
  z-index: 1 !important;
215
215
  height: 5em !important;
216
216
  background: black !important;
217
217
  }
218
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
218
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
219
219
  display: flex;
220
220
  align-items: center;
221
221
  justify-content: center;
222
222
  }
223
223
 
224
- .video-js.skin_news_live .vjs-fade>* {
224
+ .video-js.skin_news .vjs-fade>* {
225
225
  visibility: hidden !important;
226
226
  opacity: 0 !important;
227
227
  transition: visibility 1s, opacity 1s !important;
228
228
  }
229
229
 
230
- .video-js.skin_news_live .custom-spaced-progress-bar {
230
+ .video-js.skin_news .custom-spaced-progress-bar {
231
231
  position: absolute;
232
232
  width: 100%;
233
233
  display: flex;
@@ -235,7 +235,7 @@
235
235
  top: -0.5em;
236
236
  }
237
237
 
238
- .video-js.skin_news_live .vjs-progress-control {
238
+ .video-js.skin_news .vjs-progress-control {
239
239
  /* left: -6px; */
240
240
  position: relative;
241
241
  width: 100%;
@@ -243,25 +243,22 @@
243
243
  transition: height 0.1s, top 0.1s;
244
244
  }
245
245
 
246
- .video-js.skin_news_live .vjs-volume-panel{
247
- min-width: 5.3em;
248
- }
249
246
 
250
247
 
251
248
 
252
- .video-js.skin_news_live .vjs-custom-control-spacer {
253
- /* display: block; */
254
- /* flex: 1 1 auto; */
249
+ .video-js.skin_news .vjs-custom-control-spacer {
250
+ display: block;
251
+ flex: 1 1 auto;
255
252
  }
256
253
 
257
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
254
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
258
255
  margin: 0 0px 0 0px;
259
256
  }
260
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
257
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
261
258
  display: none;
262
259
  }
263
260
 
264
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
261
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
265
262
  font-size: 14px;
266
263
  font-weight: 500;
267
264
  align-self: center;
@@ -270,30 +267,30 @@
270
267
  border-radius: 8px;
271
268
  }
272
269
 
273
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
270
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
274
271
  height: 6px !important;
275
272
  }
276
273
 
277
- .video-js.skin_news_live .vjs-play-progress:before {
274
+ .video-js.skin_news .vjs-play-progress:before {
278
275
  font-size: 1.5em;
279
276
  line-height: unset;
280
277
  top: -0.3333333333em;
281
278
  }
282
279
 
283
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
280
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
284
281
  display: none !important;
285
282
  }
286
283
 
287
284
  /* */
288
- .video-js.skin_news_live .vjs-mouse-display{
285
+ .video-js.skin_news .vjs-mouse-display{
289
286
  font-size: 1.6666666667em;
290
287
  }
291
288
 
292
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
289
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
293
290
  font-size: 1em !important;
294
291
  }
295
292
 
296
- .video-js.skin_news_live .vjs-button{
293
+ .video-js.skin_news .vjs-button{
297
294
  width: 5.3em;
298
295
  display: flex;
299
296
  align-items: center;
@@ -301,71 +298,63 @@
301
298
  }
302
299
 
303
300
 
304
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
301
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
305
302
  .icon-maximize {
306
303
  display: block;
307
304
  height: 32px;
308
305
  }
309
306
 
310
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
307
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
311
308
  line-height: 4;
312
309
  }
313
310
 
314
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
311
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
315
312
  .icon-minimize {
316
313
  display: none;
317
314
  height: 32px;
318
315
  }
319
316
 
320
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
317
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
321
318
  outline: none !important;
322
- /* flex: 1; */
323
- }
324
- .video-js.skin_news_live .vjs-play-toggle-container{
325
- display: flex;
326
- flex: 1;
327
- justify-content: center;
328
319
  }
329
-
330
-
331
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
320
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
332
321
  .vjs-icon-fullscreen-enter:before {
333
322
  /* content: '' !important; */
334
323
  }
335
324
 
336
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
325
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
337
326
  display: flex;
338
327
  justify-content: center;
339
328
  align-items: center;
340
329
  /* transform: rotate(90deg); */
341
330
  }
342
331
 
343
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
332
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
344
333
  display: none;
345
334
  }
346
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
335
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
347
336
  margin-left: -10px;
348
337
  }
349
338
 
350
- .video-js.skin_news_live .skipbtn:hover{
339
+ .video-js.skin_news .skipbtn:hover{
351
340
  cursor: pointer;
352
341
  }
353
342
 
354
- .video-js.skin_news_live .rewindbtn:hover{
343
+ .video-js.skin_news .rewindbtn:hover{
355
344
  cursor: pointer;
356
345
  }
357
346
 
358
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
347
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
359
348
  position: relative;
360
349
  padding-left: 0;
361
350
  }
362
351
 
363
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
352
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
364
353
  display: none !important;
365
354
  }
366
355
 
367
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
368
- /* width: 90px;
356
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
357
+ width: 90px;
369
358
  height: 90px;
370
359
  display: flex;
371
360
  justify-content: center;
@@ -380,20 +369,19 @@
380
369
  font-size: 6em;
381
370
  line-height: 1.4em;
382
371
  border: 0.05em solid;
383
- color: inherit; */
384
- display: none !important;
372
+ color: inherit;
385
373
  }
386
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
374
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
387
375
  font-weight: bold;
388
376
  }
389
377
 
390
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
378
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
391
379
  bottom: 2.4em !important;
392
380
  right: -1em;
393
381
  z-index: 1;
394
382
  }
395
383
 
396
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
384
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
397
385
  width: 24px !important;
398
386
  height: 24px !important;
399
387
  }
@@ -403,34 +391,34 @@
403
391
  }
404
392
 
405
393
 
406
- .video-js.skin_news_live button.vjs-rewind-button{
394
+ .video-js.skin_news button.vjs-rewind-button{
407
395
  cursor: pointer;
408
396
  }
409
397
 
410
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
398
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
411
399
  padding-right: 0;
412
- display: none;
413
400
  }
414
401
 
415
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
402
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
416
403
  padding-left: 0;
417
- display: none;
418
404
  }
419
405
 
420
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
406
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
421
407
  padding-left: 0;
422
408
  padding-right: 0;
423
- display: none;
409
+ display: flex;
410
+ justify-content: center;
411
+ width: min-content;
424
412
  }
425
413
 
426
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
414
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
427
415
  display: none
428
416
  }
429
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
417
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
430
418
  display: none
431
419
  }
432
420
 
433
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
421
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
434
422
  display: flex;
435
423
  align-items: center;
436
424
  font-weight: 700;
@@ -438,26 +426,26 @@
438
426
  min-width: 1.2em;
439
427
  }
440
428
 
441
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
429
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
442
430
  display: none;
443
431
  font-size: 11px;
444
432
  justify-content: center;
445
433
  align-items: center;
446
434
  user-select: none;
447
435
  }
448
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
436
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
449
437
  display: none;
450
438
  }
451
439
 
452
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
440
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
453
441
  height: min-content;
454
442
  width: min-content;
455
443
  }
456
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
444
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
457
445
  width: 6em;
458
446
  }
459
447
 
460
- .video-js.skin_news_live .content{
448
+ .video-js.skin_news .content{
461
449
  bottom: 3.4rem !important;
462
450
  right: -4rem !important;
463
451
  }
@@ -476,16 +464,15 @@
476
464
  pointer-events:none
477
465
  }
478
466
 
479
- .video-js.skin_news_live iframe{
467
+ .video-js.skin_news iframe{
480
468
  width: 100%;
481
469
  height: 100%;
482
470
  }
483
471
 
484
- .video-js.skin_news_live .vjs-live-control{
472
+ .video-js.skin_news .vjs-live-control{
485
473
  align-items: center;
486
- display: none;
487
474
  }
488
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
475
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
489
476
  height: 2.2em;
490
477
  display: flex;
491
478
  align-items: center;
@@ -496,22 +483,43 @@
496
483
  margin: 4px 0px 4px 12px;
497
484
  }
498
485
 
499
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
486
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
500
487
  text-shadow: none;
501
488
  }
489
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
490
+ display: none;
491
+ font-size: 12px;
492
+ }
502
493
 
503
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
504
- display: flex;
494
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
495
+ height: 2.2em;
496
+ display: inline-flex;
497
+ align-items: center;
498
+ /* font-family: monospace; */
505
499
  justify-content: center;
506
- min-width: 5.3em;
507
- pointer-events: none;
508
- user-select: none;
500
+ border: 2px solid;
501
+ margin: 4px 0px 4px 6px;
502
+ white-space: pre;
503
+ padding: 0px 6px;
504
+ font-size: 1.2em;
505
+ font-weight: 500;
506
+ color: rgba(255, 255, 2555, 0.7);
507
+
508
+ letter-spacing: -.1px;
509
+ line-height: normal;
510
+ text-transform: uppercase;
511
+ color: #FFFFFF;
512
+ opacity: .7;
513
+ font-family: "Proxima Nova";
509
514
  }
510
515
 
511
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
512
- color: white;
516
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
517
+ opacity: 1;
513
518
  }
514
519
 
520
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
521
+ content: "NOT LIVE";
522
+ }
515
523
 
516
524
  .settings-selection.vjs-control.vjs-button{
517
525
  display: flex !important;
@@ -528,57 +536,57 @@
528
536
  .tvProviderImage{
529
537
  display: none
530
538
  }
531
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
539
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
532
540
  .icon-maximize {
533
541
  height: 30px !important;
534
542
  }
535
543
 
536
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
544
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
537
545
  .icon-minimize {
538
546
  height: 30px !important;
539
547
  }
540
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
548
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
541
549
  width: 4.5em;
542
550
  }
543
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
551
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
544
552
  height: min-content;
545
553
  }
546
554
 
547
- .video-js.skin_news_live button.vjs-slowmo-button{
555
+ .video-js.skin_news button.vjs-slowmo-button{
548
556
  display: none;
549
557
  }
550
- .video-js.skin_news_live button.vjs-rewind-button{
558
+ .video-js.skin_news button.vjs-rewind-button{
551
559
  display: none;
552
560
  }
553
- .video-js.skin_news_live button.vjs-rewind-button>svg{
561
+ .video-js.skin_news button.vjs-rewind-button>svg{
554
562
  height: 20px;
555
563
  }
556
- .video-js.skin_news_live .vjs-button{
564
+ .video-js.skin_news .vjs-button{
557
565
  width: 4.8em;
558
566
  }
559
- .video-js.skin_news_live .widget-selection{
567
+ .video-js.skin_news .widget-selection{
560
568
  display: none;
561
569
  }
562
- .video-js.skin_news_live .container{
570
+ .video-js.skin_news .container{
563
571
  display: none !important;
564
572
  }
565
- .video-js.skin_news_live .vjs-control-bar{
573
+ .video-js.skin_news .vjs-control-bar{
566
574
  height: 4em !important;
567
575
  }
568
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
576
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
569
577
  font-size: 2.5em;
570
578
  line-height: 1.5;
571
579
  }
572
- .video-js.skin_news_live .vjs-play-progress:before {
580
+ .video-js.skin_news .vjs-play-progress:before {
573
581
  font-size: 1.2em;
574
582
  position: absolute;
575
583
  right: -0.5em;
576
584
  z-index: 1;
577
585
  }
578
- .video-js.skin_news_live button.vjs-skip-button>svg{
586
+ .video-js.skin_news button.vjs-skip-button>svg{
579
587
  height: 20px;
580
588
  }
581
- .video-js.skin_news_live button.vjs-big-play-button {
589
+ .video-js.skin_news button.vjs-big-play-button {
582
590
  width: 50px !important;
583
591
  height: 50px !important;
584
592
  font-size: 2.1rem !important;
@@ -588,17 +596,17 @@
588
596
  width: 24px;
589
597
  height: 24px;
590
598
  }
591
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
599
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
592
600
  margin: 0 12px 0 12px;
593
601
  }
594
- .video-js.skin_news_live .vjs-seek-to-live-text{
602
+ .video-js.skin_news .vjs-seek-to-live-text{
595
603
  font-size: 12px;
596
604
  }
597
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
605
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
598
606
  margin: 0 12px 0 12px;
599
607
  }
600
608
  }
601
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
609
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
602
610
  width: 90px;
603
611
  height: 90px;
604
612
  display: flex;
@@ -615,7 +623,7 @@
615
623
  line-height: 1.4em;
616
624
  }
617
625
 
618
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
626
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
619
627
  display: flex;
620
628
  justify-content: center;
621
629
  align-items: center;
@@ -623,22 +631,29 @@
623
631
  transition: width 0.1s;
624
632
  }
625
633
 
626
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
634
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
627
635
  display: flex;
628
636
  justify-content: center;
629
637
  align-items: center;
630
638
  height: 100%;
631
639
  transition: width 0.1s;
632
640
  }
633
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
641
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
634
642
  display: none !important;
635
643
  }
644
+ .video-js.skin_news .ssai-ad-container{
645
+ position: absolute;
646
+ bottom: 14px;
647
+ }
636
648
 
637
649
  @media (max-width: 576px) {
638
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
650
+ .video-js.skin_news .ssai-ad-container{
651
+ bottom: 2px;
652
+ }
653
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
639
654
  height: 5px !important;
640
655
  }
641
- .video-js.skin_news_live button.vjs-big-play-button {
656
+ .video-js.skin_news button.vjs-big-play-button {
642
657
  width: 50px !important;
643
658
  height: 50px !important;
644
659
  font-size: 2.1rem !important;
@@ -647,89 +662,100 @@
647
662
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
648
663
  display: none;
649
664
  }
650
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
665
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
651
666
  bottom: 2.4em !important;
652
667
  right: -1em;
653
668
  z-index: 1;
654
669
  }
655
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
670
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
656
671
  display: none !important;
657
672
  }
658
673
 
659
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
660
- color: white !important;
661
- font-size: 13px !important;
662
- background-color: black !important;
674
+ .video-js.skin_news .vjs-text-track-display-ttml span {
675
+ color: white;
676
+ font-size: 13px;
677
+ background-color: black;
663
678
  }
664
679
  }
665
680
 
666
- .video-js.skin_news_live .vjs-text-track-display-ttml {
667
- width: 100% !important;
668
- }
669
-
670
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
671
- color: white !important;
672
- font-size: 16px !important;
673
- background-color: black !important;
681
+ .video-js.skin_news .vjs-text-track-display-ttml span {
682
+ color: white;
683
+ font-size: 16px;
684
+ background-color: black;
674
685
  }
675
686
 
676
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
687
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
677
688
  margin-bottom: 2rem !important;
678
689
  }
679
690
 
680
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
691
+ .video-js.skin_news .vjs-text-track-display-ttml p {
681
692
  font-size: 18px !important;
682
693
  }
683
694
 
684
695
 
685
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
686
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
696
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
697
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
687
698
  font-size: 1.2em !important;
688
699
  line-height: 1.5em !important;
689
700
  padding: 0.2em 0.8em !important;
690
701
  }
691
702
 
692
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
703
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
693
704
  content: none !important;
694
705
  fill: none !important;
695
706
  filter: none !important;
696
707
  }
697
708
 
698
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
709
+ /* svg icons opacity and hover effect */
710
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
711
+ opacity: 0.7 !important;
712
+ }
713
+
714
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
715
+ opacity: 1 !important;
716
+ }
717
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
718
+ opacity: 0.7 !important;
719
+ }
720
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
721
+ opacity: 1 !important;
722
+ }
723
+
724
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
699
725
  color: rgba(255, 255, 2555, 0.7)!important;
700
726
  }
701
727
 
702
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
728
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
703
729
  color: rgba(255, 255, 2555, 1)!important;
704
730
  }
705
731
 
706
732
 
707
733
 
708
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
734
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
709
735
  font-size: 2.2em;
710
736
  line-height: 2.6;
711
737
  }
712
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
713
- background: white;
738
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
739
+ background: #fcb700;
714
740
  }
715
- .video-js.skin_news .vjs-control-bar{
741
+ .video-js.skin_news_live .vjs-control-bar{
716
742
  z-index: 1 !important;
717
743
  height: 5em !important;
718
744
  background: black !important;
719
745
  }
720
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
746
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
721
747
  display: flex;
722
748
  align-items: center;
723
749
  justify-content: center;
724
750
  }
725
751
 
726
- .video-js.skin_news .vjs-fade>* {
752
+ .video-js.skin_news_live .vjs-fade>* {
727
753
  visibility: hidden !important;
728
754
  opacity: 0 !important;
729
755
  transition: visibility 1s, opacity 1s !important;
730
756
  }
731
757
 
732
- .video-js.skin_news .custom-spaced-progress-bar {
758
+ .video-js.skin_news_live .custom-spaced-progress-bar {
733
759
  position: absolute;
734
760
  width: 100%;
735
761
  display: flex;
@@ -737,7 +763,7 @@
737
763
  top: -0.5em;
738
764
  }
739
765
 
740
- .video-js.skin_news .vjs-progress-control {
766
+ .video-js.skin_news_live .vjs-progress-control {
741
767
  /* left: -6px; */
742
768
  position: relative;
743
769
  width: 100%;
@@ -745,22 +771,25 @@
745
771
  transition: height 0.1s, top 0.1s;
746
772
  }
747
773
 
774
+ .video-js.skin_news_live .vjs-volume-panel{
775
+ min-width: 5.3em;
776
+ }
748
777
 
749
778
 
750
779
 
751
- .video-js.skin_news .vjs-custom-control-spacer {
752
- display: block;
753
- flex: 1 1 auto;
780
+ .video-js.skin_news_live .vjs-custom-control-spacer {
781
+ /* display: block; */
782
+ /* flex: 1 1 auto; */
754
783
  }
755
784
 
756
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
785
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
757
786
  margin: 0 0px 0 0px;
758
787
  }
759
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
788
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
760
789
  display: none;
761
790
  }
762
791
 
763
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
792
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
764
793
  font-size: 14px;
765
794
  font-weight: 500;
766
795
  align-self: center;
@@ -769,30 +798,30 @@
769
798
  border-radius: 8px;
770
799
  }
771
800
 
772
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
801
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
773
802
  height: 6px !important;
774
803
  }
775
804
 
776
- .video-js.skin_news .vjs-play-progress:before {
805
+ .video-js.skin_news_live .vjs-play-progress:before {
777
806
  font-size: 1.5em;
778
807
  line-height: unset;
779
808
  top: -0.3333333333em;
780
809
  }
781
810
 
782
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
811
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
783
812
  display: none !important;
784
813
  }
785
814
 
786
815
  /* */
787
- .video-js.skin_news .vjs-mouse-display{
816
+ .video-js.skin_news_live .vjs-mouse-display{
788
817
  font-size: 1.6666666667em;
789
818
  }
790
819
 
791
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
820
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
792
821
  font-size: 1em !important;
793
822
  }
794
823
 
795
- .video-js.skin_news .vjs-button{
824
+ .video-js.skin_news_live .vjs-button{
796
825
  width: 5.3em;
797
826
  display: flex;
798
827
  align-items: center;
@@ -800,63 +829,71 @@
800
829
  }
801
830
 
802
831
 
803
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
832
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
804
833
  .icon-maximize {
805
834
  display: block;
806
835
  height: 32px;
807
836
  }
808
837
 
809
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
838
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
810
839
  line-height: 4;
811
840
  }
812
841
 
813
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
842
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
814
843
  .icon-minimize {
815
844
  display: none;
816
845
  height: 32px;
817
846
  }
818
847
 
819
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
848
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
820
849
  outline: none !important;
850
+ /* flex: 1; */
821
851
  }
822
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
852
+ .video-js.skin_news_live .vjs-play-toggle-container{
853
+ display: flex;
854
+ flex: 1;
855
+ justify-content: center;
856
+ }
857
+
858
+
859
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
823
860
  .vjs-icon-fullscreen-enter:before {
824
861
  /* content: '' !important; */
825
862
  }
826
863
 
827
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
864
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
828
865
  display: flex;
829
866
  justify-content: center;
830
867
  align-items: center;
831
868
  /* transform: rotate(90deg); */
832
869
  }
833
870
 
834
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
871
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
835
872
  display: none;
836
873
  }
837
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
874
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
838
875
  margin-left: -10px;
839
876
  }
840
877
 
841
- .video-js.skin_news .skipbtn:hover{
878
+ .video-js.skin_news_live .skipbtn:hover{
842
879
  cursor: pointer;
843
880
  }
844
881
 
845
- .video-js.skin_news .rewindbtn:hover{
882
+ .video-js.skin_news_live .rewindbtn:hover{
846
883
  cursor: pointer;
847
884
  }
848
885
 
849
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
886
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
850
887
  position: relative;
851
888
  padding-left: 0;
852
889
  }
853
890
 
854
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
891
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
855
892
  display: none !important;
856
893
  }
857
894
 
858
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
859
- width: 90px;
895
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
896
+ /* width: 90px;
860
897
  height: 90px;
861
898
  display: flex;
862
899
  justify-content: center;
@@ -871,19 +908,20 @@
871
908
  font-size: 6em;
872
909
  line-height: 1.4em;
873
910
  border: 0.05em solid;
874
- color: inherit;
911
+ color: inherit; */
912
+ display: none !important;
875
913
  }
876
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
914
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
877
915
  font-weight: bold;
878
916
  }
879
917
 
880
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
918
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
881
919
  bottom: 2.4em !important;
882
920
  right: -1em;
883
921
  z-index: 1;
884
922
  }
885
923
 
886
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
924
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
887
925
  width: 24px !important;
888
926
  height: 24px !important;
889
927
  }
@@ -893,34 +931,34 @@
893
931
  }
894
932
 
895
933
 
896
- .video-js.skin_news button.vjs-rewind-button{
934
+ .video-js.skin_news_live button.vjs-rewind-button{
897
935
  cursor: pointer;
898
936
  }
899
937
 
900
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
938
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
901
939
  padding-right: 0;
940
+ display: none;
902
941
  }
903
942
 
904
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
943
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
905
944
  padding-left: 0;
945
+ display: none;
906
946
  }
907
947
 
908
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
948
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
909
949
  padding-left: 0;
910
950
  padding-right: 0;
911
- display: flex;
912
- justify-content: center;
913
- width: min-content;
951
+ display: none;
914
952
  }
915
953
 
916
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
954
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
917
955
  display: none
918
956
  }
919
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
957
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
920
958
  display: none
921
959
  }
922
960
 
923
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
961
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
924
962
  display: flex;
925
963
  align-items: center;
926
964
  font-weight: 700;
@@ -928,26 +966,26 @@
928
966
  min-width: 1.2em;
929
967
  }
930
968
 
931
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
969
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
932
970
  display: none;
933
971
  font-size: 11px;
934
972
  justify-content: center;
935
973
  align-items: center;
936
974
  user-select: none;
937
975
  }
938
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
976
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
939
977
  display: none;
940
978
  }
941
979
 
942
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
980
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
943
981
  height: min-content;
944
982
  width: min-content;
945
983
  }
946
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
984
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
947
985
  width: 6em;
948
986
  }
949
987
 
950
- .video-js.skin_news .content{
988
+ .video-js.skin_news_live .content{
951
989
  bottom: 3.4rem !important;
952
990
  right: -4rem !important;
953
991
  }
@@ -966,15 +1004,16 @@
966
1004
  pointer-events:none
967
1005
  }
968
1006
 
969
- .video-js.skin_news iframe{
1007
+ .video-js.skin_news_live iframe{
970
1008
  width: 100%;
971
1009
  height: 100%;
972
1010
  }
973
1011
 
974
- .video-js.skin_news .vjs-live-control{
1012
+ .video-js.skin_news_live .vjs-live-control{
975
1013
  align-items: center;
1014
+ display: none;
976
1015
  }
977
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1016
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
978
1017
  height: 2.2em;
979
1018
  display: flex;
980
1019
  align-items: center;
@@ -985,43 +1024,22 @@
985
1024
  margin: 4px 0px 4px 12px;
986
1025
  }
987
1026
 
988
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1027
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
989
1028
  text-shadow: none;
990
1029
  }
991
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
992
- display: none;
993
- font-size: 12px;
994
- }
995
1030
 
996
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
997
- height: 2.2em;
998
- display: inline-flex;
999
- align-items: center;
1000
- /* font-family: monospace; */
1031
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1032
+ display: flex;
1001
1033
  justify-content: center;
1002
- border: 2px solid;
1003
- margin: 4px 0px 4px 6px;
1004
- white-space: pre;
1005
- padding: 0px 6px;
1006
- font-size: 1.2em;
1007
- font-weight: 500;
1008
- color: rgba(255, 255, 2555, 0.7);
1009
-
1010
- letter-spacing: -.1px;
1011
- line-height: normal;
1012
- text-transform: uppercase;
1013
- color: #FFFFFF;
1014
- opacity: .7;
1015
- font-family: "Proxima Nova";
1034
+ min-width: 5.3em;
1035
+ pointer-events: none;
1036
+ user-select: none;
1016
1037
  }
1017
1038
 
1018
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1019
- opacity: 1;
1039
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1040
+ color: white;
1020
1041
  }
1021
1042
 
1022
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1023
- content: "NOT LIVE";
1024
- }
1025
1043
 
1026
1044
  .settings-selection.vjs-control.vjs-button{
1027
1045
  display: flex !important;
@@ -1038,57 +1056,57 @@
1038
1056
  .tvProviderImage{
1039
1057
  display: none
1040
1058
  }
1041
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1059
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1042
1060
  .icon-maximize {
1043
1061
  height: 30px !important;
1044
1062
  }
1045
1063
 
1046
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1064
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1047
1065
  .icon-minimize {
1048
1066
  height: 30px !important;
1049
1067
  }
1050
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1068
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1051
1069
  width: 4.5em;
1052
1070
  }
1053
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1071
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1054
1072
  height: min-content;
1055
1073
  }
1056
1074
 
1057
- .video-js.skin_news button.vjs-slowmo-button{
1075
+ .video-js.skin_news_live button.vjs-slowmo-button{
1058
1076
  display: none;
1059
1077
  }
1060
- .video-js.skin_news button.vjs-rewind-button{
1078
+ .video-js.skin_news_live button.vjs-rewind-button{
1061
1079
  display: none;
1062
1080
  }
1063
- .video-js.skin_news button.vjs-rewind-button>svg{
1081
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1064
1082
  height: 20px;
1065
1083
  }
1066
- .video-js.skin_news .vjs-button{
1084
+ .video-js.skin_news_live .vjs-button{
1067
1085
  width: 4.8em;
1068
1086
  }
1069
- .video-js.skin_news .widget-selection{
1087
+ .video-js.skin_news_live .widget-selection{
1070
1088
  display: none;
1071
1089
  }
1072
- .video-js.skin_news .container{
1090
+ .video-js.skin_news_live .container{
1073
1091
  display: none !important;
1074
1092
  }
1075
- .video-js.skin_news .vjs-control-bar{
1093
+ .video-js.skin_news_live .vjs-control-bar{
1076
1094
  height: 4em !important;
1077
1095
  }
1078
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1096
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1079
1097
  font-size: 2.5em;
1080
1098
  line-height: 1.5;
1081
1099
  }
1082
- .video-js.skin_news .vjs-play-progress:before {
1100
+ .video-js.skin_news_live .vjs-play-progress:before {
1083
1101
  font-size: 1.2em;
1084
1102
  position: absolute;
1085
1103
  right: -0.5em;
1086
1104
  z-index: 1;
1087
1105
  }
1088
- .video-js.skin_news button.vjs-skip-button>svg{
1106
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1089
1107
  height: 20px;
1090
1108
  }
1091
- .video-js.skin_news button.vjs-big-play-button {
1109
+ .video-js.skin_news_live button.vjs-big-play-button {
1092
1110
  width: 50px !important;
1093
1111
  height: 50px !important;
1094
1112
  font-size: 2.1rem !important;
@@ -1098,17 +1116,17 @@
1098
1116
  width: 24px;
1099
1117
  height: 24px;
1100
1118
  }
1101
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1119
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1102
1120
  margin: 0 12px 0 12px;
1103
1121
  }
1104
- .video-js.skin_news .vjs-seek-to-live-text{
1122
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1105
1123
  font-size: 12px;
1106
1124
  }
1107
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1125
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1108
1126
  margin: 0 12px 0 12px;
1109
1127
  }
1110
1128
  }
1111
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1129
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1112
1130
  width: 90px;
1113
1131
  height: 90px;
1114
1132
  display: flex;
@@ -1125,7 +1143,7 @@
1125
1143
  line-height: 1.4em;
1126
1144
  }
1127
1145
 
1128
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1146
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1129
1147
  display: flex;
1130
1148
  justify-content: center;
1131
1149
  align-items: center;
@@ -1133,29 +1151,22 @@
1133
1151
  transition: width 0.1s;
1134
1152
  }
1135
1153
 
1136
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1154
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1137
1155
  display: flex;
1138
1156
  justify-content: center;
1139
1157
  align-items: center;
1140
1158
  height: 100%;
1141
1159
  transition: width 0.1s;
1142
1160
  }
1143
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1161
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1144
1162
  display: none !important;
1145
1163
  }
1146
- .video-js.skin_news .ssai-ad-container{
1147
- position: absolute;
1148
- bottom: 14px;
1149
- }
1150
1164
 
1151
1165
  @media (max-width: 576px) {
1152
- .video-js.skin_news .ssai-ad-container{
1153
- bottom: 2px;
1154
- }
1155
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1166
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1156
1167
  height: 5px !important;
1157
1168
  }
1158
- .video-js.skin_news button.vjs-big-play-button {
1169
+ .video-js.skin_news_live button.vjs-big-play-button {
1159
1170
  width: 50px !important;
1160
1171
  height: 50px !important;
1161
1172
  font-size: 2.1rem !important;
@@ -1164,360 +1175,682 @@
1164
1175
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1165
1176
  display: none;
1166
1177
  }
1167
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1178
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1168
1179
  bottom: 2.4em !important;
1169
1180
  right: -1em;
1170
1181
  z-index: 1;
1171
1182
  }
1172
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1183
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1173
1184
  display: none !important;
1174
1185
  }
1175
1186
 
1176
- .video-js.skin_news .vjs-text-track-display-ttml span {
1177
- color: white;
1178
- font-size: 13px;
1179
- background-color: black;
1187
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1188
+ color: white !important;
1189
+ font-size: 13px !important;
1190
+ background-color: black !important;
1180
1191
  }
1181
1192
  }
1182
1193
 
1183
- .video-js.skin_news .vjs-text-track-display-ttml span {
1184
- color: white;
1185
- font-size: 16px;
1186
- background-color: black;
1194
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1195
+ width: 100% !important;
1187
1196
  }
1188
1197
 
1189
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1198
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1199
+ color: white !important;
1200
+ font-size: 16px !important;
1201
+ background-color: black !important;
1202
+ }
1203
+
1204
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1190
1205
  margin-bottom: 2rem !important;
1191
1206
  }
1192
1207
 
1193
- .video-js.skin_news .vjs-text-track-display-ttml p {
1208
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
1194
1209
  font-size: 18px !important;
1195
1210
  }
1196
1211
 
1197
1212
 
1198
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1199
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1213
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1214
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1200
1215
  font-size: 1.2em !important;
1201
1216
  line-height: 1.5em !important;
1202
1217
  padding: 0.2em 0.8em !important;
1203
1218
  }
1204
1219
 
1205
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1220
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1206
1221
  content: none !important;
1207
1222
  fill: none !important;
1208
1223
  filter: none !important;
1209
1224
  }
1210
1225
 
1211
- /* svg icons opacity and hover effect */
1212
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1213
- opacity: 0.7 !important;
1214
- }
1215
-
1216
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1217
- opacity: 1 !important;
1218
- }
1219
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1220
- opacity: 0.7 !important;
1221
- }
1222
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1223
- opacity: 1 !important;
1224
- }
1225
-
1226
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1226
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1227
1227
  color: rgba(255, 255, 2555, 0.7)!important;
1228
1228
  }
1229
1229
 
1230
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1230
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1231
1231
  color: rgba(255, 255, 2555, 1)!important;
1232
1232
  }
1233
1233
 
1234
1234
 
1235
1235
 
1236
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1237
- font-size: 2.2em;
1238
- line-height: 2.6;
1239
- }
1240
- .video-js.skin_mini{
1241
- overflow: hidden;
1242
- }
1243
- .video-js.skin_mini .vjs-control-bar{
1244
- z-index: 1 !important;
1245
- height: 4em !important;
1246
- background: black !important;
1247
- }
1248
1236
 
1249
- .video-js.skin_mini .vjs-fade>* {
1250
- visibility: hidden !important;
1251
- opacity: 0 !important;
1252
- transition: visibility 1s, opacity 1s !important;
1237
+ .video-js.skin_cn_news .vjs-control-bar {
1238
+ z-index: 1 !important;
1239
+ height: auto !important;
1240
+ padding: 0.8em 30px 0.6em;
1241
+ background: transparent !important;
1242
+ display: flex;
1243
+ flex-wrap: wrap;
1244
+ align-items: center;
1245
+ column-gap: 10px;
1253
1246
  }
1254
1247
 
1255
- .video-js.skin_mini .custom-spaced-progress-bar {
1248
+
1249
+ .video-js.skin_cn_news .vjs-control-bar::before {
1250
+ content: '';
1256
1251
  position: absolute;
1257
- width: 100%;
1258
- display: flex;
1259
- height: 0.5em;
1260
- top: -0.5em;
1252
+ left: 0;
1253
+ right: 0;
1254
+ bottom: 0;
1255
+ top: -3em;
1256
+ background: linear-gradient(
1257
+ to top,
1258
+ rgba(0, 0, 0, 0.85) 0%,
1259
+ rgba(0, 0, 0, 0.7) 40%,
1260
+ rgba(0, 0, 0, 0.55) 70%,
1261
+ rgba(0, 0, 0, 0.38) 86%,
1262
+ transparent 100%
1263
+ );
1264
+ pointer-events: none;
1265
+ z-index: -1;
1261
1266
  }
1262
1267
 
1263
- .video-js.skin_mini .vjs-progress-control {
1264
- /* left: -6px; */
1268
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1269
+ order: -1;
1270
+ flex: 0 0 100%;
1271
+ width: 80%;
1272
+ margin: 0 0 5em;
1265
1273
  position: relative;
1266
- width: 100%;
1267
- height: 0.5em;
1268
- transition: height 0.1s, top 0.1s;
1269
1274
  }
1270
1275
 
1276
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1277
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1278
+ width: auto;
1279
+ min-width: 0;
1280
+ }
1281
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1282
+ display: inline-flex;
1283
+ align-items: center;
1284
+ justify-content: center;
1285
+ height: 7em;
1286
+ padding: 0 10px;
1287
+ color: #fff;
1288
+ }
1271
1289
 
1272
-
1273
-
1274
- .video-js.skin_mini .vjs-custom-control-spacer {
1275
- display: block;
1276
- flex: 1 1 auto;
1290
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1291
+ content: none !important;
1277
1292
  }
1278
1293
 
1279
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1280
- margin: 0 0px 0 0px;
1294
+
1295
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1296
+ display: inline-flex;
1297
+ align-items: center;
1298
+ justify-content: center;
1281
1299
  }
1282
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1283
- display: none;
1300
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1301
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1302
+ width: 24px;
1303
+ height: 24px;
1304
+ display: block;
1284
1305
  }
1285
1306
 
1286
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1287
- font-size: 14px;
1288
- font-weight: 500;
1289
- align-self: center;
1290
- height: min-content;
1291
- padding: 5px 2px;
1292
- border-radius: 8px;
1293
- }
1294
1307
 
1295
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1296
- height: 5px !important;
1297
- }
1298
1308
 
1299
- .video-js.skin_mini .vjs-play-progress:before {
1300
- font-size: 1.3em;
1301
- line-height: unset;
1302
- top: -0.3333333333em;
1309
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1310
+ opacity: 1;
1303
1311
  }
1304
1312
 
1305
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1306
- display: none !important;
1307
- }
1308
1313
 
1309
- /* */
1310
- .video-js.skin_mini .vjs-mouse-display{
1311
- font-size: 1.6666666667em;
1312
- }
1313
1314
 
1314
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1315
- font-size: 1em !important;
1315
+ .video-js.skin_cn_news .vjs-volume-panel {
1316
+ margin: 0;
1317
+ display: inline-flex;
1318
+ align-items: center;
1319
+ align-self: center;
1320
+ height: 2.2em;
1321
+ min-width: 7em;
1322
+ transition: none;
1316
1323
  }
1317
-
1318
- .video-js.skin_mini .vjs-button{
1319
- width: 3em;
1324
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1325
+ width: 0;
1326
+ height: 100%;
1320
1327
  display: flex;
1321
1328
  align-items: center;
1322
- justify-content: center;
1329
+ overflow: hidden;
1330
+ opacity: 0;
1331
+ transition: width 0.15s ease, opacity 0.15s ease;
1323
1332
  }
1324
-
1325
-
1326
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1327
- .icon-maximize {
1328
- display: block;
1329
- height: 32px;
1333
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1334
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1335
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1336
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1337
+ width: 5em;
1338
+ opacity: 1;
1330
1339
  }
1331
1340
 
1332
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1333
- line-height: 4;
1341
+ .video-js.skin_cn_news .vjs-volume-bar {
1342
+ width: 4em;
1343
+ height: 0.3em;
1344
+ margin: 0 0.45em;
1334
1345
  }
1335
1346
 
1336
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1337
- .icon-minimize {
1338
- display: none;
1339
- height: 32px;
1340
- }
1341
1347
 
1342
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1343
- outline: none !important;
1344
- }
1345
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1346
- .vjs-icon-fullscreen-enter:before {
1347
- /* content: '' !important; */
1348
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1349
+ display: none !important;
1348
1350
  }
1349
1351
 
1350
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1351
- display: flex;
1352
- justify-content: center;
1353
- align-items: center;
1354
- /* transform: rotate(90deg); */
1352
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1353
+ width: 0 !important;
1355
1354
  }
1356
1355
 
1357
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1358
- display: none;
1359
- }
1360
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1361
- margin-left: -10px;
1362
- display: none;
1363
- }
1364
1356
 
1365
- .video-js.skin_mini .vjs-loading-spinner {
1366
- position: absolute;
1367
- top: 50%;
1368
- left: 50%;
1369
- transform: translate(-50%, -50%);
1370
- opacity: .85;
1371
- text-align: left;
1372
- border: .2em solid rgba(43, 51, 63, .7);
1373
- box-sizing: border-box;
1374
- background-clip: padding-box;
1375
- width: 3em;
1376
- height: 3em;
1377
- border-radius: 50%;
1378
- visibility: hidden;
1357
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1358
+ display: block !important;
1359
+ flex: 1 1 auto;
1379
1360
  }
1380
1361
 
1381
- .video-js.skin_mini .skipbtn:hover{
1382
- cursor: pointer;
1383
- }
1384
1362
 
1385
- .video-js.skin_mini .rewindbtn:hover{
1386
- cursor: pointer;
1363
+ .video-js.skin_cn_news .vjs-big-play-button {
1364
+ display: none;
1387
1365
  }
1388
-
1389
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1390
- position: relative;
1391
- padding-left: 0;
1366
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1367
+ position: relative !important;
1368
+ display: flex;
1369
+ left: 0;
1370
+ top: -1px;
1392
1371
  }
1393
-
1394
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1395
- width: 40px;
1396
- height: 40px;
1372
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1397
1373
  display: flex;
1398
1374
  justify-content: center;
1399
1375
  align-items: center;
1400
- border: none;
1401
1376
  position: absolute;
1402
1377
  top: 0;
1403
1378
  left: 0;
1404
1379
  right: 0;
1405
1380
  bottom: 0;
1406
1381
  margin: auto;
1407
- font-size: 3em;
1408
- line-height: 1.3em;
1409
- transform: none !important;
1410
- border-radius: 1.3em;
1382
+ width: 80px;
1383
+ height: 80px;
1384
+ border: none;
1385
+ border-radius: 50%;
1386
+ background: rgba(0, 0, 0, 0.55);
1387
+ font-size: 5em;
1388
+ line-height: 1.3em;
1389
+ transform: none !important;
1411
1390
  }
1412
1391
 
1413
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1414
- font-weight: bold;
1392
+
1393
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1394
+ height: 4px !important;
1395
+ margin: 0;
1396
+ border-radius: 20px;
1397
+ background-color: #393944;
1415
1398
  }
1416
1399
 
1417
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1418
- bottom: 1.1em !important;
1419
- right: 1em;
1420
- z-index: 1;
1421
- font-size: 10px;
1400
+ .video-js.skin_cn_news .vjs-play-progress {
1401
+ background-color: #ffffff;
1402
+ border-radius: 20px;
1422
1403
  }
1423
1404
 
1424
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1425
- width: 24px !important;
1426
- height: 24px !important;
1405
+ .video-js.skin_cn_news .vjs-load-progress,
1406
+ .video-js.skin_cn_news .vjs-load-progress div {
1407
+ background: rgba(255, 255, 255, 0.15);
1408
+ border-radius: 20px;
1427
1409
  }
1428
- .video-js.skin_mini .settings-selector-icon>svg{
1429
- height: 19px !important;
1430
- width: 19px !important;
1410
+
1411
+
1412
+ .video-js.skin_cn_news .vjs-play-progress:before {
1413
+ content: '';
1414
+ width: 16px;
1415
+ height: 16px;
1416
+ border-radius: 50%;
1417
+ background: #ffffff;
1418
+ border: 2px solid rgba(0, 0, 0, 0.6);
1419
+ box-sizing: border-box;
1420
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1421
+ top: -6px;
1422
+ right: -8px;
1423
+ position: absolute;
1424
+ }
1425
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1426
+ display: none !important;
1431
1427
  }
1432
1428
 
1429
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1430
+ background: #ffffff;
1431
+ color: #0a0e17;
1432
+ font-weight: 700;
1433
+ border-radius: 3px;
1434
+ }
1433
1435
 
1434
- .video-js.skin_mini button.vjs-rewind-button{
1436
+ .video-js.skin_cn_news .vjs-live-control {
1437
+ display: none !important;
1438
+ }
1439
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1440
+ display: inline-flex;
1441
+ align-items: center;
1442
+ align-self: center;
1443
+ height: 2.2em;
1444
+ gap: 5px;
1445
+ width: auto;
1446
+ padding: 0 10px;
1447
+ border: 1px solid rgba(255, 255, 255, 0.45);
1448
+ border-radius: 4px;
1435
1449
  cursor: pointer;
1436
1450
  }
1437
1451
 
1438
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1439
- padding-right: 0;
1452
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1453
+ display: none;
1454
+ }
1455
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1456
+ display: inline-flex;
1457
+ align-items: center;
1458
+ }
1459
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1460
+ content: '';
1461
+ display: inline-block;
1462
+ width: 8px;
1463
+ height: 8px;
1464
+ border-radius: 50%;
1465
+ background: #ff2d2d; /* red live dot */
1466
+ }
1467
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1468
+ color: #ffffff;
1469
+ font-weight: 700;
1470
+ font-size: 12px;
1471
+ letter-spacing: 0.03em;
1440
1472
  }
1441
1473
 
1442
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1443
- padding-left: 0;
1474
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1475
+ border-color: transparent;
1476
+ }
1477
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1478
+ color: #ff2d2d;
1444
1479
  }
1445
1480
 
1446
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1447
- padding-left: 0;
1448
- padding-right: 0;
1449
- display: flex;
1481
+ /* ---- time controls ---- */
1482
+ .video-js.skin_cn_news .vjs-current-time,
1483
+ .video-js.skin_cn_news .vjs-duration,
1484
+ .video-js.skin_cn_news .vjs-time-divider {
1485
+ display: none !important;
1486
+ }
1487
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1488
+ display: none;
1489
+ align-items: center;
1450
1490
  justify-content: center;
1451
- width: min-content;
1491
+ font-size: 11px;
1492
+ font-weight: 700;
1493
+ color: #fff;
1494
+ padding: 0 6px;
1495
+ user-select: none;
1452
1496
  }
1453
1497
 
1454
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1455
- display: none
1498
+
1499
+ .video-js.skin_cn_news .vjs-chapter-marker {
1500
+ z-index: 2;
1501
+ width: var(--vl-chapter-size, 8px);
1502
+ height: var(--vl-chapter-size, 8px);
1503
+ top: 50%;
1504
+ bottom: auto;
1505
+ background: var(--vl-chapter-color, #ffffff);
1506
+ opacity: var(--vl-chapter-opacity, 1);
1507
+ border-radius: 50%;
1508
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1509
+ transform: translate(-50%, -50%) scale(1);
1510
+ transition: background-color 0.12s ease;
1456
1511
  }
1457
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1458
- display: none
1512
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1513
+ background: var(--vl-chapter-hover, #0a5cff);
1514
+ }
1515
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1516
+ background: var(--vl-chapter-active, #0a5cff);
1459
1517
  }
1460
1518
 
1461
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1462
- display: flex;
1463
- align-items: center;
1464
- font-weight: 700;
1465
- font-size: 9px;
1466
- min-width: 0.8em;
1467
- padding-left: 0;
1519
+
1520
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1521
+ width: 16px;
1522
+ height: 16px;
1523
+ bottom: 160%;
1524
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1468
1525
  }
1469
1526
 
1470
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1471
- display: none;
1472
- font-size: 11px;
1473
- justify-content: center;
1474
- align-items: center;
1475
- user-select: none;
1527
+
1528
+ .video-js.skin_cn_news .vjs-chapter-preview {
1529
+ background: var(--vl-chapter-tooltip, #0a5cff);
1530
+ border-radius: 6px;
1531
+ padding: 8px 10px;
1532
+ width: max-content;
1533
+ max-width: 300px;
1534
+ text-align: left;
1535
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1476
1536
  }
1477
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1478
- display: none;
1537
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1538
+ color: #ffffff;
1539
+ font-size: 13px;
1540
+ font-weight: 400;
1541
+ margin-bottom: 2px;
1479
1542
  }
1480
-
1481
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1482
- height: min-content;
1483
- width: min-content;
1543
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1544
+ color: #ffffff;
1545
+ font-size: 13px;
1546
+ font-weight: 400;
1547
+ line-height: 1.3;
1548
+ white-space: normal;
1549
+ text-align: left;
1484
1550
  }
1485
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1486
- width: 3em;
1487
- margin-right: 4px;
1551
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1552
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1488
1553
  }
1489
1554
 
1490
- .video-js.skin_mini .content{
1491
- bottom: 3.4rem !important;
1492
- right: -4rem !important;
1555
+ /* ---- responsive ---- */
1556
+ @media (max-width: 576px) {
1557
+ .video-js.skin_cn_news .vjs-control-bar {
1558
+ height: 3.2em !important;
1559
+ padding: 0 8px;
1560
+ }
1561
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1562
+ padding: 0 6px;
1563
+ }
1564
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1565
+ display: none !important;
1566
+ }
1493
1567
  }
1494
1568
 
1495
- .video-js.skin_mini .setting-icon > svg{
1496
- height:18px !important;
1569
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1570
+ font-size: 2.2em;
1571
+ line-height: 2.6;
1572
+ }
1573
+ .video-js.skin_mini{
1574
+ overflow: hidden;
1575
+ }
1576
+ .video-js.skin_mini .vjs-control-bar{
1577
+ z-index: 1 !important;
1578
+ height: 4em !important;
1579
+ background: black !important;
1497
1580
  }
1498
1581
 
1499
- .output-overlay{
1582
+ .video-js.skin_mini .vjs-fade>* {
1583
+ visibility: hidden !important;
1584
+ opacity: 0 !important;
1585
+ transition: visibility 1s, opacity 1s !important;
1586
+ }
1587
+
1588
+ .video-js.skin_mini .custom-spaced-progress-bar {
1500
1589
  position: absolute;
1501
- bottom: 0;
1502
- height: 100%;
1503
1590
  width: 100%;
1504
- z-index: 0;
1505
- border: 0;
1506
- pointer-events:none
1591
+ display: flex;
1592
+ height: 0.5em;
1593
+ top: -0.5em;
1507
1594
  }
1508
1595
 
1509
- .video-js.skin_mini iframe{
1596
+ .video-js.skin_mini .vjs-progress-control {
1597
+ /* left: -6px; */
1598
+ position: relative;
1510
1599
  width: 100%;
1511
- height: 100%;
1600
+ height: 0.5em;
1601
+ transition: height 0.1s, top 0.1s;
1512
1602
  }
1513
1603
 
1514
- .video-js.skin_mini .vjs-live-control{
1515
- align-items: center;
1516
- max-width: 5em;
1604
+
1605
+
1606
+
1607
+ .video-js.skin_mini .vjs-custom-control-spacer {
1608
+ display: block;
1609
+ flex: 1 1 auto;
1517
1610
  }
1518
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1519
- height: 2.2em;
1520
- display: flex;
1611
+
1612
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1613
+ margin: 0 0px 0 0px;
1614
+ }
1615
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1616
+ display: none;
1617
+ }
1618
+
1619
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1620
+ font-size: 14px;
1621
+ font-weight: 500;
1622
+ align-self: center;
1623
+ height: min-content;
1624
+ padding: 5px 2px;
1625
+ border-radius: 8px;
1626
+ }
1627
+
1628
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1629
+ height: 5px !important;
1630
+ }
1631
+
1632
+ .video-js.skin_mini .vjs-play-progress:before {
1633
+ font-size: 1.3em;
1634
+ line-height: unset;
1635
+ top: -0.3333333333em;
1636
+ }
1637
+
1638
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1639
+ display: none !important;
1640
+ }
1641
+
1642
+ /* */
1643
+ .video-js.skin_mini .vjs-mouse-display{
1644
+ font-size: 1.6666666667em;
1645
+ }
1646
+
1647
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1648
+ font-size: 1em !important;
1649
+ }
1650
+
1651
+ .video-js.skin_mini .vjs-button{
1652
+ width: 3em;
1653
+ display: flex;
1654
+ align-items: center;
1655
+ justify-content: center;
1656
+ }
1657
+
1658
+
1659
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1660
+ .icon-maximize {
1661
+ display: block;
1662
+ height: 32px;
1663
+ }
1664
+
1665
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1666
+ line-height: 4;
1667
+ }
1668
+
1669
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1670
+ .icon-minimize {
1671
+ display: none;
1672
+ height: 32px;
1673
+ }
1674
+
1675
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1676
+ outline: none !important;
1677
+ }
1678
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1679
+ .vjs-icon-fullscreen-enter:before {
1680
+ /* content: '' !important; */
1681
+ }
1682
+
1683
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1684
+ display: flex;
1685
+ justify-content: center;
1686
+ align-items: center;
1687
+ /* transform: rotate(90deg); */
1688
+ }
1689
+
1690
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1691
+ display: none;
1692
+ }
1693
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1694
+ margin-left: -10px;
1695
+ display: none;
1696
+ }
1697
+
1698
+ .video-js.skin_mini .vjs-loading-spinner {
1699
+ position: absolute;
1700
+ top: 50%;
1701
+ left: 50%;
1702
+ transform: translate(-50%, -50%);
1703
+ opacity: .85;
1704
+ text-align: left;
1705
+ border: .2em solid rgba(43, 51, 63, .7);
1706
+ box-sizing: border-box;
1707
+ background-clip: padding-box;
1708
+ width: 3em;
1709
+ height: 3em;
1710
+ border-radius: 50%;
1711
+ visibility: hidden;
1712
+ }
1713
+
1714
+ .video-js.skin_mini .skipbtn:hover{
1715
+ cursor: pointer;
1716
+ }
1717
+
1718
+ .video-js.skin_mini .rewindbtn:hover{
1719
+ cursor: pointer;
1720
+ }
1721
+
1722
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1723
+ position: relative;
1724
+ padding-left: 0;
1725
+ }
1726
+
1727
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1728
+ width: 40px;
1729
+ height: 40px;
1730
+ display: flex;
1731
+ justify-content: center;
1732
+ align-items: center;
1733
+ border: none;
1734
+ position: absolute;
1735
+ top: 0;
1736
+ left: 0;
1737
+ right: 0;
1738
+ bottom: 0;
1739
+ margin: auto;
1740
+ font-size: 3em;
1741
+ line-height: 1.3em;
1742
+ transform: none !important;
1743
+ border-radius: 1.3em;
1744
+ }
1745
+
1746
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1747
+ font-weight: bold;
1748
+ }
1749
+
1750
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1751
+ bottom: 1.1em !important;
1752
+ right: 1em;
1753
+ z-index: 1;
1754
+ font-size: 10px;
1755
+ }
1756
+
1757
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1758
+ width: 24px !important;
1759
+ height: 24px !important;
1760
+ }
1761
+ .video-js.skin_mini .settings-selector-icon>svg{
1762
+ height: 19px !important;
1763
+ width: 19px !important;
1764
+ }
1765
+
1766
+
1767
+ .video-js.skin_mini button.vjs-rewind-button{
1768
+ cursor: pointer;
1769
+ }
1770
+
1771
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1772
+ padding-right: 0;
1773
+ }
1774
+
1775
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1776
+ padding-left: 0;
1777
+ }
1778
+
1779
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1780
+ padding-left: 0;
1781
+ padding-right: 0;
1782
+ display: flex;
1783
+ justify-content: center;
1784
+ width: min-content;
1785
+ }
1786
+
1787
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1788
+ display: none
1789
+ }
1790
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1791
+ display: none
1792
+ }
1793
+
1794
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1795
+ display: flex;
1796
+ align-items: center;
1797
+ font-weight: 700;
1798
+ font-size: 9px;
1799
+ min-width: 0.8em;
1800
+ padding-left: 0;
1801
+ }
1802
+
1803
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1804
+ display: none;
1805
+ font-size: 11px;
1806
+ justify-content: center;
1807
+ align-items: center;
1808
+ user-select: none;
1809
+ }
1810
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1811
+ display: none;
1812
+ }
1813
+
1814
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1815
+ height: min-content;
1816
+ width: min-content;
1817
+ }
1818
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1819
+ width: 3em;
1820
+ margin-right: 4px;
1821
+ }
1822
+
1823
+ .video-js.skin_mini .content{
1824
+ bottom: 3.4rem !important;
1825
+ right: -4rem !important;
1826
+ }
1827
+
1828
+ .video-js.skin_mini .setting-icon > svg{
1829
+ height:18px !important;
1830
+ }
1831
+
1832
+ .output-overlay{
1833
+ position: absolute;
1834
+ bottom: 0;
1835
+ height: 100%;
1836
+ width: 100%;
1837
+ z-index: 0;
1838
+ border: 0;
1839
+ pointer-events:none
1840
+ }
1841
+
1842
+ .video-js.skin_mini iframe{
1843
+ width: 100%;
1844
+ height: 100%;
1845
+ }
1846
+
1847
+ .video-js.skin_mini .vjs-live-control{
1848
+ align-items: center;
1849
+ max-width: 5em;
1850
+ }
1851
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1852
+ height: 2.2em;
1853
+ display: flex;
1521
1854
  align-items: center;
1522
1855
  font-family: monospace;
1523
1856
  width: 4em;
@@ -1606,435 +1939,102 @@
1606
1939
  right: -0.5em;
1607
1940
  z-index: 1;
1608
1941
  }
1609
- .video-js.skin_mini button.vjs-skip-button>svg{
1610
- height: 20px;
1611
- }
1612
-
1613
- .stream-selector-icon>svg{
1614
- width: 24px;
1615
- height: 24px;
1616
- }
1617
- .video-js.skin_mini .vjs-seek-to-live-text{
1618
- font-size: 12px;
1619
- }
1620
-
1621
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1622
- color: white !important;
1623
- font-size: 16px !important;
1624
- background-color: rgba(0,0,0,0.2) !important;
1625
- }
1626
- }
1627
-
1628
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1629
- color: white !important;
1630
- font-size: 16px !important;
1631
- background-color: rgba(0,0,0,0.2) !important;
1632
- }
1633
-
1634
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1635
- font-size: 18px !important;
1636
- }
1637
-
1638
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1639
- margin-bottom: 1rem !important;
1640
- }
1641
-
1642
-
1643
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1644
- display: flex;
1645
- justify-content: center;
1646
- align-items: center;
1647
- height: 100%;
1648
- transition: width 0.1s;
1649
- }
1650
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1651
- margin: 2px;
1652
- }
1653
-
1654
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1655
- display: flex;
1656
- justify-content: center;
1657
- align-items: center;
1658
- height: 100%;
1659
- transition: width 0.1s;
1660
- }
1661
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1662
- display: grid;
1663
- font-size: 10px;
1664
- grid-template-columns: 1fr;
1665
- grid-template-rows: 1fr;
1666
- padding: 1px 0px 0 0px;
1667
- margin: 0;
1668
- }
1669
-
1670
- @media (max-width: 600px) {
1671
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1672
- height: 5px !important;
1673
- }
1674
-
1675
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1676
- display: none;
1677
- }
1678
-
1679
- }
1680
-
1681
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1682
- content: none !important;
1683
- fill: none !important;
1684
- filter: none !important;
1685
- }
1686
-
1687
- /* svg icons opacity and hover effect */
1688
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1689
- opacity: 0.7 !important;
1690
- }
1691
-
1692
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1693
- opacity: 1 !important;
1694
- }
1695
-
1696
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1697
- color: rgba(255, 255, 2555, 0.7)!important;
1698
- }
1699
-
1700
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1701
- color: rgba(255, 255, 2555, 1)!important;
1702
- }
1703
-
1704
-
1705
-
1706
- .video-js.skin_cn_news .vjs-control-bar {
1707
- z-index: 1 !important;
1708
- height: auto !important;
1709
- padding: 0.8em 30px 0.6em;
1710
- background: transparent !important;
1711
- display: flex;
1712
- flex-wrap: wrap;
1713
- align-items: center;
1714
- column-gap: 10px;
1715
- }
1716
-
1717
-
1718
- .video-js.skin_cn_news .vjs-control-bar::before {
1719
- content: '';
1720
- position: absolute;
1721
- left: 0;
1722
- right: 0;
1723
- bottom: 0;
1724
- top: -3em;
1725
- background: linear-gradient(
1726
- to top,
1727
- rgba(0, 0, 0, 0.85) 0%,
1728
- rgba(0, 0, 0, 0.7) 40%,
1729
- rgba(0, 0, 0, 0.55) 70%,
1730
- rgba(0, 0, 0, 0.38) 86%,
1731
- transparent 100%
1732
- );
1733
- pointer-events: none;
1734
- z-index: -1;
1735
- }
1736
-
1737
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1738
- order: -1;
1739
- flex: 0 0 100%;
1740
- width: 80%;
1741
- margin: 0 0 5em;
1742
- position: relative;
1743
- }
1744
-
1745
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1746
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1747
- width: auto;
1748
- min-width: 0;
1749
- }
1750
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1751
- display: inline-flex;
1752
- align-items: center;
1753
- justify-content: center;
1754
- height: 7em;
1755
- padding: 0 10px;
1756
- color: #fff;
1757
- }
1758
-
1759
- .video-js.skin_cn_news .vjs-svg-icon::before {
1760
- content: none !important;
1761
- }
1762
-
1763
-
1764
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1765
- display: inline-flex;
1766
- align-items: center;
1767
- justify-content: center;
1768
- }
1769
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1770
- .video-js.skin_cn_news .vjs-rewind-button svg {
1771
- width: 24px;
1772
- height: 24px;
1773
- display: block;
1774
- }
1775
-
1776
-
1777
-
1778
- .video-js.skin_cn_news .vjs-subs-caps-button {
1779
- opacity: 1;
1780
- }
1781
-
1782
-
1783
-
1784
- .video-js.skin_cn_news .vjs-volume-panel {
1785
- margin: 0;
1786
- display: inline-flex;
1787
- align-items: center;
1788
- align-self: center;
1789
- height: 2.2em;
1790
- min-width: 7em;
1791
- transition: none;
1792
- }
1793
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1794
- width: 0;
1795
- height: 100%;
1796
- display: flex;
1797
- align-items: center;
1798
- overflow: hidden;
1799
- opacity: 0;
1800
- transition: width 0.15s ease, opacity 0.15s ease;
1801
- }
1802
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1803
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1804
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1805
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1806
- width: 5em;
1807
- opacity: 1;
1808
- }
1809
-
1810
- .video-js.skin_cn_news .vjs-volume-bar {
1811
- width: 4em;
1812
- height: 0.3em;
1813
- margin: 0 0.45em;
1814
- }
1815
-
1816
-
1817
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1818
- display: none !important;
1819
- }
1820
-
1821
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1822
- width: 0 !important;
1823
- }
1824
-
1825
-
1826
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1827
- display: block !important;
1828
- flex: 1 1 auto;
1829
- }
1830
-
1831
-
1832
- .video-js.skin_cn_news .vjs-big-play-button {
1833
- display: none;
1834
- }
1835
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1836
- position: relative !important;
1837
- display: flex;
1838
- left: 0;
1839
- top: -1px;
1840
- }
1841
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1842
- display: flex;
1843
- justify-content: center;
1844
- align-items: center;
1845
- position: absolute;
1846
- top: 0;
1847
- left: 0;
1848
- right: 0;
1849
- bottom: 0;
1850
- margin: auto;
1851
- width: 80px;
1852
- height: 80px;
1853
- border: none;
1854
- border-radius: 50%;
1855
- background: rgba(0, 0, 0, 0.55);
1856
- font-size: 5em;
1857
- line-height: 1.3em;
1858
- transform: none !important;
1859
- }
1860
-
1861
-
1862
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1863
- height: 4px !important;
1864
- margin: 0;
1865
- border-radius: 20px;
1866
- background-color: #393944;
1867
- }
1868
-
1869
- .video-js.skin_cn_news .vjs-play-progress {
1870
- background-color: #ffffff;
1871
- border-radius: 20px;
1872
- }
1873
-
1874
- .video-js.skin_cn_news .vjs-load-progress,
1875
- .video-js.skin_cn_news .vjs-load-progress div {
1876
- background: rgba(255, 255, 255, 0.15);
1877
- border-radius: 20px;
1878
- }
1879
-
1880
-
1881
- .video-js.skin_cn_news .vjs-play-progress:before {
1882
- content: '';
1883
- width: 16px;
1884
- height: 16px;
1885
- border-radius: 50%;
1886
- background: #ffffff;
1887
- border: 2px solid rgba(0, 0, 0, 0.6);
1888
- box-sizing: border-box;
1889
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1890
- top: -6px;
1891
- right: -8px;
1892
- position: absolute;
1893
- }
1894
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1895
- display: none !important;
1896
- }
1897
-
1898
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1899
- background: #ffffff;
1900
- color: #0a0e17;
1901
- font-weight: 700;
1902
- border-radius: 3px;
1903
- }
1904
-
1905
- .video-js.skin_cn_news .vjs-live-control {
1906
- display: none !important;
1907
- }
1908
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1909
- display: inline-flex;
1910
- align-items: center;
1911
- align-self: center;
1912
- height: 2.2em;
1913
- gap: 5px;
1914
- width: auto;
1915
- padding: 0 10px;
1916
- border: 1px solid rgba(255, 255, 255, 0.45);
1917
- border-radius: 4px;
1918
- cursor: pointer;
1919
- }
1920
-
1921
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1922
- display: none;
1923
- }
1924
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1925
- display: inline-flex;
1926
- align-items: center;
1942
+ .video-js.skin_mini button.vjs-skip-button>svg{
1943
+ height: 20px;
1927
1944
  }
1928
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1929
- content: '';
1930
- display: inline-block;
1931
- width: 8px;
1932
- height: 8px;
1933
- border-radius: 50%;
1934
- background: #ff2d2d; /* red live dot */
1945
+
1946
+ .stream-selector-icon>svg{
1947
+ width: 24px;
1948
+ height: 24px;
1935
1949
  }
1936
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1937
- color: #ffffff;
1938
- font-weight: 700;
1950
+ .video-js.skin_mini .vjs-seek-to-live-text{
1939
1951
  font-size: 12px;
1940
- letter-spacing: 0.03em;
1941
1952
  }
1942
1953
 
1943
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1944
- border-color: transparent;
1954
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1955
+ color: white !important;
1956
+ font-size: 16px !important;
1957
+ background-color: rgba(0,0,0,0.2) !important;
1958
+ }
1945
1959
  }
1946
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1947
- color: #ff2d2d;
1960
+
1961
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1962
+ color: white !important;
1963
+ font-size: 16px !important;
1964
+ background-color: rgba(0,0,0,0.2) !important;
1948
1965
  }
1949
1966
 
1950
- /* ---- time controls ---- */
1951
- .video-js.skin_cn_news .vjs-current-time,
1952
- .video-js.skin_cn_news .vjs-duration,
1953
- .video-js.skin_cn_news .vjs-time-divider {
1954
- display: none !important;
1967
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1968
+ font-size: 18px !important;
1955
1969
  }
1956
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1957
- display: none;
1958
- align-items: center;
1959
- justify-content: center;
1960
- font-size: 11px;
1961
- font-weight: 700;
1962
- color: #fff;
1963
- padding: 0 6px;
1964
- user-select: none;
1970
+
1971
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1972
+ margin-bottom: 1rem !important;
1965
1973
  }
1966
1974
 
1967
1975
 
1968
- .video-js.skin_cn_news .vjs-chapter-marker {
1969
- z-index: 2;
1970
- width: var(--vl-chapter-size, 8px);
1971
- height: var(--vl-chapter-size, 8px);
1972
- top: 50%;
1973
- bottom: auto;
1974
- background: var(--vl-chapter-color, #ffffff);
1975
- opacity: var(--vl-chapter-opacity, 1);
1976
- border-radius: 50%;
1977
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1978
- transform: translate(-50%, -50%) scale(1);
1979
- transition: background-color 0.12s ease;
1976
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1977
+ display: flex;
1978
+ justify-content: center;
1979
+ align-items: center;
1980
+ height: 100%;
1981
+ transition: width 0.1s;
1980
1982
  }
1981
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1982
- background: var(--vl-chapter-hover, #0a5cff);
1983
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1984
+ margin: 2px;
1983
1985
  }
1984
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1985
- background: var(--vl-chapter-active, #0a5cff);
1986
+
1987
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1988
+ display: flex;
1989
+ justify-content: center;
1990
+ align-items: center;
1991
+ height: 100%;
1992
+ transition: width 0.1s;
1993
+ }
1994
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1995
+ display: grid;
1996
+ font-size: 10px;
1997
+ grid-template-columns: 1fr;
1998
+ grid-template-rows: 1fr;
1999
+ padding: 1px 0px 0 0px;
2000
+ margin: 0;
1986
2001
  }
1987
2002
 
2003
+ @media (max-width: 600px) {
2004
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
2005
+ height: 5px !important;
2006
+ }
2007
+
2008
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2009
+ display: none;
2010
+ }
1988
2011
 
1989
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1990
- width: 16px;
1991
- height: 16px;
1992
- bottom: 160%;
1993
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1994
2012
  }
1995
2013
 
1996
-
1997
- .video-js.skin_cn_news .vjs-chapter-preview {
1998
- background: var(--vl-chapter-tooltip, #0a5cff);
1999
- border-radius: 6px;
2000
- padding: 8px 10px;
2001
- width: max-content;
2002
- max-width: 300px;
2003
- text-align: left;
2004
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2014
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2015
+ content: none !important;
2016
+ fill: none !important;
2017
+ filter: none !important;
2005
2018
  }
2006
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2007
- color: #ffffff;
2008
- font-size: 13px;
2009
- font-weight: 400;
2010
- margin-bottom: 2px;
2019
+
2020
+ /* svg icons opacity and hover effect */
2021
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2022
+ opacity: 0.7 !important;
2011
2023
  }
2012
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2013
- color: #ffffff;
2014
- font-size: 13px;
2015
- font-weight: 400;
2016
- line-height: 1.3;
2017
- white-space: normal;
2018
- text-align: left;
2024
+
2025
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2026
+ opacity: 1 !important;
2019
2027
  }
2020
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2021
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2028
+
2029
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2030
+ color: rgba(255, 255, 2555, 0.7)!important;
2022
2031
  }
2023
2032
 
2024
- /* ---- responsive ---- */
2025
- @media (max-width: 576px) {
2026
- .video-js.skin_cn_news .vjs-control-bar {
2027
- height: 3.2em !important;
2028
- padding: 0 8px;
2029
- }
2030
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2031
- padding: 0 6px;
2032
- }
2033
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2034
- display: none !important;
2035
- }
2033
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2034
+ color: rgba(255, 255, 2555, 1)!important;
2036
2035
  }
2037
2036
 
2037
+
2038
2038
  /* CSS for videojs-dvr-seekbar */
2039
2039
 
2040
2040
  .video-js.vjs-dvr-seekbar {
@@ -2215,6 +2215,55 @@
2215
2215
 
2216
2216
 
2217
2217
 
2218
+ .vjs-custom-big-mute.vjs-control{
2219
+ position: absolute;
2220
+ align-items: center;
2221
+ background: #fcb700;
2222
+ border: 0;
2223
+ display: flex;
2224
+ align-items: center;
2225
+ height: 44px;
2226
+ justify-content: center;
2227
+ padding: 0;
2228
+ width: 44px;
2229
+ z-index: 1;
2230
+ outline: none;
2231
+ text-shadow:none !important;
2232
+ cursor: pointer;
2233
+ }
2234
+ .video-js.vjs-fullscreen .vjs-custom-big-mute.vjs-control {
2235
+ display: flex;
2236
+ top: 50px;
2237
+ height: 50px;
2238
+ width: 50px;
2239
+ }
2240
+ .video-js.vjs-fullscreen .vjs-custom-big-mute.vjs-control >svg {
2241
+ height: 28px;
2242
+ width: 28px;
2243
+ }
2244
+ .vjs-custom-big-mute.vjs-control:hover{
2245
+ filter: none;
2246
+ }
2247
+
2248
+
2249
+ .vjs-custom-big-mute.vjs-control.tl{
2250
+ top: 0;
2251
+ left: 0;
2252
+ margin: 15px 0 0 15px;
2253
+ }
2254
+
2255
+ .vjs-custom-big-mute.vjs-control.hide{
2256
+ display: none !important;
2257
+
2258
+ }
2259
+
2260
+ .vjs-custom-big-mute.vjs-control > svg {
2261
+ color: #071d39;
2262
+ height: 22px;
2263
+ width: 22px;
2264
+ }
2265
+
2266
+
2218
2267
  .video-js .multicamera-parent.default{
2219
2268
  height: 345px;
2220
2269
  position: absolute;
@@ -2297,55 +2346,6 @@
2297
2346
 
2298
2347
 
2299
2348
 
2300
- .vjs-custom-big-mute.vjs-control{
2301
- position: absolute;
2302
- align-items: center;
2303
- background: #fcb700;
2304
- border: 0;
2305
- display: flex;
2306
- align-items: center;
2307
- height: 44px;
2308
- justify-content: center;
2309
- padding: 0;
2310
- width: 44px;
2311
- z-index: 1;
2312
- outline: none;
2313
- text-shadow:none !important;
2314
- cursor: pointer;
2315
- }
2316
- .video-js.vjs-fullscreen .vjs-custom-big-mute.vjs-control {
2317
- display: flex;
2318
- top: 50px;
2319
- height: 50px;
2320
- width: 50px;
2321
- }
2322
- .video-js.vjs-fullscreen .vjs-custom-big-mute.vjs-control >svg {
2323
- height: 28px;
2324
- width: 28px;
2325
- }
2326
- .vjs-custom-big-mute.vjs-control:hover{
2327
- filter: none;
2328
- }
2329
-
2330
-
2331
- .vjs-custom-big-mute.vjs-control.tl{
2332
- top: 0;
2333
- left: 0;
2334
- margin: 15px 0 0 15px;
2335
- }
2336
-
2337
- .vjs-custom-big-mute.vjs-control.hide{
2338
- display: none !important;
2339
-
2340
- }
2341
-
2342
- .vjs-custom-big-mute.vjs-control > svg {
2343
- color: #071d39;
2344
- height: 22px;
2345
- width: 22px;
2346
- }
2347
-
2348
-
2349
2349
  /* nextep — up-next card (centered in player, scales with player size) */
2350
2350
  .video-js:has(.next-ep-preview),
2351
2351
  .video-js:has(.next-ep-preview-player-thumb) {