@viewlift/player-backup 2.0.284-backup → 2.0.286-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 (104) hide show
  1. package/cjs/autoNextVideo-6cab8d20.js +1 -0
  2. package/cjs/bundle.css +840 -627
  3. package/cjs/{caption-settings-544fd444.js → caption-settings-058ad013.js} +1 -1
  4. package/cjs/{captions-80f6eb66.js → captions-d98c49d6.js} +1 -1
  5. package/cjs/{features-90760526.js → features-d42cd8c1.js} +1 -1
  6. package/cjs/generic-9239e4ef.js +1 -0
  7. package/cjs/{index-0cb8083b.js → index-50e69a99.js} +1 -1
  8. package/cjs/{index-ee7aefc5.js → index-5daec8dc.js} +1 -1
  9. package/cjs/index-add7cff5.js +1 -0
  10. package/cjs/index.js +1 -1
  11. package/cjs/{multicamv2-7a2f60f1.js → multicamv2-1af47226.js} +1 -1
  12. package/cjs/{multicamv2-ee93bf7c.js → multicamv2-b1a591f5.js} +1 -1
  13. package/cjs/{nextEpisodeButton-9b032064.js → nextEpisodeButton-f6da5f9e.js} +1 -1
  14. package/cjs/playlist-25247b47.js +1 -0
  15. package/cjs/relatedVideosManager-88017db2.js +1 -0
  16. package/cjs/{renditions-d28715a3.js → renditions-6554142b.js} +1 -1
  17. package/cjs/{resolution-948774b8.js → resolution-4c007d14.js} +1 -1
  18. package/cjs/{series-31cb5b5e.js → series-c6abeb2a.js} +1 -1
  19. package/cjs/series-v2-370da4d6.js +1 -0
  20. package/cjs/series-v2-a347f3f7.js +1 -0
  21. package/cjs/{settings-icon-7a7e7810.js → settings-icon-0dcc3788.js} +1 -1
  22. package/cjs/{skin-a54370b0.js → skin-0a5108bb.js} +1 -1
  23. package/cjs/skin-47343a57.js +1 -0
  24. package/cjs/skin-56d77491.js +1 -0
  25. package/cjs/skin-71dbfc33.js +1 -0
  26. package/cjs/skin-89ad761c.js +1 -0
  27. package/cjs/{skin-a7446a3b.js → skin-a904ce92.js} +1 -1
  28. package/cjs/skin-cebece82.js +1 -0
  29. package/cjs/{skin-b151359d.js → skin-dfd8c833.js} +1 -1
  30. package/cjs/{skin-c97f0eea.js → skin-e0cf4554.js} +1 -1
  31. package/cjs/{skin-a193390e.js → skin-f3a5fe3d.js} +1 -1
  32. package/cjs/util-9e6f986e.js +1 -0
  33. package/cjs/videoSelector-24f40272.js +1 -0
  34. package/cjs/videoSelector-f49496de.js +1 -0
  35. package/esm/autoNextVideo-be06e737.js +1 -0
  36. package/esm/bundle.css +840 -627
  37. package/esm/{caption-settings-106547c2.js → caption-settings-a9b6581e.js} +1 -1
  38. package/esm/{captions-2b4caf69.js → captions-9659ee8f.js} +1 -1
  39. package/esm/components/auto-next-video/autoNextVideo.d.ts +1 -0
  40. package/esm/components/video-selector/videoSelector.d.ts +4 -0
  41. package/esm/components/video-selector_TEMP/videoSelector.d.ts +4 -0
  42. package/esm/{features-abc1af35.js → features-4a5d71b3.js} +1 -1
  43. package/esm/generic-5fc25fa4.js +1 -0
  44. package/esm/helpers/skin.d.ts +1 -1
  45. package/esm/{icons-699e8cf0.js → icons-262bef63.js} +1 -1
  46. package/esm/{index-7f9c8eec.js → index-b62e0f74.js} +1 -1
  47. package/esm/{index-209acda5.js → index-c9e6b4b1.js} +1 -1
  48. package/esm/index-d83589e3.js +1 -0
  49. package/esm/index.d.ts +6 -0
  50. package/esm/index.js +1 -1
  51. package/esm/{multicamv2-febf5390.js → multicamv2-85a146f1.js} +1 -1
  52. package/esm/{multicamv2-587a5bc1.js → multicamv2-a74f52dc.js} +1 -1
  53. package/esm/{nextEpisodeButton-9cb4a256.js → nextEpisodeButton-4d4f981f.js} +1 -1
  54. package/esm/playlist-de8dcaf0.js +1 -0
  55. package/esm/relatedVideosManager-33634c11.js +1 -0
  56. package/esm/{renditions-19f0b3a9.js → renditions-4eddc06a.js} +1 -1
  57. package/esm/{resolution-56c85eaf.js → resolution-5926bb20.js} +1 -1
  58. package/esm/{series-26c7f982.js → series-a6e346df.js} +1 -1
  59. package/esm/series-v2-58f8f89a.js +1 -0
  60. package/esm/series-v2-8e6a3475.js +1 -0
  61. package/esm/{settings-icon-0de53818.js → settings-icon-c4e124b8.js} +1 -1
  62. package/esm/{skin-96f7cd4c.js → skin-07c5b42b.js} +1 -1
  63. package/esm/{skin-1331a0e5.js → skin-132a3fbe.js} +1 -1
  64. package/esm/{skin-49365d5b.js → skin-30c770e0.js} +1 -1
  65. package/esm/{skin-c1f9b537.js → skin-5fd8f1a1.js} +1 -1
  66. package/esm/skin-80a68255.js +1 -0
  67. package/esm/skin-876554ba.js +1 -0
  68. package/esm/skin-900c1bca.js +1 -0
  69. package/esm/skin-97dd73c4.js +1 -0
  70. package/{cjs/skin-24348af6.js → esm/skin-ae76c8c8.js} +1 -1
  71. package/esm/skin-e2592aa4.js +1 -0
  72. package/esm/util-8d51abc3.js +1 -0
  73. package/esm/utilities/relatedVideosManager.d.ts +11 -0
  74. package/esm/videoSelector-11ca5611.js +1 -0
  75. package/esm/videoSelector-38875a2f.js +1 -0
  76. package/package.json +1 -4
  77. package/cjs/autoNextVideo-fe71c875.js +0 -1
  78. package/cjs/generic-b0efda72.js +0 -1
  79. package/cjs/index-3bdc6d4e.js +0 -1
  80. package/cjs/index-8c9f1a67.js +0 -1
  81. package/cjs/playlist-c9565f07.js +0 -1
  82. package/cjs/series-v2-66bb2be2.js +0 -1
  83. package/cjs/series-v2-e74b725b.js +0 -1
  84. package/cjs/skin-3dd98a5f.js +0 -1
  85. package/cjs/skin-667cd458.js +0 -1
  86. package/cjs/skin-90c61d0a.js +0 -1
  87. package/cjs/skin-cfd6c675.js +0 -1
  88. package/cjs/videoSelector-3f4ee7e2.js +0 -1
  89. package/cjs/videoSelector-c824876b.js +0 -1
  90. package/esm/autoNextVideo-efd28455.js +0 -1
  91. package/esm/generic-bd7427c4.js +0 -1
  92. package/esm/index-95713239.js +0 -1
  93. package/esm/index-c3dfd0f5.js +0 -1
  94. package/esm/playlist-92500990.js +0 -1
  95. package/esm/series-v2-5993fd16.js +0 -1
  96. package/esm/series-v2-c71b9a69.js +0 -1
  97. package/esm/skin-1b825a55.js +0 -1
  98. package/esm/skin-1c513653.js +0 -1
  99. package/esm/skin-4f84b841.js +0 -1
  100. package/esm/skin-5419c4aa.js +0 -1
  101. package/esm/skin-b0ba54c4.js +0 -1
  102. package/esm/skin-f6e1b28e.js +0 -1
  103. package/esm/videoSelector-aef83393.js +0 -1
  104. package/esm/videoSelector-f9366913.js +0 -1
package/cjs/bundle.css CHANGED
@@ -198,26 +198,31 @@
198
198
  }
199
199
  }
200
200
 
201
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
201
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
202
202
  font-size: 2.2em;
203
203
  line-height: 2.6;
204
204
  }
205
- .video-js.skin_mini{
206
- overflow: hidden;
205
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
206
+ background: #fcb700;
207
207
  }
208
- .video-js.skin_mini .vjs-control-bar{
208
+ .video-js.skin_news_live .vjs-control-bar{
209
209
  z-index: 1 !important;
210
- height: 4em !important;
210
+ height: 5em !important;
211
211
  background: black !important;
212
212
  }
213
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
214
+ display: flex;
215
+ align-items: center;
216
+ justify-content: center;
217
+ }
213
218
 
214
- .video-js.skin_mini .vjs-fade>* {
219
+ .video-js.skin_news_live .vjs-fade>* {
215
220
  visibility: hidden !important;
216
221
  opacity: 0 !important;
217
222
  transition: visibility 1s, opacity 1s !important;
218
223
  }
219
224
 
220
- .video-js.skin_mini .custom-spaced-progress-bar {
225
+ .video-js.skin_news_live .custom-spaced-progress-bar {
221
226
  position: absolute;
222
227
  width: 100%;
223
228
  display: flex;
@@ -225,7 +230,7 @@
225
230
  top: -0.5em;
226
231
  }
227
232
 
228
- .video-js.skin_mini .vjs-progress-control {
233
+ .video-js.skin_news_live .vjs-progress-control {
229
234
  /* left: -6px; */
230
235
  position: relative;
231
236
  width: 100%;
@@ -233,22 +238,25 @@
233
238
  transition: height 0.1s, top 0.1s;
234
239
  }
235
240
 
241
+ .video-js.skin_news_live .vjs-volume-panel{
242
+ min-width: 5.3em;
243
+ }
236
244
 
237
245
 
238
246
 
239
- .video-js.skin_mini .vjs-custom-control-spacer {
240
- display: block;
241
- flex: 1 1 auto;
247
+ .video-js.skin_news_live .vjs-custom-control-spacer {
248
+ /* display: block; */
249
+ /* flex: 1 1 auto; */
242
250
  }
243
251
 
244
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
252
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
245
253
  margin: 0 0px 0 0px;
246
254
  }
247
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
255
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
248
256
  display: none;
249
257
  }
250
258
 
251
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
259
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
252
260
  font-size: 14px;
253
261
  font-weight: 500;
254
262
  align-self: center;
@@ -257,207 +265,199 @@
257
265
  border-radius: 8px;
258
266
  }
259
267
 
260
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
261
- height: 5px !important;
268
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
269
+ height: 6px !important;
262
270
  }
263
271
 
264
- .video-js.skin_mini .vjs-play-progress:before {
265
- font-size: 1.3em;
272
+ .video-js.skin_news_live .vjs-play-progress:before {
273
+ font-size: 1.5em;
266
274
  line-height: unset;
267
275
  top: -0.3333333333em;
268
276
  }
269
277
 
270
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
278
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
271
279
  display: none !important;
272
280
  }
273
281
 
274
282
  /* */
275
- .video-js.skin_mini .vjs-mouse-display{
283
+ .video-js.skin_news_live .vjs-mouse-display{
276
284
  font-size: 1.6666666667em;
277
285
  }
278
286
 
279
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
287
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
280
288
  font-size: 1em !important;
281
289
  }
282
290
 
283
- .video-js.skin_mini .vjs-button{
284
- width: 3em;
291
+ .video-js.skin_news_live .vjs-button{
292
+ width: 5.3em;
285
293
  display: flex;
286
294
  align-items: center;
287
295
  justify-content: center;
288
296
  }
289
297
 
290
298
 
291
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
299
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
292
300
  .icon-maximize {
293
301
  display: block;
294
302
  height: 32px;
295
303
  }
296
304
 
297
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
305
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
298
306
  line-height: 4;
299
307
  }
300
308
 
301
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
309
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
302
310
  .icon-minimize {
303
311
  display: none;
304
312
  height: 32px;
305
313
  }
306
314
 
307
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
315
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
308
316
  outline: none !important;
317
+ /* flex: 1; */
309
318
  }
310
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
319
+ .video-js.skin_news_live .vjs-play-toggle-container{
320
+ display: flex;
321
+ flex: 1;
322
+ justify-content: center;
323
+ }
324
+
325
+
326
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
311
327
  .vjs-icon-fullscreen-enter:before {
312
328
  /* content: '' !important; */
313
329
  }
314
330
 
315
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
331
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
316
332
  display: flex;
317
333
  justify-content: center;
318
334
  align-items: center;
319
335
  /* transform: rotate(90deg); */
320
336
  }
321
337
 
322
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
338
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
323
339
  display: none;
324
340
  }
325
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
341
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
326
342
  margin-left: -10px;
327
- display: none;
328
- }
329
-
330
- .video-js.skin_mini .vjs-loading-spinner {
331
- position: absolute;
332
- top: 50%;
333
- left: 50%;
334
- transform: translate(-50%, -50%);
335
- opacity: .85;
336
- text-align: left;
337
- border: .2em solid rgba(43, 51, 63, .7);
338
- box-sizing: border-box;
339
- background-clip: padding-box;
340
- width: 3em;
341
- height: 3em;
342
- border-radius: 50%;
343
- visibility: hidden;
344
343
  }
345
344
 
346
- .video-js.skin_mini .skipbtn:hover{
345
+ .video-js.skin_news_live .skipbtn:hover{
347
346
  cursor: pointer;
348
347
  }
349
348
 
350
- .video-js.skin_mini .rewindbtn:hover{
349
+ .video-js.skin_news_live .rewindbtn:hover{
351
350
  cursor: pointer;
352
351
  }
353
352
 
354
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
353
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
355
354
  position: relative;
356
355
  padding-left: 0;
357
356
  }
358
357
 
359
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
360
- width: 40px;
361
- height: 40px;
362
- display: flex;
363
- justify-content: center;
364
- align-items: center;
365
- border: none;
366
- position: absolute;
367
- top: 0;
368
- left: 0;
369
- right: 0;
370
- bottom: 0;
371
- margin: auto;
372
- font-size: 3em;
373
- line-height: 1.3em;
374
- transform: none !important;
375
- border-radius: 1.3em;
358
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
359
+ display: none !important;
376
360
  }
377
361
 
378
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
362
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
363
+ /* width: 90px;
364
+ height: 90px;
365
+ display: flex;
366
+ justify-content: center;
367
+ align-items: center;
368
+ border-radius: 50%;
369
+ position: absolute;
370
+ top: 0;
371
+ left: 0;
372
+ right: 0;
373
+ bottom: 0;
374
+ margin: auto;
375
+ font-size: 6em;
376
+ line-height: 1.4em;
377
+ border: 0.05em solid;
378
+ color: inherit; */
379
+ display: none !important;
380
+ }
381
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
379
382
  font-weight: bold;
380
383
  }
381
384
 
382
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
383
- bottom: 1.1em !important;
384
- right: 1em;
385
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
386
+ bottom: 2.4em !important;
387
+ right: -1em;
385
388
  z-index: 1;
386
- font-size: 10px;
387
389
  }
388
390
 
389
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
391
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
390
392
  width: 24px !important;
391
393
  height: 24px !important;
392
394
  }
393
- .video-js.skin_mini .settings-selector-icon>svg{
395
+ .settings-selector-icon>svg{
394
396
  height: 19px !important;
395
397
  width: 19px !important;
396
398
  }
397
399
 
398
400
 
399
- .video-js.skin_mini button.vjs-rewind-button{
401
+ .video-js.skin_news_live button.vjs-rewind-button{
400
402
  cursor: pointer;
401
403
  }
402
404
 
403
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
405
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
404
406
  padding-right: 0;
407
+ display: none;
405
408
  }
406
409
 
407
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
410
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
408
411
  padding-left: 0;
412
+ display: none;
409
413
  }
410
414
 
411
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
415
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
412
416
  padding-left: 0;
413
417
  padding-right: 0;
414
- display: flex;
415
- justify-content: center;
416
- width: min-content;
418
+ display: none;
417
419
  }
418
420
 
419
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
421
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
420
422
  display: none
421
423
  }
422
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
424
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
423
425
  display: none
424
426
  }
425
427
 
426
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
427
- display: flex;
428
- align-items: center;
429
- font-weight: 700;
430
- font-size: 9px;
431
- min-width: 0.8em;
432
- padding-left: 0;
428
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
429
+ display: flex;
430
+ align-items: center;
431
+ font-weight: 700;
432
+ font-size: 12px;
433
+ min-width: 1.2em;
433
434
  }
434
435
 
435
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
436
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
436
437
  display: none;
437
438
  font-size: 11px;
438
439
  justify-content: center;
439
440
  align-items: center;
440
441
  user-select: none;
441
442
  }
442
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
443
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
443
444
  display: none;
444
445
  }
445
446
 
446
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
447
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
447
448
  height: min-content;
448
449
  width: min-content;
449
450
  }
450
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
451
- width: 3em;
452
- margin-right: 4px;
451
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
452
+ width: 6em;
453
453
  }
454
454
 
455
- .video-js.skin_mini .content{
455
+ .video-js.skin_news_live .content{
456
456
  bottom: 3.4rem !important;
457
457
  right: -4rem !important;
458
458
  }
459
459
 
460
- .video-js.skin_mini .setting-icon > svg{
460
+ .setting-icon > svg{
461
461
  height:18px !important;
462
462
  }
463
463
 
@@ -471,16 +471,16 @@
471
471
  pointer-events:none
472
472
  }
473
473
 
474
- .video-js.skin_mini iframe{
474
+ .video-js.skin_news_live iframe{
475
475
  width: 100%;
476
476
  height: 100%;
477
477
  }
478
478
 
479
- .video-js.skin_mini .vjs-live-control{
479
+ .video-js.skin_news_live .vjs-live-control{
480
480
  align-items: center;
481
- max-width: 5em;
481
+ display: none;
482
482
  }
483
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
483
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
484
484
  height: 2.2em;
485
485
  display: flex;
486
486
  align-items: center;
@@ -488,212 +488,240 @@
488
488
  width: 4em;
489
489
  justify-content: center;
490
490
  background: red;
491
- margin: 4px 0px 4px 2px;
491
+ margin: 4px 0px 4px 12px;
492
492
  }
493
493
 
494
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
494
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
495
495
  text-shadow: none;
496
496
  }
497
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
498
- display: none;
499
- font-size: 12px;
500
- }
501
497
 
502
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
503
- height: 1.8em;
504
- display: inline-flex;
505
- align-items: center;
506
- font-family: monospace;
498
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
499
+ display: flex;
507
500
  justify-content: center;
508
- border: 1.5px solid;
509
- margin: 4px 0px 4px 2px;
510
- white-space: pre;
511
- padding: 2px 4px;
512
- font-size: 1.2em;
513
- font-weight: 500;
514
- color: rgba(255, 255, 2555, 0.7);
501
+ min-width: 5.3em;
502
+ pointer-events: none;
503
+ user-select: none;
515
504
  }
516
505
 
517
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
518
- content: "NOT LIVE";
519
- word-spacing: -4px;
506
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
507
+ color: white;
520
508
  }
521
509
 
522
510
 
523
- @media(max-width:600px){
511
+ .settings-selection.vjs-control.vjs-button{
512
+ display: flex !important;
513
+ }
514
+
515
+ @media(max-width:576px){
516
+ .settings-selection.vjs-control.vjs-button{
517
+ display: none !important;
518
+ }
519
+ }
520
+
521
+
522
+ @media(max-width:576px){
524
523
  .tvProviderImage{
525
524
  display: none
526
525
  }
527
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
526
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
528
527
  .icon-maximize {
529
528
  height: 30px !important;
530
529
  }
531
530
 
532
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
531
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
533
532
  .icon-minimize {
534
533
  height: 30px !important;
535
534
  }
536
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
537
- width: 3.5em;
538
- }
539
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
535
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
536
+ width: 4.5em;
537
+ }
538
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
540
539
  height: min-content;
541
540
  }
542
541
 
543
- .video-js.skin_mini button.vjs-slowmo-button{
542
+ .video-js.skin_news_live button.vjs-slowmo-button{
544
543
  display: none;
545
544
  }
546
- .video-js.skin_mini button.vjs-rewind-button{
545
+ .video-js.skin_news_live button.vjs-rewind-button{
547
546
  display: none;
548
547
  }
549
- .video-js.skin_mini button.vjs-rewind-button>svg{
548
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
550
549
  height: 20px;
551
550
  }
552
- .video-js.skin_mini .vjs-button{
553
- width: 3em;
551
+ .video-js.skin_news_live .vjs-button{
552
+ width: 4.8em;
554
553
  }
555
- .video-js.skin_mini .widget-selection{
554
+ .video-js.skin_news_live .widget-selection{
556
555
  display: none;
557
556
  }
558
- .video-js.skin_mini .container{
557
+ .video-js.skin_news_live .container{
559
558
  display: none !important;
560
559
  }
561
- .video-js.skin_mini .vjs-control-bar{
560
+ .video-js.skin_news_live .vjs-control-bar{
562
561
  height: 4em !important;
563
562
  }
564
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
563
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
565
564
  font-size: 2.5em;
566
565
  line-height: 1.5;
567
566
  }
568
- .video-js.skin_mini .vjs-play-progress:before {
567
+ .video-js.skin_news_live .vjs-play-progress:before {
569
568
  font-size: 1.2em;
570
569
  position: absolute;
571
570
  right: -0.5em;
572
571
  z-index: 1;
573
572
  }
574
- .video-js.skin_mini button.vjs-skip-button>svg{
573
+ .video-js.skin_news_live button.vjs-skip-button>svg{
575
574
  height: 20px;
576
575
  }
576
+ .video-js.skin_news_live button.vjs-big-play-button {
577
+ width: 50px !important;
578
+ height: 50px !important;
579
+ font-size: 2.1rem !important;
580
+ }
577
581
 
578
582
  .stream-selector-icon>svg{
579
583
  width: 24px;
580
584
  height: 24px;
581
585
  }
582
- .video-js.skin_mini .vjs-seek-to-live-text{
583
- font-size: 12px;
586
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
587
+ margin: 0 12px 0 12px;
584
588
  }
585
-
586
- .video-js.skin_mini .vjs-text-track-display-ttml span {
587
- color: white !important;
588
- font-size: 16px !important;
589
- background-color: rgba(0,0,0,0.2) !important;
590
- }
589
+ .video-js.skin_news_live .vjs-seek-to-live-text{
590
+ font-size: 12px;
591
591
  }
592
-
593
- .video-js.skin_mini .vjs-text-track-display-ttml span {
594
- color: white !important;
595
- font-size: 16px !important;
596
- background-color: rgba(0,0,0,0.2) !important;
592
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
593
+ margin: 0 12px 0 12px;
597
594
  }
598
-
599
- .video-js.skin_mini .vjs-text-track-display-ttml p {
600
- font-size: 18px !important;
601
595
  }
602
-
603
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
604
- margin-bottom: 1rem !important;
596
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
597
+ width: 90px;
598
+ height: 90px;
599
+ display: flex;
600
+ justify-content: center;
601
+ align-items: center;
602
+ border-radius: 50%;
603
+ position: absolute;
604
+ top: 0;
605
+ left: 0;
606
+ right: 0;
607
+ bottom: 0;
608
+ margin: auto;
609
+ font-size: 6em;
610
+ line-height: 1.4em;
605
611
  }
606
612
 
607
-
608
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
613
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
609
614
  display: flex;
610
615
  justify-content: center;
611
616
  align-items: center;
612
617
  height: 100%;
613
618
  transition: width 0.1s;
614
619
  }
615
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
616
- margin: 2px;
617
- }
618
620
 
619
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
621
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
620
622
  display: flex;
621
623
  justify-content: center;
622
624
  align-items: center;
623
625
  height: 100%;
624
626
  transition: width 0.1s;
625
627
  }
626
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
627
- display: grid;
628
- font-size: 10px;
629
- grid-template-columns: 1fr;
630
- grid-template-rows: 1fr;
631
- padding: 1px 0px 0 0px;
632
- margin: 0;
628
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
629
+ display: none !important;
633
630
  }
634
631
 
635
- @media (max-width: 600px) {
636
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
632
+ @media (max-width: 576px) {
633
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
637
634
  height: 5px !important;
638
635
  }
636
+ .video-js.skin_news_live button.vjs-big-play-button {
637
+ width: 50px !important;
638
+ height: 50px !important;
639
+ font-size: 2.1rem !important;
640
+ }
639
641
 
640
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
642
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
641
643
  display: none;
642
644
  }
645
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
646
+ bottom: 2.4em !important;
647
+ right: -1em;
648
+ z-index: 1;
649
+ }
650
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
651
+ display: none !important;
652
+ }
643
653
 
654
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
655
+ color: white !important;
656
+ font-size: 13px !important;
657
+ background-color: black !important;
658
+ }
644
659
  }
645
660
 
646
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
647
- content: none !important;
648
- fill: none !important;
649
- filter: none !important;
661
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
662
+ width: 100% !important;
650
663
  }
651
664
 
652
- /* svg icons opacity and hover effect */
653
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
654
- opacity: 0.7 !important;
665
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
666
+ color: white !important;
667
+ font-size: 16px !important;
668
+ background-color: black !important;
655
669
  }
656
670
 
657
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
658
- opacity: 1 !important;
671
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
672
+ margin-bottom: 2rem !important;
659
673
  }
660
674
 
661
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
675
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
676
+ font-size: 18px !important;
677
+ }
678
+
679
+
680
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
681
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
682
+ font-size: 1.2em !important;
683
+ line-height: 1.5em !important;
684
+ padding: 0.2em 0.8em !important;
685
+ }
686
+
687
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
688
+ content: none !important;
689
+ fill: none !important;
690
+ filter: none !important;
691
+ }
692
+
693
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
662
694
  color: rgba(255, 255, 2555, 0.7)!important;
663
695
  }
664
696
 
665
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
697
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
666
698
  color: rgba(255, 255, 2555, 1)!important;
667
699
  }
668
700
 
669
701
 
670
702
 
671
703
 
672
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
704
+
705
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
673
706
  font-size: 2.2em;
674
707
  line-height: 2.6;
675
708
  }
676
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
677
- background: white;
709
+ .video-js.skin_mini{
710
+ overflow: hidden;
678
711
  }
679
- .video-js.skin_news .vjs-control-bar{
712
+ .video-js.skin_mini .vjs-control-bar{
680
713
  z-index: 1 !important;
681
- height: 5em !important;
714
+ height: 4em !important;
682
715
  background: black !important;
683
716
  }
684
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
685
- display: flex;
686
- align-items: center;
687
- justify-content: center;
688
- }
689
717
 
690
- .video-js.skin_news .vjs-fade>* {
718
+ .video-js.skin_mini .vjs-fade>* {
691
719
  visibility: hidden !important;
692
720
  opacity: 0 !important;
693
721
  transition: visibility 1s, opacity 1s !important;
694
722
  }
695
723
 
696
- .video-js.skin_news .custom-spaced-progress-bar {
724
+ .video-js.skin_mini .custom-spaced-progress-bar {
697
725
  position: absolute;
698
726
  width: 100%;
699
727
  display: flex;
@@ -701,7 +729,7 @@
701
729
  top: -0.5em;
702
730
  }
703
731
 
704
- .video-js.skin_news .vjs-progress-control {
732
+ .video-js.skin_mini .vjs-progress-control {
705
733
  /* left: -6px; */
706
734
  position: relative;
707
735
  width: 100%;
@@ -712,19 +740,19 @@
712
740
 
713
741
 
714
742
 
715
- .video-js.skin_news .vjs-custom-control-spacer {
743
+ .video-js.skin_mini .vjs-custom-control-spacer {
716
744
  display: block;
717
745
  flex: 1 1 auto;
718
746
  }
719
747
 
720
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
748
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
721
749
  margin: 0 0px 0 0px;
722
750
  }
723
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
751
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
724
752
  display: none;
725
753
  }
726
754
 
727
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
755
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
728
756
  font-size: 14px;
729
757
  font-weight: 500;
730
758
  align-self: center;
@@ -733,143 +761,158 @@
733
761
  border-radius: 8px;
734
762
  }
735
763
 
736
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
737
- height: 6px !important;
764
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
765
+ height: 5px !important;
738
766
  }
739
767
 
740
- .video-js.skin_news .vjs-play-progress:before {
741
- font-size: 1.5em;
768
+ .video-js.skin_mini .vjs-play-progress:before {
769
+ font-size: 1.3em;
742
770
  line-height: unset;
743
771
  top: -0.3333333333em;
744
772
  }
745
773
 
746
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
774
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
747
775
  display: none !important;
748
776
  }
749
777
 
750
778
  /* */
751
- .video-js.skin_news .vjs-mouse-display{
779
+ .video-js.skin_mini .vjs-mouse-display{
752
780
  font-size: 1.6666666667em;
753
781
  }
754
782
 
755
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
783
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
756
784
  font-size: 1em !important;
757
785
  }
758
786
 
759
- .video-js.skin_news .vjs-button{
760
- width: 5.3em;
787
+ .video-js.skin_mini .vjs-button{
788
+ width: 3em;
761
789
  display: flex;
762
790
  align-items: center;
763
791
  justify-content: center;
764
792
  }
765
793
 
766
794
 
767
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
795
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
768
796
  .icon-maximize {
769
797
  display: block;
770
798
  height: 32px;
771
799
  }
772
800
 
773
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
801
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
774
802
  line-height: 4;
775
803
  }
776
804
 
777
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
805
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
778
806
  .icon-minimize {
779
807
  display: none;
780
808
  height: 32px;
781
809
  }
782
810
 
783
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
811
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
784
812
  outline: none !important;
785
813
  }
786
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
814
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
787
815
  .vjs-icon-fullscreen-enter:before {
788
816
  /* content: '' !important; */
789
817
  }
790
818
 
791
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
819
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
792
820
  display: flex;
793
821
  justify-content: center;
794
822
  align-items: center;
795
823
  /* transform: rotate(90deg); */
796
824
  }
797
825
 
798
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
826
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
799
827
  display: none;
800
828
  }
801
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
829
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
802
830
  margin-left: -10px;
831
+ display: none;
803
832
  }
804
833
 
805
- .video-js.skin_news .skipbtn:hover{
834
+ .video-js.skin_mini .vjs-loading-spinner {
835
+ position: absolute;
836
+ top: 50%;
837
+ left: 50%;
838
+ transform: translate(-50%, -50%);
839
+ opacity: .85;
840
+ text-align: left;
841
+ border: .2em solid rgba(43, 51, 63, .7);
842
+ box-sizing: border-box;
843
+ background-clip: padding-box;
844
+ width: 3em;
845
+ height: 3em;
846
+ border-radius: 50%;
847
+ visibility: hidden;
848
+ }
849
+
850
+ .video-js.skin_mini .skipbtn:hover{
806
851
  cursor: pointer;
807
852
  }
808
853
 
809
- .video-js.skin_news .rewindbtn:hover{
854
+ .video-js.skin_mini .rewindbtn:hover{
810
855
  cursor: pointer;
811
856
  }
812
857
 
813
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
858
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
814
859
  position: relative;
815
860
  padding-left: 0;
816
861
  }
817
862
 
818
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
819
- display: none !important;
863
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
864
+ width: 40px;
865
+ height: 40px;
866
+ display: flex;
867
+ justify-content: center;
868
+ align-items: center;
869
+ border: none;
870
+ position: absolute;
871
+ top: 0;
872
+ left: 0;
873
+ right: 0;
874
+ bottom: 0;
875
+ margin: auto;
876
+ font-size: 3em;
877
+ line-height: 1.3em;
878
+ transform: none !important;
879
+ border-radius: 1.3em;
820
880
  }
821
881
 
822
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
823
- width: 90px;
824
- height: 90px;
825
- display: flex;
826
- justify-content: center;
827
- align-items: center;
828
- border-radius: 50%;
829
- position: absolute;
830
- top: 0;
831
- left: 0;
832
- right: 0;
833
- bottom: 0;
834
- margin: auto;
835
- font-size: 6em;
836
- line-height: 1.4em;
837
- border: 0.05em solid;
838
- color: inherit;
839
- }
840
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
882
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
841
883
  font-weight: bold;
842
884
  }
843
885
 
844
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
845
- bottom: 2.4em !important;
846
- right: -1em;
886
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
887
+ bottom: 1.1em !important;
888
+ right: 1em;
847
889
  z-index: 1;
890
+ font-size: 10px;
848
891
  }
849
892
 
850
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
893
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
851
894
  width: 24px !important;
852
895
  height: 24px !important;
853
896
  }
854
- .settings-selector-icon>svg{
897
+ .video-js.skin_mini .settings-selector-icon>svg{
855
898
  height: 19px !important;
856
899
  width: 19px !important;
857
900
  }
858
901
 
859
902
 
860
- .video-js.skin_news button.vjs-rewind-button{
903
+ .video-js.skin_mini button.vjs-rewind-button{
861
904
  cursor: pointer;
862
905
  }
863
906
 
864
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
907
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
865
908
  padding-right: 0;
866
909
  }
867
910
 
868
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
911
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
869
912
  padding-left: 0;
870
913
  }
871
914
 
872
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
915
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
873
916
  padding-left: 0;
874
917
  padding-right: 0;
875
918
  display: flex;
@@ -877,46 +920,48 @@
877
920
  width: min-content;
878
921
  }
879
922
 
880
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
923
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
881
924
  display: none
882
925
  }
883
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
926
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
884
927
  display: none
885
928
  }
886
929
 
887
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
888
- display: flex;
889
- align-items: center;
890
- font-weight: 700;
891
- font-size: 12px;
892
- min-width: 1.2em;
930
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
931
+ display: flex;
932
+ align-items: center;
933
+ font-weight: 700;
934
+ font-size: 9px;
935
+ min-width: 0.8em;
936
+ padding-left: 0;
893
937
  }
894
938
 
895
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
939
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
896
940
  display: none;
897
941
  font-size: 11px;
898
942
  justify-content: center;
899
943
  align-items: center;
900
944
  user-select: none;
901
945
  }
902
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
946
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
903
947
  display: none;
904
948
  }
905
949
 
906
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
950
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
907
951
  height: min-content;
908
952
  width: min-content;
909
953
  }
910
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
911
- width: 6em;
954
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
955
+ width: 3em;
956
+ margin-right: 4px;
912
957
  }
913
958
 
914
- .video-js.skin_news .content{
959
+ .video-js.skin_mini .content{
915
960
  bottom: 3.4rem !important;
916
961
  right: -4rem !important;
917
962
  }
918
963
 
919
- .setting-icon > svg{
964
+ .video-js.skin_mini .setting-icon > svg{
920
965
  height:18px !important;
921
966
  }
922
967
 
@@ -930,15 +975,16 @@
930
975
  pointer-events:none
931
976
  }
932
977
 
933
- .video-js.skin_news iframe{
978
+ .video-js.skin_mini iframe{
934
979
  width: 100%;
935
980
  height: 100%;
936
981
  }
937
982
 
938
- .video-js.skin_news .vjs-live-control{
983
+ .video-js.skin_mini .vjs-live-control{
939
984
  align-items: center;
985
+ max-width: 5em;
940
986
  }
941
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
987
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
942
988
  height: 2.2em;
943
989
  display: flex;
944
990
  align-items: center;
@@ -946,282 +992,210 @@
946
992
  width: 4em;
947
993
  justify-content: center;
948
994
  background: red;
949
- margin: 4px 0px 4px 12px;
995
+ margin: 4px 0px 4px 2px;
950
996
  }
951
997
 
952
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
998
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
953
999
  text-shadow: none;
954
1000
  }
955
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1001
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
956
1002
  display: none;
957
1003
  font-size: 12px;
958
1004
  }
959
1005
 
960
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
961
- height: 2.2em;
1006
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1007
+ height: 1.8em;
962
1008
  display: inline-flex;
963
1009
  align-items: center;
964
- /* font-family: monospace; */
1010
+ font-family: monospace;
965
1011
  justify-content: center;
966
- border: 2px solid;
967
- margin: 4px 0px 4px 6px;
1012
+ border: 1.5px solid;
1013
+ margin: 4px 0px 4px 2px;
968
1014
  white-space: pre;
969
- padding: 0px 6px;
1015
+ padding: 2px 4px;
970
1016
  font-size: 1.2em;
971
1017
  font-weight: 500;
972
1018
  color: rgba(255, 255, 2555, 0.7);
973
-
974
- letter-spacing: -.1px;
975
- line-height: normal;
976
- text-transform: uppercase;
977
- color: #FFFFFF;
978
- opacity: .7;
979
- font-family: "Proxima Nova";
980
- }
981
-
982
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
983
- opacity: 1;
984
1019
  }
985
1020
 
986
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1021
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
987
1022
  content: "NOT LIVE";
988
- }
989
-
990
- .settings-selection.vjs-control.vjs-button{
991
- display: flex !important;
992
- }
993
-
994
- @media(max-width:576px){
995
- .settings-selection.vjs-control.vjs-button{
996
- display: none !important;
997
- }
1023
+ word-spacing: -4px;
998
1024
  }
999
1025
 
1000
1026
 
1001
- @media(max-width:576px){
1027
+ @media(max-width:600px){
1002
1028
  .tvProviderImage{
1003
1029
  display: none
1004
1030
  }
1005
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1031
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1006
1032
  .icon-maximize {
1007
1033
  height: 30px !important;
1008
1034
  }
1009
1035
 
1010
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1036
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1011
1037
  .icon-minimize {
1012
1038
  height: 30px !important;
1013
1039
  }
1014
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1015
- width: 4.5em;
1040
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1041
+ width: 3.5em;
1016
1042
  }
1017
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1043
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1018
1044
  height: min-content;
1019
1045
  }
1020
1046
 
1021
- .video-js.skin_news button.vjs-slowmo-button{
1047
+ .video-js.skin_mini button.vjs-slowmo-button{
1022
1048
  display: none;
1023
1049
  }
1024
- .video-js.skin_news button.vjs-rewind-button{
1050
+ .video-js.skin_mini button.vjs-rewind-button{
1025
1051
  display: none;
1026
1052
  }
1027
- .video-js.skin_news button.vjs-rewind-button>svg{
1053
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1028
1054
  height: 20px;
1029
1055
  }
1030
- .video-js.skin_news .vjs-button{
1031
- width: 4.8em;
1056
+ .video-js.skin_mini .vjs-button{
1057
+ width: 3em;
1032
1058
  }
1033
- .video-js.skin_news .widget-selection{
1059
+ .video-js.skin_mini .widget-selection{
1034
1060
  display: none;
1035
1061
  }
1036
- .video-js.skin_news .container{
1062
+ .video-js.skin_mini .container{
1037
1063
  display: none !important;
1038
1064
  }
1039
- .video-js.skin_news .vjs-control-bar{
1065
+ .video-js.skin_mini .vjs-control-bar{
1040
1066
  height: 4em !important;
1041
1067
  }
1042
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1068
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1043
1069
  font-size: 2.5em;
1044
1070
  line-height: 1.5;
1045
1071
  }
1046
- .video-js.skin_news .vjs-play-progress:before {
1072
+ .video-js.skin_mini .vjs-play-progress:before {
1047
1073
  font-size: 1.2em;
1048
1074
  position: absolute;
1049
1075
  right: -0.5em;
1050
1076
  z-index: 1;
1051
1077
  }
1052
- .video-js.skin_news button.vjs-skip-button>svg{
1078
+ .video-js.skin_mini button.vjs-skip-button>svg{
1053
1079
  height: 20px;
1054
1080
  }
1055
- .video-js.skin_news button.vjs-big-play-button {
1056
- width: 50px !important;
1057
- height: 50px !important;
1058
- font-size: 2.1rem !important;
1059
- }
1060
1081
 
1061
1082
  .stream-selector-icon>svg{
1062
1083
  width: 24px;
1063
1084
  height: 24px;
1064
1085
  }
1065
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1066
- margin: 0 12px 0 12px;
1067
- }
1068
- .video-js.skin_news .vjs-seek-to-live-text{
1086
+ .video-js.skin_mini .vjs-seek-to-live-text{
1069
1087
  font-size: 12px;
1070
1088
  }
1071
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1072
- margin: 0 12px 0 12px;
1073
- }
1074
- }
1075
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1076
- width: 90px;
1077
- height: 90px;
1078
- display: flex;
1079
- justify-content: center;
1080
- align-items: center;
1081
- border-radius: 50%;
1082
- position: absolute;
1083
- top: 0;
1084
- left: 0;
1085
- right: 0;
1086
- bottom: 0;
1087
- margin: auto;
1088
- font-size: 6em;
1089
- line-height: 1.4em;
1090
- }
1091
-
1092
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1093
- display: flex;
1094
- justify-content: center;
1095
- align-items: center;
1096
- height: 100%;
1097
- transition: width 0.1s;
1098
- }
1099
1089
 
1100
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1101
- display: flex;
1102
- justify-content: center;
1103
- align-items: center;
1104
- height: 100%;
1105
- transition: width 0.1s;
1106
- }
1107
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1108
- display: none !important;
1109
- }
1110
- .video-js.skin_news .ssai-ad-container{
1111
- position: absolute;
1112
- bottom: 14px;
1113
- }
1114
-
1115
- @media (max-width: 576px) {
1116
- .video-js.skin_news .ssai-ad-container{
1117
- bottom: 2px;
1118
- }
1119
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1120
- height: 5px !important;
1121
- }
1122
- .video-js.skin_news button.vjs-big-play-button {
1123
- width: 50px !important;
1124
- height: 50px !important;
1125
- font-size: 2.1rem !important;
1090
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1091
+ color: white !important;
1092
+ font-size: 16px !important;
1093
+ background-color: rgba(0,0,0,0.2) !important;
1126
1094
  }
1095
+ }
1127
1096
 
1128
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1129
- display: none;
1130
- }
1131
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1132
- bottom: 2.4em !important;
1133
- right: -1em;
1134
- z-index: 1;
1097
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1098
+ color: white !important;
1099
+ font-size: 16px !important;
1100
+ background-color: rgba(0,0,0,0.2) !important;
1135
1101
  }
1136
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1137
- display: none !important;
1138
- }
1139
1102
 
1140
- .video-js.skin_news .vjs-text-track-display-ttml span {
1141
- color: white;
1142
- font-size: 13px;
1143
- background-color: black;
1144
- }
1103
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1104
+ font-size: 18px !important;
1145
1105
  }
1146
1106
 
1147
- .video-js.skin_news .vjs-text-track-display-ttml span {
1148
- color: white;
1149
- font-size: 16px;
1150
- background-color: black;
1107
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1108
+ margin-bottom: 1rem !important;
1151
1109
  }
1152
1110
 
1153
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1154
- margin-bottom: 2rem !important;
1111
+
1112
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1113
+ display: flex;
1114
+ justify-content: center;
1115
+ align-items: center;
1116
+ height: 100%;
1117
+ transition: width 0.1s;
1118
+ }
1119
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1120
+ margin: 2px;
1155
1121
  }
1156
1122
 
1157
- .video-js.skin_news .vjs-text-track-display-ttml p {
1158
- font-size: 18px !important;
1123
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1124
+ display: flex;
1125
+ justify-content: center;
1126
+ align-items: center;
1127
+ height: 100%;
1128
+ transition: width 0.1s;
1129
+ }
1130
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1131
+ display: grid;
1132
+ font-size: 10px;
1133
+ grid-template-columns: 1fr;
1134
+ grid-template-rows: 1fr;
1135
+ padding: 1px 0px 0 0px;
1136
+ margin: 0;
1159
1137
  }
1160
1138
 
1139
+ @media (max-width: 600px) {
1140
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1141
+ height: 5px !important;
1142
+ }
1143
+
1144
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1145
+ display: none;
1146
+ }
1161
1147
 
1162
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1163
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1164
- font-size: 1.2em !important;
1165
- line-height: 1.5em !important;
1166
- padding: 0.2em 0.8em !important;
1167
1148
  }
1168
1149
 
1169
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1150
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1170
1151
  content: none !important;
1171
1152
  fill: none !important;
1172
1153
  filter: none !important;
1173
1154
  }
1174
1155
 
1175
1156
  /* svg icons opacity and hover effect */
1176
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1157
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1177
1158
  opacity: 0.7 !important;
1178
1159
  }
1179
1160
 
1180
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1181
- opacity: 1 !important;
1182
- }
1183
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1184
- opacity: 0.7 !important;
1185
- }
1186
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1161
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1187
1162
  opacity: 1 !important;
1188
1163
  }
1189
1164
 
1190
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1165
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1191
1166
  color: rgba(255, 255, 2555, 0.7)!important;
1192
1167
  }
1193
1168
 
1194
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1169
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1195
1170
  color: rgba(255, 255, 2555, 1)!important;
1196
1171
  }
1197
1172
 
1198
1173
 
1199
-
1200
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1174
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1201
1175
  font-size: 2.2em;
1202
1176
  line-height: 2.6;
1203
1177
  }
1204
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1205
- background: #fcb700;
1178
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1179
+ background: white;
1206
1180
  }
1207
- .video-js.skin_news_live .vjs-control-bar{
1181
+ .video-js.skin_news .vjs-control-bar{
1208
1182
  z-index: 1 !important;
1209
1183
  height: 5em !important;
1210
1184
  background: black !important;
1211
1185
  }
1212
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1186
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1213
1187
  display: flex;
1214
1188
  align-items: center;
1215
1189
  justify-content: center;
1216
1190
  }
1217
1191
 
1218
- .video-js.skin_news_live .vjs-fade>* {
1192
+ .video-js.skin_news .vjs-fade>* {
1219
1193
  visibility: hidden !important;
1220
1194
  opacity: 0 !important;
1221
1195
  transition: visibility 1s, opacity 1s !important;
1222
1196
  }
1223
1197
 
1224
- .video-js.skin_news_live .custom-spaced-progress-bar {
1198
+ .video-js.skin_news .custom-spaced-progress-bar {
1225
1199
  position: absolute;
1226
1200
  width: 100%;
1227
1201
  display: flex;
@@ -1229,7 +1203,7 @@
1229
1203
  top: -0.5em;
1230
1204
  }
1231
1205
 
1232
- .video-js.skin_news_live .vjs-progress-control {
1206
+ .video-js.skin_news .vjs-progress-control {
1233
1207
  /* left: -6px; */
1234
1208
  position: relative;
1235
1209
  width: 100%;
@@ -1237,25 +1211,22 @@
1237
1211
  transition: height 0.1s, top 0.1s;
1238
1212
  }
1239
1213
 
1240
- .video-js.skin_news_live .vjs-volume-panel{
1241
- min-width: 5.3em;
1242
- }
1243
1214
 
1244
1215
 
1245
1216
 
1246
- .video-js.skin_news_live .vjs-custom-control-spacer {
1247
- /* display: block; */
1248
- /* flex: 1 1 auto; */
1217
+ .video-js.skin_news .vjs-custom-control-spacer {
1218
+ display: block;
1219
+ flex: 1 1 auto;
1249
1220
  }
1250
1221
 
1251
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1222
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1252
1223
  margin: 0 0px 0 0px;
1253
1224
  }
1254
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1225
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1255
1226
  display: none;
1256
1227
  }
1257
1228
 
1258
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1229
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1259
1230
  font-size: 14px;
1260
1231
  font-weight: 500;
1261
1232
  align-self: center;
@@ -1264,30 +1235,30 @@
1264
1235
  border-radius: 8px;
1265
1236
  }
1266
1237
 
1267
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1238
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1268
1239
  height: 6px !important;
1269
1240
  }
1270
1241
 
1271
- .video-js.skin_news_live .vjs-play-progress:before {
1242
+ .video-js.skin_news .vjs-play-progress:before {
1272
1243
  font-size: 1.5em;
1273
1244
  line-height: unset;
1274
1245
  top: -0.3333333333em;
1275
1246
  }
1276
1247
 
1277
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1248
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1278
1249
  display: none !important;
1279
1250
  }
1280
1251
 
1281
1252
  /* */
1282
- .video-js.skin_news_live .vjs-mouse-display{
1253
+ .video-js.skin_news .vjs-mouse-display{
1283
1254
  font-size: 1.6666666667em;
1284
1255
  }
1285
1256
 
1286
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1257
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1287
1258
  font-size: 1em !important;
1288
1259
  }
1289
1260
 
1290
- .video-js.skin_news_live .vjs-button{
1261
+ .video-js.skin_news .vjs-button{
1291
1262
  width: 5.3em;
1292
1263
  display: flex;
1293
1264
  align-items: center;
@@ -1295,71 +1266,63 @@
1295
1266
  }
1296
1267
 
1297
1268
 
1298
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1269
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1299
1270
  .icon-maximize {
1300
1271
  display: block;
1301
1272
  height: 32px;
1302
1273
  }
1303
1274
 
1304
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1275
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1305
1276
  line-height: 4;
1306
1277
  }
1307
1278
 
1308
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1279
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1309
1280
  .icon-minimize {
1310
1281
  display: none;
1311
1282
  height: 32px;
1312
1283
  }
1313
1284
 
1314
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1285
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1315
1286
  outline: none !important;
1316
- /* flex: 1; */
1317
- }
1318
- .video-js.skin_news_live .vjs-play-toggle-container{
1319
- display: flex;
1320
- flex: 1;
1321
- justify-content: center;
1322
1287
  }
1323
-
1324
-
1325
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1288
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1326
1289
  .vjs-icon-fullscreen-enter:before {
1327
1290
  /* content: '' !important; */
1328
1291
  }
1329
1292
 
1330
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1293
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1331
1294
  display: flex;
1332
1295
  justify-content: center;
1333
1296
  align-items: center;
1334
1297
  /* transform: rotate(90deg); */
1335
1298
  }
1336
1299
 
1337
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1300
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1338
1301
  display: none;
1339
1302
  }
1340
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1303
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1341
1304
  margin-left: -10px;
1342
1305
  }
1343
1306
 
1344
- .video-js.skin_news_live .skipbtn:hover{
1307
+ .video-js.skin_news .skipbtn:hover{
1345
1308
  cursor: pointer;
1346
1309
  }
1347
1310
 
1348
- .video-js.skin_news_live .rewindbtn:hover{
1311
+ .video-js.skin_news .rewindbtn:hover{
1349
1312
  cursor: pointer;
1350
1313
  }
1351
1314
 
1352
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1315
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1353
1316
  position: relative;
1354
1317
  padding-left: 0;
1355
1318
  }
1356
1319
 
1357
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1320
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1358
1321
  display: none !important;
1359
1322
  }
1360
1323
 
1361
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1362
- /* width: 90px;
1324
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1325
+ width: 90px;
1363
1326
  height: 90px;
1364
1327
  display: flex;
1365
1328
  justify-content: center;
@@ -1374,20 +1337,19 @@
1374
1337
  font-size: 6em;
1375
1338
  line-height: 1.4em;
1376
1339
  border: 0.05em solid;
1377
- color: inherit; */
1378
- display: none !important;
1340
+ color: inherit;
1379
1341
  }
1380
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1342
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1381
1343
  font-weight: bold;
1382
1344
  }
1383
1345
 
1384
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1346
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1385
1347
  bottom: 2.4em !important;
1386
1348
  right: -1em;
1387
1349
  z-index: 1;
1388
1350
  }
1389
1351
 
1390
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1352
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1391
1353
  width: 24px !important;
1392
1354
  height: 24px !important;
1393
1355
  }
@@ -1397,34 +1359,34 @@
1397
1359
  }
1398
1360
 
1399
1361
 
1400
- .video-js.skin_news_live button.vjs-rewind-button{
1362
+ .video-js.skin_news button.vjs-rewind-button{
1401
1363
  cursor: pointer;
1402
1364
  }
1403
1365
 
1404
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1366
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1405
1367
  padding-right: 0;
1406
- display: none;
1407
1368
  }
1408
1369
 
1409
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1370
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1410
1371
  padding-left: 0;
1411
- display: none;
1412
1372
  }
1413
1373
 
1414
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1374
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1415
1375
  padding-left: 0;
1416
1376
  padding-right: 0;
1417
- display: none;
1377
+ display: flex;
1378
+ justify-content: center;
1379
+ width: min-content;
1418
1380
  }
1419
1381
 
1420
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1382
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1421
1383
  display: none
1422
1384
  }
1423
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1385
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1424
1386
  display: none
1425
1387
  }
1426
1388
 
1427
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1389
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
1428
1390
  display: flex;
1429
1391
  align-items: center;
1430
1392
  font-weight: 700;
@@ -1432,26 +1394,26 @@
1432
1394
  min-width: 1.2em;
1433
1395
  }
1434
1396
 
1435
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1397
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1436
1398
  display: none;
1437
1399
  font-size: 11px;
1438
1400
  justify-content: center;
1439
1401
  align-items: center;
1440
1402
  user-select: none;
1441
1403
  }
1442
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1404
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1443
1405
  display: none;
1444
1406
  }
1445
1407
 
1446
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1408
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1447
1409
  height: min-content;
1448
1410
  width: min-content;
1449
1411
  }
1450
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1412
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1451
1413
  width: 6em;
1452
1414
  }
1453
1415
 
1454
- .video-js.skin_news_live .content{
1416
+ .video-js.skin_news .content{
1455
1417
  bottom: 3.4rem !important;
1456
1418
  right: -4rem !important;
1457
1419
  }
@@ -1470,16 +1432,15 @@
1470
1432
  pointer-events:none
1471
1433
  }
1472
1434
 
1473
- .video-js.skin_news_live iframe{
1435
+ .video-js.skin_news iframe{
1474
1436
  width: 100%;
1475
1437
  height: 100%;
1476
1438
  }
1477
1439
 
1478
- .video-js.skin_news_live .vjs-live-control{
1440
+ .video-js.skin_news .vjs-live-control{
1479
1441
  align-items: center;
1480
- display: none;
1481
1442
  }
1482
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1443
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1483
1444
  height: 2.2em;
1484
1445
  display: flex;
1485
1446
  align-items: center;
@@ -1490,22 +1451,43 @@
1490
1451
  margin: 4px 0px 4px 12px;
1491
1452
  }
1492
1453
 
1493
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1454
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1494
1455
  text-shadow: none;
1495
1456
  }
1457
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1458
+ display: none;
1459
+ font-size: 12px;
1460
+ }
1496
1461
 
1497
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1498
- display: flex;
1462
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1463
+ height: 2.2em;
1464
+ display: inline-flex;
1465
+ align-items: center;
1466
+ /* font-family: monospace; */
1499
1467
  justify-content: center;
1500
- min-width: 5.3em;
1501
- pointer-events: none;
1502
- user-select: none;
1468
+ border: 2px solid;
1469
+ margin: 4px 0px 4px 6px;
1470
+ white-space: pre;
1471
+ padding: 0px 6px;
1472
+ font-size: 1.2em;
1473
+ font-weight: 500;
1474
+ color: rgba(255, 255, 2555, 0.7);
1475
+
1476
+ letter-spacing: -.1px;
1477
+ line-height: normal;
1478
+ text-transform: uppercase;
1479
+ color: #FFFFFF;
1480
+ opacity: .7;
1481
+ font-family: "Proxima Nova";
1503
1482
  }
1504
1483
 
1505
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1506
- color: white;
1484
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1485
+ opacity: 1;
1507
1486
  }
1508
1487
 
1488
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1489
+ content: "NOT LIVE";
1490
+ }
1509
1491
 
1510
1492
  .settings-selection.vjs-control.vjs-button{
1511
1493
  display: flex !important;
@@ -1522,57 +1504,57 @@
1522
1504
  .tvProviderImage{
1523
1505
  display: none
1524
1506
  }
1525
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1507
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1526
1508
  .icon-maximize {
1527
1509
  height: 30px !important;
1528
1510
  }
1529
1511
 
1530
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1512
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1531
1513
  .icon-minimize {
1532
1514
  height: 30px !important;
1533
1515
  }
1534
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1516
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1535
1517
  width: 4.5em;
1536
1518
  }
1537
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1519
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1538
1520
  height: min-content;
1539
1521
  }
1540
1522
 
1541
- .video-js.skin_news_live button.vjs-slowmo-button{
1523
+ .video-js.skin_news button.vjs-slowmo-button{
1542
1524
  display: none;
1543
1525
  }
1544
- .video-js.skin_news_live button.vjs-rewind-button{
1526
+ .video-js.skin_news button.vjs-rewind-button{
1545
1527
  display: none;
1546
1528
  }
1547
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1529
+ .video-js.skin_news button.vjs-rewind-button>svg{
1548
1530
  height: 20px;
1549
1531
  }
1550
- .video-js.skin_news_live .vjs-button{
1532
+ .video-js.skin_news .vjs-button{
1551
1533
  width: 4.8em;
1552
1534
  }
1553
- .video-js.skin_news_live .widget-selection{
1535
+ .video-js.skin_news .widget-selection{
1554
1536
  display: none;
1555
1537
  }
1556
- .video-js.skin_news_live .container{
1538
+ .video-js.skin_news .container{
1557
1539
  display: none !important;
1558
1540
  }
1559
- .video-js.skin_news_live .vjs-control-bar{
1541
+ .video-js.skin_news .vjs-control-bar{
1560
1542
  height: 4em !important;
1561
1543
  }
1562
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1544
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1563
1545
  font-size: 2.5em;
1564
1546
  line-height: 1.5;
1565
1547
  }
1566
- .video-js.skin_news_live .vjs-play-progress:before {
1548
+ .video-js.skin_news .vjs-play-progress:before {
1567
1549
  font-size: 1.2em;
1568
1550
  position: absolute;
1569
1551
  right: -0.5em;
1570
1552
  z-index: 1;
1571
1553
  }
1572
- .video-js.skin_news_live button.vjs-skip-button>svg{
1554
+ .video-js.skin_news button.vjs-skip-button>svg{
1573
1555
  height: 20px;
1574
1556
  }
1575
- .video-js.skin_news_live button.vjs-big-play-button {
1557
+ .video-js.skin_news button.vjs-big-play-button {
1576
1558
  width: 50px !important;
1577
1559
  height: 50px !important;
1578
1560
  font-size: 2.1rem !important;
@@ -1582,17 +1564,17 @@
1582
1564
  width: 24px;
1583
1565
  height: 24px;
1584
1566
  }
1585
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1567
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1586
1568
  margin: 0 12px 0 12px;
1587
1569
  }
1588
- .video-js.skin_news_live .vjs-seek-to-live-text{
1570
+ .video-js.skin_news .vjs-seek-to-live-text{
1589
1571
  font-size: 12px;
1590
1572
  }
1591
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1573
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1592
1574
  margin: 0 12px 0 12px;
1593
1575
  }
1594
1576
  }
1595
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1577
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1596
1578
  width: 90px;
1597
1579
  height: 90px;
1598
1580
  display: flex;
@@ -1609,7 +1591,7 @@
1609
1591
  line-height: 1.4em;
1610
1592
  }
1611
1593
 
1612
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1594
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1613
1595
  display: flex;
1614
1596
  justify-content: center;
1615
1597
  align-items: center;
@@ -1617,22 +1599,29 @@
1617
1599
  transition: width 0.1s;
1618
1600
  }
1619
1601
 
1620
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1602
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1621
1603
  display: flex;
1622
1604
  justify-content: center;
1623
1605
  align-items: center;
1624
1606
  height: 100%;
1625
1607
  transition: width 0.1s;
1626
1608
  }
1627
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1609
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1628
1610
  display: none !important;
1629
1611
  }
1612
+ .video-js.skin_news .ssai-ad-container{
1613
+ position: absolute;
1614
+ bottom: 14px;
1615
+ }
1630
1616
 
1631
1617
  @media (max-width: 576px) {
1632
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1618
+ .video-js.skin_news .ssai-ad-container{
1619
+ bottom: 2px;
1620
+ }
1621
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1633
1622
  height: 5px !important;
1634
1623
  }
1635
- .video-js.skin_news_live button.vjs-big-play-button {
1624
+ .video-js.skin_news button.vjs-big-play-button {
1636
1625
  width: 50px !important;
1637
1626
  height: 50px !important;
1638
1627
  font-size: 2.1rem !important;
@@ -1641,59 +1630,70 @@
1641
1630
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1642
1631
  display: none;
1643
1632
  }
1644
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1633
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1645
1634
  bottom: 2.4em !important;
1646
1635
  right: -1em;
1647
1636
  z-index: 1;
1648
1637
  }
1649
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1638
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1650
1639
  display: none !important;
1651
1640
  }
1652
1641
 
1653
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1642
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1654
1643
  color: white !important;
1655
1644
  font-size: 13px !important;
1656
1645
  background-color: black !important;
1657
1646
  }
1658
1647
  }
1659
1648
 
1660
- .video-js.skin_news_live .vjs-text-track-display-ttml {
1661
- width: 100% !important;
1662
- }
1663
-
1664
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1649
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1665
1650
  color: white !important;
1666
1651
  font-size: 16px !important;
1667
1652
  background-color: black !important;
1668
1653
  }
1669
1654
 
1670
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1655
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1671
1656
  margin-bottom: 2rem !important;
1672
1657
  }
1673
1658
 
1674
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
1659
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1675
1660
  font-size: 18px !important;
1676
1661
  }
1677
1662
 
1678
1663
 
1679
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1680
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1664
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1665
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1681
1666
  font-size: 1.2em !important;
1682
1667
  line-height: 1.5em !important;
1683
1668
  padding: 0.2em 0.8em !important;
1684
1669
  }
1685
1670
 
1686
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1671
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1687
1672
  content: none !important;
1688
1673
  fill: none !important;
1689
1674
  filter: none !important;
1690
1675
  }
1691
1676
 
1692
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1677
+ /* svg icons opacity and hover effect */
1678
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1679
+ opacity: 0.7 !important;
1680
+ }
1681
+
1682
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1683
+ opacity: 1 !important;
1684
+ }
1685
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1686
+ opacity: 0.7 !important;
1687
+ }
1688
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1689
+ opacity: 1 !important;
1690
+ }
1691
+
1692
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1693
1693
  color: rgba(255, 255, 2555, 0.7)!important;
1694
1694
  }
1695
1695
 
1696
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1696
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1697
1697
  color: rgba(255, 255, 2555, 1)!important;
1698
1698
  }
1699
1699
 
@@ -1878,6 +1878,10 @@
1878
1878
 
1879
1879
 
1880
1880
 
1881
+
1882
+
1883
+
1884
+
1881
1885
  .video-js .multicamera-parent.default{
1882
1886
  height: 345px;
1883
1887
  position: absolute;
@@ -1958,10 +1962,6 @@
1958
1962
 
1959
1963
 
1960
1964
 
1961
-
1962
-
1963
-
1964
-
1965
1965
  .vjs-custom-big-mute.vjs-control{
1966
1966
  position: absolute;
1967
1967
  align-items: center;
@@ -2010,81 +2010,326 @@
2010
2010
  width: 22px;
2011
2011
  }
2012
2012
 
2013
- /* nextep */
2014
- .next-ep-preview{
2013
+ /* nextep — up-next card (centered in player, scales with player size) */
2014
+ .video-js:has(.next-ep-preview),
2015
+ .video-js:has(.next-ep-preview-player-thumb) {
2016
+ position: relative;
2017
+ }
2018
+
2019
+ .next-ep-preview {
2020
+ container-type: inline-size;
2021
+ container-name: next-ep-preview;
2022
+
2015
2023
  position: absolute;
2016
- height: min-content;
2017
- width: 300px;
2018
- bottom: 16%;
2019
- right: 1.5%;
2020
- padding: 13px;
2024
+ top: 50%;
2025
+ left: 50%;
2026
+ right: auto;
2027
+ bottom: auto;
2028
+ transform: translate(-50%, -50%);
2029
+ z-index: 15;
2030
+
2031
+ box-sizing: border-box;
2032
+ width: min(92%, 16rem);
2033
+ max-width: calc(100% - 1.5rem);
2034
+ max-height: min(90%, 100%);
2035
+ overflow: auto;
2036
+ overscroll-behavior: contain;
2037
+
2038
+ padding: clamp(0.625rem, 3.5cqi, 1rem) clamp(0.75rem, 4cqi, 1rem);
2039
+ border-radius: clamp(0.5rem, 2cqi, 0.75rem);
2040
+
2041
+ font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
2042
+ color: #fff;
2043
+ }
2044
+
2045
+ .next-heading-wrapper {
2046
+ display: flex;
2047
+ flex-direction: row;
2048
+ justify-content: space-between;
2049
+ align-items: flex-start;
2050
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2051
+ margin-bottom: clamp(0.375rem, 2.5cqi, 0.5rem);
2052
+ }
2053
+
2054
+ .next-ep-header {
2055
+ display: flex;
2056
+ flex-direction: row;
2057
+ flex-wrap: wrap;
2058
+ align-items: baseline;
2059
+ gap: 0.35em;
2060
+ flex: 1;
2061
+ min-width: 0;
2062
+ text-align: left;
2063
+ font-weight: 600;
2064
+ font-size: clamp(0.5625rem, 3.2cqi, 0.6875rem);
2065
+ color: rgba(255, 255, 255, 0.95);
2066
+ margin: 0;
2067
+ }
2068
+
2069
+ .next-ep-header-text {
2070
+ flex-shrink: 0;
2071
+ }
2072
+
2073
+ .next-ep-header .next-ep-duration {
2074
+ flex-shrink: 0;
2075
+ font-weight: 700;
2076
+ color: #fff;
2077
+ }
2078
+
2079
+ .next-ep-close {
2080
+ display: flex;
2081
+ align-items: center;
2082
+ justify-content: center;
2083
+ flex-shrink: 0;
2084
+ padding: clamp(0.125rem, 1cqi, 0.25rem) clamp(0.25rem, 1.5cqi, 0.25rem);
2085
+ margin: 0;
2021
2086
  border-radius: 4px;
2022
- background: rgba(0, 0, 0, 0.75);
2087
+ cursor: pointer;
2088
+ color: rgba(255, 255, 255, 0.85);
2089
+ line-height: 0;
2090
+ opacity: 0.9;
2023
2091
  }
2024
- .next-ep-img{
2025
- width: 185px;
2026
- height: 95px;
2027
-
2092
+
2093
+ .next-ep-close:hover {
2094
+ opacity: 1;
2095
+ }
2096
+
2097
+ .next-ep-close svg {
2098
+ width: clamp(0.75rem, 4cqi, 1rem);
2099
+ height: clamp(0.75rem, 4cqi, 1rem);
2100
+ }
2101
+
2102
+ .next-ep-content {
2103
+ display: flex;
2104
+ flex-direction: column;
2105
+ align-items: stretch;
2106
+ gap: clamp(0.5rem, 3cqi, 0.75rem);
2107
+ cursor: pointer;
2108
+ min-width: 0;
2109
+ }
2110
+
2111
+ .next-ep-content:hover {
2112
+ opacity: 0.98;
2113
+ }
2114
+
2115
+ .next-ep-thumb-wrap {
2116
+ position: relative;
2117
+ width: 100%;
2118
+ aspect-ratio: 16 / 9;
2119
+ border-radius: clamp(0.375rem, 2cqi, 0.5rem);
2120
+ overflow: hidden;
2121
+ background: #1a1a1a;
2028
2122
  }
2029
- .next-ep-img-container{
2123
+
2124
+ .next-ep-img {
2030
2125
  width: 100%;
2031
2126
  height: 100%;
2127
+ object-fit: cover;
2128
+ display: block;
2032
2129
  }
2033
- .next-ep-header{
2034
- text-align: left;
2035
- font-weight: bold;
2036
- font-size: 18px;
2037
- margin-bottom: 8px;
2130
+
2131
+ .next-ep-thumb-runtime {
2132
+ position: absolute;
2133
+ left: clamp(0.375rem, 2.5cqi, 0.625rem);
2134
+ bottom: clamp(0.375rem, 2.5cqi, 0.625rem);
2135
+ padding: clamp(0.125rem, 1cqi, 0.1875rem) clamp(0.375rem, 2cqi, 0.5rem);
2136
+ border-radius: 999px;
2137
+ font-size: clamp(0.5625rem, 2.8cqi, 0.6875rem);
2138
+ font-weight: 600;
2139
+ color: #fff;
2140
+ background: rgba(0, 0, 0, 0.65);
2141
+ letter-spacing: 0.02em;
2142
+ }
2143
+
2144
+ .next-ep-thumb-runtime--empty {
2145
+ display: none;
2038
2146
  }
2039
2147
 
2040
- .next-ep-title{
2041
- font-size: 15px;
2042
- margin-left: 8px;
2148
+ .next-ep-meta-with-logo {
2149
+ display: flex;
2150
+ flex-direction: row;
2151
+ align-items: flex-start;
2152
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2153
+ min-width: 0;
2154
+ }
2043
2155
 
2156
+ .next-ep-meta-with-logo > .next-ep-meta {
2157
+ flex: 1;
2158
+ min-width: 0;
2044
2159
  }
2045
2160
 
2046
- .next-ep-content{
2161
+ .next-ep-meta {
2047
2162
  display: flex;
2048
- align-items: center;
2163
+ flex-direction: column;
2164
+ gap: 0;
2165
+ min-width: 0;
2049
2166
  }
2050
- .next-ep-content:hover{
2051
- cursor: pointer;
2167
+
2168
+ .next-ep-title {
2169
+ font-size: clamp(0.75rem, 4.5cqi, 0.875rem);
2170
+ font-weight: 700;
2171
+ line-height: 1.25;
2172
+ color: #fff;
2173
+ margin: 0;
2174
+ min-width: 0;
2175
+ white-space: nowrap;
2176
+ overflow: hidden;
2177
+ text-overflow: ellipsis;
2178
+ }
2179
+
2180
+ .next-ep-desc {
2181
+ font-size: clamp(0.6875rem, 3.8cqi, 0.75rem);
2182
+ font-weight: 400;
2183
+ line-height: 1.35;
2184
+ color: rgba(255, 255, 255, 0.82);
2185
+ margin: 0;
2186
+ margin-top: 3px;
2187
+ min-width: 0;
2188
+ white-space: nowrap;
2189
+ overflow: hidden;
2190
+ text-overflow: ellipsis;
2191
+ }
2192
+
2193
+ .next-ep-desc--empty {
2194
+ display: none;
2052
2195
  }
2053
- .next-heading-wrapper{
2196
+
2197
+ .next-ep-meta-row {
2054
2198
  display: flex;
2055
- flex-direction: unset;
2056
- justify-content: space-between;
2199
+ flex-direction: row;
2057
2200
  align-items: center;
2201
+ justify-content: flex-start;
2202
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2203
+ margin-top: 2px;
2204
+ min-width: 0;
2058
2205
  }
2059
- .next-ep-close{
2060
- align-items: right;
2061
- font-weight: bold;
2062
- font-size: 18px;
2063
- margin-bottom: 8px;
2064
- font-size: 20px;
2206
+
2207
+ .next-ep-meta-row-left {
2208
+ display: flex;
2209
+ flex-direction: row;
2210
+ align-items: center;
2211
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2212
+ min-width: 0;
2213
+ flex: 1;
2214
+ }
2215
+
2216
+ .next-ep-badge {
2217
+ flex-shrink: 0;
2218
+ font-size: clamp(0.5rem, 2.6cqi, 0.625rem);
2219
+ font-weight: 600;
2220
+ letter-spacing: 0.08em;
2221
+ text-transform: uppercase;
2222
+ padding: clamp(0.0625rem, 0.8cqi, 0.125rem) clamp(0.1875rem, 1.6cqi, 0.25rem);
2223
+ border: 1px solid rgba(255, 255, 255, 0.75);
2065
2224
  border-radius: 3px;
2066
- cursor: pointer;
2225
+ color: rgba(255, 255, 255, 0.95);
2067
2226
  }
2068
2227
 
2069
- @media (max-width:600px){
2070
- .next-ep-preview{
2071
- width: 170px;
2072
- right: 2.5%;
2073
- padding: 6px;
2074
- bottom: 56px;
2075
- }
2076
- .next-ep-header{
2077
- font-size: 12px;
2078
- }
2079
- .next-ep-img {
2080
- width: 100px;
2081
- height: 60px;
2228
+ .next-ep-badge--empty {
2229
+ display: none;
2230
+ }
2231
+
2232
+ .next-ep-episode {
2233
+ font-size: clamp(0.6875rem, 3.6cqi, 0.75rem);
2234
+ color: rgba(255, 255, 255, 0.88);
2235
+ white-space: nowrap;
2236
+ overflow: hidden;
2237
+ text-overflow: ellipsis;
2238
+ min-width: 0;
2239
+ }
2240
+
2241
+ .next-ep-network-logo {
2242
+ flex-shrink: 0;
2243
+ max-height: clamp(0.875rem, 5cqi, 1.375rem);
2244
+ max-width: clamp(2.5rem, 14cqi, 3.5rem);
2245
+ width: auto;
2246
+ height: auto;
2247
+ object-fit: contain;
2248
+ opacity: 0.98;
2249
+ }
2250
+
2251
+ .next-ep-network-logo--empty {
2252
+ display: none;
2253
+ }
2254
+
2255
+ /* Narrow card: stack meta and network logo */
2256
+ @container next-ep-preview (max-width: 220px) {
2257
+ .next-ep-meta-with-logo {
2258
+ flex-direction: column;
2259
+ align-items: flex-start;
2082
2260
  }
2083
- .next-ep-title {
2084
- font-size: 9px;
2085
- margin-left: 8px;
2261
+
2262
+ .next-ep-network-logo {
2263
+ align-self: flex-end;
2086
2264
  }
2087
2265
  }
2266
+
2267
+ /* Full-player thumbnail while the next episode asset loads */
2268
+ .video-js.next-ep-load-pending {
2269
+ position: relative;
2270
+ }
2271
+
2272
+ .next-ep-preview-player-thumb {
2273
+ position: absolute;
2274
+ inset: 0;
2275
+ z-index: 5;
2276
+ overflow: hidden;
2277
+ background: #000;
2278
+ pointer-events: none;
2279
+ }
2280
+
2281
+ .next-ep-load-overlay {
2282
+ position: absolute;
2283
+ inset: 0;
2284
+ z-index: 10;
2285
+ overflow: hidden;
2286
+ background: #000;
2287
+ pointer-events: none;
2288
+ }
2289
+
2290
+ .next-ep-load-overlay-img {
2291
+ width: 100%;
2292
+ height: 100%;
2293
+ object-fit: cover;
2294
+ display: block;
2295
+ }
2296
+
2297
+ .video-js.next-ep-load-pending .vjs-loading-spinner {
2298
+ z-index: 30 !important;
2299
+ }
2300
+
2301
+ /* a wrapper element that tracks the mouse vertically */
2302
+ .vjs-thumbnail-holder {
2303
+ position: absolute;
2304
+ left: -1000px;
2305
+ }
2306
+
2307
+ /* the thumbnail image itself */
2308
+ .vjs-thumbnail {
2309
+ position: absolute;
2310
+ left: 0;
2311
+ bottom: 1.3em;
2312
+ opacity: 0;
2313
+ transition: opacity .2s ease;
2314
+ -webkit-transition: opacity .2s ease;
2315
+ -moz-transition: opacity .2s ease;
2316
+ -mz-transition: opacity .2s ease;
2317
+ }
2318
+
2319
+ /* fade in the thumbnail when hovering over the progress bar */
2320
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2321
+ .vjs-progress-control:hover .vjs-thumbnail,
2322
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2323
+ .vjs-progress-control:active .vjs-thumbnail {
2324
+ opacity: 1;
2325
+ }
2326
+
2327
+ /* ... but hide the thumbnail when hovering directly over it */
2328
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2329
+ .vjs-progress-control:active .vjs-thumbnail:active {
2330
+ opacity: 0;
2331
+ }
2332
+
2088
2333
  .video-js.vjs-quality-menu {
2089
2334
  display: block;
2090
2335
  }
@@ -2155,38 +2400,6 @@
2155
2400
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2156
2401
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2157
2402
  }
2158
- /* a wrapper element that tracks the mouse vertically */
2159
- .vjs-thumbnail-holder {
2160
- position: absolute;
2161
- left: -1000px;
2162
- }
2163
-
2164
- /* the thumbnail image itself */
2165
- .vjs-thumbnail {
2166
- position: absolute;
2167
- left: 0;
2168
- bottom: 1.3em;
2169
- opacity: 0;
2170
- transition: opacity .2s ease;
2171
- -webkit-transition: opacity .2s ease;
2172
- -moz-transition: opacity .2s ease;
2173
- -mz-transition: opacity .2s ease;
2174
- }
2175
-
2176
- /* fade in the thumbnail when hovering over the progress bar */
2177
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2178
- .vjs-progress-control:hover .vjs-thumbnail,
2179
- .vjs-progress-control.fake-active .vjs-thumbnail,
2180
- .vjs-progress-control:active .vjs-thumbnail {
2181
- opacity: 1;
2182
- }
2183
-
2184
- /* ... but hide the thumbnail when hovering directly over it */
2185
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2186
- .vjs-progress-control:active .vjs-thumbnail:active {
2187
- opacity: 0;
2188
- }
2189
-
2190
2403
  .vjs-poster {
2191
2404
  display: inline-block;
2192
2405
  vertical-align: middle;