@viewlift/player-backup 2.0.296-backup → 2.0.298-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 (122) hide show
  1. package/cjs/autoNextVideo-1f2fa37c.js +1 -0
  2. package/cjs/browser-3670a923.js +1 -0
  3. package/cjs/bundle.css +1242 -1029
  4. package/cjs/{caption-settings-1afe1cb9.js → caption-settings-8f59beca.js} +1 -1
  5. package/cjs/{captions-676468fe.js → captions-6cbd3375.js} +1 -1
  6. package/cjs/{features-fbfbfeaa.js → features-718b5ff9.js} +1 -1
  7. package/cjs/generic-de678153.js +1 -0
  8. package/cjs/index-20fab3e1.js +1 -0
  9. package/cjs/index-4eeaba15.js +1 -0
  10. package/cjs/{index-7c33892f.js → index-58f88daa.js} +1 -1
  11. package/cjs/index-a319e73f.js +1 -0
  12. package/cjs/{index-7a3887df.js → index-da797a95.js} +1 -1
  13. package/cjs/index.js +1 -1
  14. package/cjs/{multicamv2-7586e645.js → multicamv2-38f60b42.js} +1 -1
  15. package/cjs/{multicamv2-1bd065f2.js → multicamv2-540b3e9b.js} +1 -1
  16. package/cjs/{nextEpisodeButton-a5f392c0.js → nextEpisodeButton-1c5cd5e0.js} +1 -1
  17. package/cjs/playlist-c216d4ed.js +1 -0
  18. package/cjs/relatedVideosManager-eeeaf32c.js +1 -0
  19. package/cjs/{renditions-508e7f85.js → renditions-627bdfad.js} +1 -1
  20. package/cjs/{resolution-e6b8a4eb.js → resolution-3af2cf1b.js} +1 -1
  21. package/cjs/{series-513bf657.js → series-e73d39b3.js} +1 -1
  22. package/cjs/series-v2-0aad0f22.js +1 -0
  23. package/cjs/series-v2-600ff0a5.js +1 -0
  24. package/cjs/{settings-icon-4d365ba3.js → settings-icon-0642c8ef.js} +1 -1
  25. package/cjs/skin-1b22caab.js +1 -0
  26. package/cjs/skin-269cc53d.js +1 -0
  27. package/cjs/{skin-c3708fa0.js → skin-4a34c95b.js} +1 -1
  28. package/cjs/{skin-55abd2ce.js → skin-60f8d0a4.js} +1 -1
  29. package/cjs/{skin-c6084619.js → skin-66dce245.js} +1 -1
  30. package/cjs/{skin-f724b38f.js → skin-6d09537e.js} +1 -1
  31. package/cjs/skin-6e55e5ee.js +1 -0
  32. package/cjs/skin-8e8c7df8.js +1 -0
  33. package/cjs/{skin-01f53e99.js → skin-b65aec55.js} +1 -1
  34. package/cjs/skin-d72f0d6f.js +1 -0
  35. package/cjs/skin-f002ff60.js +1 -0
  36. package/cjs/videoSelector-67403ab1.js +1 -0
  37. package/cjs/videoSelector-b3b6f26e.js +1 -0
  38. package/esm/autoNextVideo-affb5a38.js +1 -0
  39. package/esm/browser-de5f6a74.js +1 -0
  40. package/esm/bundle.css +1242 -1029
  41. package/esm/{caption-settings-d912022d.js → caption-settings-7e20f930.js} +1 -1
  42. package/esm/{captions-a7cd63fa.js → captions-7e8712e5.js} +1 -1
  43. package/esm/components/auto-next-video/autoNextVideo.d.ts +1 -0
  44. package/esm/components/video-selector/videoSelector.d.ts +4 -0
  45. package/esm/components/video-selector_TEMP/videoSelector.d.ts +4 -0
  46. package/esm/components/watch-history/handleWatchHistory.d.ts +1 -0
  47. package/esm/{features-2852e53e.js → features-4fa1d9d3.js} +1 -1
  48. package/esm/generic-96bd88a2.js +1 -0
  49. package/esm/helpers/apiErrorTracker.d.ts +1 -0
  50. package/esm/helpers/browser.d.ts +1 -0
  51. package/esm/helpers/browser.test.d.ts +1 -0
  52. package/esm/helpers/drmErrorDetection.d.ts +6 -0
  53. package/esm/helpers/skin.d.ts +1 -1
  54. package/esm/{icons-699e8cf0.js → icons-262bef63.js} +1 -1
  55. package/esm/index-0ed04a73.js +1 -0
  56. package/esm/index-10ffa415.js +1 -0
  57. package/esm/index-596186c9.js +1 -0
  58. package/esm/{index-906405de.js → index-986917f0.js} +1 -1
  59. package/esm/{index-9b56a55c.js → index-ec92c082.js} +1 -1
  60. package/esm/index.d.ts +6 -0
  61. package/esm/index.js +1 -1
  62. package/esm/{multicamv2-0da76319.js → multicamv2-ca426a9f.js} +1 -1
  63. package/esm/{multicamv2-cd64893e.js → multicamv2-e76261d3.js} +1 -1
  64. package/esm/{nextEpisodeButton-7065e49b.js → nextEpisodeButton-b078e8d3.js} +1 -1
  65. package/esm/playlist-3969db56.js +1 -0
  66. package/esm/relatedVideosManager-8dd9aa24.js +1 -0
  67. package/esm/{renditions-225582e2.js → renditions-620d93b3.js} +1 -1
  68. package/esm/{resolution-0fbfb20a.js → resolution-2ee017b4.js} +1 -1
  69. package/esm/{series-1296087c.js → series-8870aca0.js} +1 -1
  70. package/esm/series-v2-8a67a89e.js +1 -0
  71. package/esm/series-v2-aa554a91.js +1 -0
  72. package/esm/{settings-icon-b87f878f.js → settings-icon-c65eb622.js} +1 -1
  73. package/esm/skin-0ba281ee.js +1 -0
  74. package/esm/skin-156273b0.js +1 -0
  75. package/esm/skin-167f3262.js +1 -0
  76. package/esm/skin-3653c5b3.js +1 -0
  77. package/esm/skin-380f7322.js +1 -0
  78. package/esm/skin-770bc143.js +1 -0
  79. package/{cjs/skin-13f17735.js → esm/skin-92d6e7ef.js} +1 -1
  80. package/esm/{skin-9a9606e2.js → skin-9ad79db0.js} +1 -1
  81. package/esm/{skin-a9c23cad.js → skin-ddc1316d.js} +1 -1
  82. package/esm/skin-eaa89a25.js +1 -0
  83. package/esm/{skin-601e36bf.js → skin-f22e1fd7.js} +1 -1
  84. package/esm/utilities/relatedVideosManager.d.ts +11 -0
  85. package/esm/videoSelector-320fea81.js +1 -0
  86. package/esm/videoSelector-508bebff.js +1 -0
  87. package/package.json +2 -2
  88. package/cjs/autoNextVideo-11f9a504.js +0 -1
  89. package/cjs/browser-77c57718.js +0 -1
  90. package/cjs/generic-9fa3c0bb.js +0 -1
  91. package/cjs/index-0390e484.js +0 -1
  92. package/cjs/index-229dec72.js +0 -1
  93. package/cjs/playlist-0fe7b4d6.js +0 -1
  94. package/cjs/series-v2-0b013516.js +0 -1
  95. package/cjs/series-v2-fecd7d4c.js +0 -1
  96. package/cjs/skin-29bb949b.js +0 -1
  97. package/cjs/skin-83da696f.js +0 -1
  98. package/cjs/skin-8780e2a2.js +0 -1
  99. package/cjs/skin-9bf9775b.js +0 -1
  100. package/cjs/skin-a810173d.js +0 -1
  101. package/cjs/util-0574b423.js +0 -1
  102. package/cjs/videoSelector-0fc6930c.js +0 -1
  103. package/cjs/videoSelector-f3bdf178.js +0 -1
  104. package/esm/autoNextVideo-2a20bbbd.js +0 -1
  105. package/esm/browser-d4613b36.js +0 -1
  106. package/esm/generic-c057edc5.js +0 -1
  107. package/esm/index-0c840631.js +0 -1
  108. package/esm/index-2be4a3d8.js +0 -1
  109. package/esm/playlist-e8861c44.js +0 -1
  110. package/esm/series-v2-43f33c70.js +0 -1
  111. package/esm/series-v2-7b0979e7.js +0 -1
  112. package/esm/skin-109c4ba7.js +0 -1
  113. package/esm/skin-280dfe76.js +0 -1
  114. package/esm/skin-3aa64a01.js +0 -1
  115. package/esm/skin-606a59c2.js +0 -1
  116. package/esm/skin-bce765b0.js +0 -1
  117. package/esm/skin-d184c7e3.js +0 -1
  118. package/esm/skin-dac31c35.js +0 -1
  119. package/esm/skin-f95bee67.js +0 -1
  120. package/esm/util-371cec8c.js +0 -1
  121. package/esm/videoSelector-a58fc6ba.js +0 -1
  122. package/esm/videoSelector-b2af3988.js +0 -1
package/esm/bundle.css CHANGED
@@ -1,7 +1,6 @@
1
1
 
2
2
 
3
3
 
4
-
5
4
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
6
5
  height: 0.7em;
7
6
  position: absolute;
@@ -190,39 +189,35 @@
190
189
  }
191
190
 
192
191
  .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
193
- display: none;
192
+ /* display: none; */
194
193
  }
195
194
 
196
195
  .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
197
- display: none;
196
+ /* display: none; */
198
197
  }
199
198
  }
200
199
 
201
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
200
+
201
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
202
202
  font-size: 2.2em;
203
203
  line-height: 2.6;
204
204
  }
205
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
206
- background: #fcb700;
205
+ .video-js.skin_mini{
206
+ overflow: hidden;
207
207
  }
208
- .video-js.skin_news_live .vjs-control-bar{
208
+ .video-js.skin_mini .vjs-control-bar{
209
209
  z-index: 1 !important;
210
- height: 5em !important;
210
+ height: 4em !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
- }
218
213
 
219
- .video-js.skin_news_live .vjs-fade>* {
214
+ .video-js.skin_mini .vjs-fade>* {
220
215
  visibility: hidden !important;
221
216
  opacity: 0 !important;
222
217
  transition: visibility 1s, opacity 1s !important;
223
218
  }
224
219
 
225
- .video-js.skin_news_live .custom-spaced-progress-bar {
220
+ .video-js.skin_mini .custom-spaced-progress-bar {
226
221
  position: absolute;
227
222
  width: 100%;
228
223
  display: flex;
@@ -230,7 +225,7 @@
230
225
  top: -0.5em;
231
226
  }
232
227
 
233
- .video-js.skin_news_live .vjs-progress-control {
228
+ .video-js.skin_mini .vjs-progress-control {
234
229
  /* left: -6px; */
235
230
  position: relative;
236
231
  width: 100%;
@@ -238,25 +233,22 @@
238
233
  transition: height 0.1s, top 0.1s;
239
234
  }
240
235
 
241
- .video-js.skin_news_live .vjs-volume-panel{
242
- min-width: 5.3em;
243
- }
244
236
 
245
237
 
246
238
 
247
- .video-js.skin_news_live .vjs-custom-control-spacer {
248
- /* display: block; */
249
- /* flex: 1 1 auto; */
239
+ .video-js.skin_mini .vjs-custom-control-spacer {
240
+ display: block;
241
+ flex: 1 1 auto;
250
242
  }
251
243
 
252
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
244
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
253
245
  margin: 0 0px 0 0px;
254
246
  }
255
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
247
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
256
248
  display: none;
257
249
  }
258
250
 
259
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
251
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
260
252
  font-size: 14px;
261
253
  font-weight: 500;
262
254
  align-self: center;
@@ -265,199 +257,207 @@
265
257
  border-radius: 8px;
266
258
  }
267
259
 
268
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
269
- height: 6px !important;
260
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
261
+ height: 5px !important;
270
262
  }
271
263
 
272
- .video-js.skin_news_live .vjs-play-progress:before {
273
- font-size: 1.5em;
264
+ .video-js.skin_mini .vjs-play-progress:before {
265
+ font-size: 1.3em;
274
266
  line-height: unset;
275
267
  top: -0.3333333333em;
276
268
  }
277
269
 
278
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
270
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
279
271
  display: none !important;
280
272
  }
281
273
 
282
274
  /* */
283
- .video-js.skin_news_live .vjs-mouse-display{
275
+ .video-js.skin_mini .vjs-mouse-display{
284
276
  font-size: 1.6666666667em;
285
277
  }
286
278
 
287
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
279
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
288
280
  font-size: 1em !important;
289
281
  }
290
282
 
291
- .video-js.skin_news_live .vjs-button{
292
- width: 5.3em;
283
+ .video-js.skin_mini .vjs-button{
284
+ width: 3em;
293
285
  display: flex;
294
286
  align-items: center;
295
287
  justify-content: center;
296
288
  }
297
289
 
298
290
 
299
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
291
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
300
292
  .icon-maximize {
301
293
  display: block;
302
294
  height: 32px;
303
295
  }
304
296
 
305
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
297
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
306
298
  line-height: 4;
307
299
  }
308
300
 
309
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
301
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
310
302
  .icon-minimize {
311
303
  display: none;
312
304
  height: 32px;
313
305
  }
314
306
 
315
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
307
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
316
308
  outline: none !important;
317
- /* flex: 1; */
318
- }
319
- .video-js.skin_news_live .vjs-play-toggle-container{
320
- display: flex;
321
- flex: 1;
322
- justify-content: center;
323
309
  }
324
-
325
-
326
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
310
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
327
311
  .vjs-icon-fullscreen-enter:before {
328
312
  /* content: '' !important; */
329
313
  }
330
314
 
331
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
315
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
332
316
  display: flex;
333
317
  justify-content: center;
334
318
  align-items: center;
335
319
  /* transform: rotate(90deg); */
336
320
  }
337
321
 
338
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
322
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
339
323
  display: none;
340
324
  }
341
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
325
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
342
326
  margin-left: -10px;
327
+ display: none;
343
328
  }
344
329
 
345
- .video-js.skin_news_live .skipbtn:hover{
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
+ }
345
+
346
+ .video-js.skin_mini .skipbtn:hover{
346
347
  cursor: pointer;
347
348
  }
348
349
 
349
- .video-js.skin_news_live .rewindbtn:hover{
350
+ .video-js.skin_mini .rewindbtn:hover{
350
351
  cursor: pointer;
351
352
  }
352
353
 
353
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
354
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
354
355
  position: relative;
355
356
  padding-left: 0;
356
357
  }
357
358
 
358
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
359
- display: none !important;
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;
360
376
  }
361
377
 
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{
378
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
382
379
  font-weight: bold;
383
380
  }
384
381
 
385
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
386
- bottom: 2.4em !important;
387
- right: -1em;
382
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
383
+ bottom: 1.1em !important;
384
+ right: 1em;
388
385
  z-index: 1;
386
+ font-size: 10px;
389
387
  }
390
388
 
391
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
389
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
392
390
  width: 24px !important;
393
391
  height: 24px !important;
394
392
  }
395
- .settings-selector-icon>svg{
393
+ .video-js.skin_mini .settings-selector-icon>svg{
396
394
  height: 19px !important;
397
395
  width: 19px !important;
398
396
  }
399
397
 
400
398
 
401
- .video-js.skin_news_live button.vjs-rewind-button{
399
+ .video-js.skin_mini button.vjs-rewind-button{
402
400
  cursor: pointer;
403
401
  }
404
402
 
405
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
403
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
406
404
  padding-right: 0;
407
- display: none;
408
405
  }
409
406
 
410
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
407
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
411
408
  padding-left: 0;
412
- display: none;
413
409
  }
414
410
 
415
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
411
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
416
412
  padding-left: 0;
417
413
  padding-right: 0;
418
- display: none;
414
+ display: flex;
415
+ justify-content: center;
416
+ width: min-content;
419
417
  }
420
418
 
421
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
419
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
422
420
  display: none
423
421
  }
424
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
422
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
425
423
  display: none
426
424
  }
427
425
 
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;
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;
434
433
  }
435
434
 
436
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
435
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
437
436
  display: none;
438
437
  font-size: 11px;
439
438
  justify-content: center;
440
439
  align-items: center;
441
440
  user-select: none;
442
441
  }
443
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
442
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
444
443
  display: none;
445
444
  }
446
445
 
447
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
446
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
448
447
  height: min-content;
449
448
  width: min-content;
450
449
  }
451
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
452
- width: 6em;
450
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
451
+ width: 3em;
452
+ margin-right: 4px;
453
453
  }
454
454
 
455
- .video-js.skin_news_live .content{
455
+ .video-js.skin_mini .content{
456
456
  bottom: 3.4rem !important;
457
457
  right: -4rem !important;
458
458
  }
459
459
 
460
- .setting-icon > svg{
460
+ .video-js.skin_mini .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_news_live iframe{
474
+ .video-js.skin_mini iframe{
475
475
  width: 100%;
476
476
  height: 100%;
477
477
  }
478
478
 
479
- .video-js.skin_news_live .vjs-live-control{
479
+ .video-js.skin_mini .vjs-live-control{
480
480
  align-items: center;
481
- display: none;
481
+ max-width: 5em;
482
482
  }
483
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
483
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
484
484
  height: 2.2em;
485
485
  display: flex;
486
486
  align-items: center;
@@ -488,674 +488,809 @@
488
488
  width: 4em;
489
489
  justify-content: center;
490
490
  background: red;
491
- margin: 4px 0px 4px 12px;
491
+ margin: 4px 0px 4px 2px;
492
492
  }
493
493
 
494
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
494
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
495
495
  text-shadow: none;
496
496
  }
497
-
498
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
499
- display: flex;
500
- justify-content: center;
501
- min-width: 5.3em;
502
- pointer-events: none;
503
- user-select: none;
504
- }
505
-
506
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
507
- color: white;
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;
508
500
  }
509
501
 
510
-
511
- .settings-selection.vjs-control.vjs-button{
512
- display: flex !important;
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;
507
+ 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);
513
515
  }
514
516
 
515
- @media(max-width:576px){
516
- .settings-selection.vjs-control.vjs-button{
517
- display: none !important;
518
- }
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;
519
520
  }
520
521
 
521
522
 
522
- @media(max-width:576px){
523
+ @media(max-width:600px){
523
524
  .tvProviderImage{
524
525
  display: none
525
526
  }
526
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
527
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
527
528
  .icon-maximize {
528
529
  height: 30px !important;
529
530
  }
530
531
 
531
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
532
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
532
533
  .icon-minimize {
533
534
  height: 30px !important;
534
535
  }
535
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
536
- width: 4.5em;
536
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
537
+ width: 3.5em;
537
538
  }
538
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
539
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
539
540
  height: min-content;
540
541
  }
541
542
 
542
- .video-js.skin_news_live button.vjs-slowmo-button{
543
+ .video-js.skin_mini button.vjs-slowmo-button{
543
544
  display: none;
544
545
  }
545
- .video-js.skin_news_live button.vjs-rewind-button{
546
+ .video-js.skin_mini button.vjs-rewind-button{
546
547
  display: none;
547
548
  }
548
- .video-js.skin_news_live button.vjs-rewind-button>svg{
549
+ .video-js.skin_mini button.vjs-rewind-button>svg{
549
550
  height: 20px;
550
551
  }
551
- .video-js.skin_news_live .vjs-button{
552
- width: 4.8em;
552
+ .video-js.skin_mini .vjs-button{
553
+ width: 3em;
553
554
  }
554
- .video-js.skin_news_live .widget-selection{
555
+ .video-js.skin_mini .widget-selection{
555
556
  display: none;
556
557
  }
557
- .video-js.skin_news_live .container{
558
+ .video-js.skin_mini .container{
558
559
  display: none !important;
559
560
  }
560
- .video-js.skin_news_live .vjs-control-bar{
561
+ .video-js.skin_mini .vjs-control-bar{
561
562
  height: 4em !important;
562
563
  }
563
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
564
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
564
565
  font-size: 2.5em;
565
566
  line-height: 1.5;
566
567
  }
567
- .video-js.skin_news_live .vjs-play-progress:before {
568
+ .video-js.skin_mini .vjs-play-progress:before {
568
569
  font-size: 1.2em;
569
570
  position: absolute;
570
571
  right: -0.5em;
571
572
  z-index: 1;
572
573
  }
573
- .video-js.skin_news_live button.vjs-skip-button>svg{
574
+ .video-js.skin_mini button.vjs-skip-button>svg{
574
575
  height: 20px;
575
576
  }
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
- }
581
577
 
582
578
  .stream-selector-icon>svg{
583
579
  width: 24px;
584
580
  height: 24px;
585
581
  }
586
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
587
- margin: 0 12px 0 12px;
588
- }
589
- .video-js.skin_news_live .vjs-seek-to-live-text{
582
+ .video-js.skin_mini .vjs-seek-to-live-text{
590
583
  font-size: 12px;
591
584
  }
592
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
593
- margin: 0 12px 0 12px;
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
+ }
594
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;
595
597
  }
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;
598
+
599
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
600
+ font-size: 18px !important;
611
601
  }
612
602
 
613
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
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;
605
+ }
606
+
607
+
608
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
614
609
  display: flex;
615
610
  justify-content: center;
616
611
  align-items: center;
617
612
  height: 100%;
618
613
  transition: width 0.1s;
619
614
  }
615
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
616
+ margin: 2px;
617
+ }
620
618
 
621
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
619
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
622
620
  display: flex;
623
621
  justify-content: center;
624
622
  align-items: center;
625
623
  height: 100%;
626
624
  transition: width 0.1s;
627
625
  }
628
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
629
- display: none !important;
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;
630
633
  }
631
634
 
632
- @media (max-width: 576px) {
633
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
635
+ @media (max-width: 600px) {
636
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
634
637
  height: 5px !important;
635
638
  }
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
- }
641
639
 
642
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
640
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
643
641
  display: none;
644
642
  }
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
- }
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
- }
659
- }
660
-
661
- .video-js.skin_news_live .vjs-text-track-display-ttml {
662
- width: 100% !important;
663
- }
664
-
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;
669
- }
670
643
 
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;
673
644
  }
674
645
 
675
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
676
- font-size: 18px !important;
646
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
647
+ content: none !important;
648
+ fill: none !important;
649
+ filter: none !important;
677
650
  }
678
651
 
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;
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;
685
655
  }
686
656
 
687
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
688
- content: none !important;
689
- fill: none !important;
690
- filter: none !important;
657
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
658
+ opacity: 1 !important;
691
659
  }
692
660
 
693
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
661
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
694
662
  color: rgba(255, 255, 2555, 0.7)!important;
695
663
  }
696
664
 
697
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
665
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
698
666
  color: rgba(255, 255, 2555, 1)!important;
699
667
  }
700
668
 
701
669
 
702
-
703
-
704
- .video-js.skin_cn_news .vjs-control-bar {
705
- z-index: 1 !important;
706
- height: auto !important;
707
- padding: 0.8em 30px 0.6em;
708
- background: transparent !important;
670
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
671
+ font-size: 2.2em;
672
+ line-height: 2.6;
673
+ }
674
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
675
+ background: #fcb700;
676
+ }
677
+ .video-js.skin_news_live .vjs-control-bar{
678
+ z-index: 1 !important;
679
+ height: 5em !important;
680
+ background: black !important;
681
+ }
682
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
709
683
  display: flex;
710
- flex-wrap: wrap;
711
684
  align-items: center;
712
- column-gap: 10px;
685
+ justify-content: center;
713
686
  }
714
687
 
688
+ .video-js.skin_news_live .vjs-fade>* {
689
+ visibility: hidden !important;
690
+ opacity: 0 !important;
691
+ transition: visibility 1s, opacity 1s !important;
692
+ }
715
693
 
716
- .video-js.skin_cn_news .vjs-control-bar::before {
717
- content: '';
694
+ .video-js.skin_news_live .custom-spaced-progress-bar {
718
695
  position: absolute;
719
- left: 0;
720
- right: 0;
721
- bottom: 0;
722
- top: -3em;
723
- background: linear-gradient(
724
- to top,
725
- rgba(0, 0, 0, 0.85) 0%,
726
- rgba(0, 0, 0, 0.7) 40%,
727
- rgba(0, 0, 0, 0.55) 70%,
728
- rgba(0, 0, 0, 0.38) 86%,
729
- transparent 100%
730
- );
731
- pointer-events: none;
732
- z-index: -1;
696
+ width: 100%;
697
+ display: flex;
698
+ height: 0.5em;
699
+ top: -0.5em;
733
700
  }
734
701
 
735
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
736
- order: -1;
737
- flex: 0 0 100%;
738
- width: 80%;
739
- margin: 0 0 5em;
702
+ .video-js.skin_news_live .vjs-progress-control {
703
+ /* left: -6px; */
740
704
  position: relative;
705
+ width: 100%;
706
+ height: 0.5em;
707
+ transition: height 0.1s, top 0.1s;
741
708
  }
742
709
 
743
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
744
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
745
- width: auto;
746
- min-width: 0;
747
- }
748
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
749
- display: inline-flex;
750
- align-items: center;
751
- justify-content: center;
752
- height: 7em;
753
- padding: 0 10px;
754
- color: #fff;
710
+ .video-js.skin_news_live .vjs-volume-panel{
711
+ min-width: 5.3em;
755
712
  }
756
713
 
757
- .video-js.skin_cn_news .vjs-svg-icon::before {
758
- content: none !important;
759
- }
760
714
 
761
715
 
762
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
763
- display: inline-flex;
764
- align-items: center;
765
- justify-content: center;
766
- }
767
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
768
- .video-js.skin_cn_news .vjs-rewind-button svg {
769
- width: 24px;
770
- height: 24px;
771
- display: block;
716
+ .video-js.skin_news_live .vjs-custom-control-spacer {
717
+ /* display: block; */
718
+ /* flex: 1 1 auto; */
772
719
  }
773
720
 
774
-
775
-
776
- .video-js.skin_cn_news .vjs-subs-caps-button {
777
- opacity: 1;
721
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
722
+ margin: 0 0px 0 0px;
723
+ }
724
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
725
+ display: none;
778
726
  }
779
727
 
780
-
781
-
782
- .video-js.skin_cn_news .vjs-volume-panel {
783
- margin: 0;
784
- display: inline-flex;
785
- align-items: center;
728
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
729
+ font-size: 14px;
730
+ font-weight: 500;
786
731
  align-self: center;
787
- height: 2.2em;
788
- min-width: 7em;
789
- transition: none;
732
+ height: min-content;
733
+ padding: 5px 2px;
734
+ border-radius: 8px;
790
735
  }
791
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
792
- width: 0;
793
- height: 100%;
794
- display: flex;
795
- align-items: center;
796
- overflow: hidden;
797
- opacity: 0;
798
- transition: width 0.15s ease, opacity 0.15s ease;
736
+
737
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
738
+ height: 6px !important;
799
739
  }
800
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
801
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
802
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
803
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
804
- width: 5em;
805
- opacity: 1;
740
+
741
+ .video-js.skin_news_live .vjs-play-progress:before {
742
+ font-size: 1.5em;
743
+ line-height: unset;
744
+ top: -0.3333333333em;
806
745
  }
807
746
 
808
- .video-js.skin_cn_news .vjs-volume-bar {
809
- width: 4em;
810
- height: 0.3em;
811
- margin: 0 0.45em;
747
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
748
+ display: none !important;
812
749
  }
813
750
 
751
+ /* */
752
+ .video-js.skin_news_live .vjs-mouse-display{
753
+ font-size: 1.6666666667em;
754
+ }
814
755
 
815
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
816
- display: none !important;
756
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
757
+ font-size: 1em !important;
817
758
  }
818
759
 
819
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
820
- width: 0 !important;
760
+ .video-js.skin_news_live .vjs-button{
761
+ width: 5.3em;
762
+ display: flex;
763
+ align-items: center;
764
+ justify-content: center;
821
765
  }
822
766
 
823
767
 
824
- .video-js.skin_cn_news .vjs-custom-control-spacer {
825
- display: block !important;
826
- flex: 1 1 auto;
768
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
769
+ .icon-maximize {
770
+ display: block;
771
+ height: 32px;
772
+ }
773
+
774
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
775
+ line-height: 4;
827
776
  }
828
777
 
778
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
779
+ .icon-minimize {
780
+ display: none;
781
+ height: 32px;
782
+ }
829
783
 
830
- .video-js.skin_cn_news .vjs-big-play-button {
831
- display: none;
784
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
785
+ outline: none !important;
786
+ /* flex: 1; */
832
787
  }
833
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
834
- position: relative !important;
788
+ .video-js.skin_news_live .vjs-play-toggle-container{
835
789
  display: flex;
836
- left: 0;
837
- top: -1px;
790
+ flex: 1;
791
+ justify-content: center;
838
792
  }
839
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
793
+
794
+
795
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
796
+ .vjs-icon-fullscreen-enter:before {
797
+ /* content: '' !important; */
798
+ }
799
+
800
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
840
801
  display: flex;
841
802
  justify-content: center;
842
803
  align-items: center;
843
- position: absolute;
844
- top: 0;
845
- left: 0;
846
- right: 0;
847
- bottom: 0;
848
- margin: auto;
849
- width: 80px;
850
- height: 80px;
851
- border: none;
852
- border-radius: 50%;
853
- background: rgba(0, 0, 0, 0.55);
854
- font-size: 5em;
855
- line-height: 1.3em;
856
- transform: none !important;
804
+ /* transform: rotate(90deg); */
857
805
  }
858
806
 
807
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
808
+ display: none;
809
+ }
810
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
811
+ margin-left: -10px;
812
+ }
859
813
 
860
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
861
- height: 4px !important;
862
- margin: 0;
863
- border-radius: 20px;
864
- background-color: #393944;
814
+ .video-js.skin_news_live .skipbtn:hover{
815
+ cursor: pointer;
865
816
  }
866
817
 
867
- .video-js.skin_cn_news .vjs-play-progress {
868
- background-color: #ffffff;
869
- border-radius: 20px;
818
+ .video-js.skin_news_live .rewindbtn:hover{
819
+ cursor: pointer;
870
820
  }
871
821
 
872
- .video-js.skin_cn_news .vjs-load-progress,
873
- .video-js.skin_cn_news .vjs-load-progress div {
874
- background: rgba(255, 255, 255, 0.15);
875
- border-radius: 20px;
822
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
823
+ position: relative;
824
+ padding-left: 0;
876
825
  }
877
826
 
827
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
828
+ display: none !important;
829
+ }
878
830
 
879
- .video-js.skin_cn_news .vjs-play-progress:before {
880
- content: '';
881
- width: 16px;
882
- height: 16px;
883
- border-radius: 50%;
884
- background: #ffffff;
885
- border: 2px solid rgba(0, 0, 0, 0.6);
886
- box-sizing: border-box;
887
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
888
- top: -6px;
889
- right: -8px;
890
- position: absolute;
831
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
832
+ /* width: 90px;
833
+ height: 90px;
834
+ display: flex;
835
+ justify-content: center;
836
+ align-items: center;
837
+ border-radius: 50%;
838
+ position: absolute;
839
+ top: 0;
840
+ left: 0;
841
+ right: 0;
842
+ bottom: 0;
843
+ margin: auto;
844
+ font-size: 6em;
845
+ line-height: 1.4em;
846
+ border: 0.05em solid;
847
+ color: inherit; */
848
+ display: none !important;
891
849
  }
892
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
893
- display: none !important;
850
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
851
+ font-weight: bold;
894
852
  }
895
853
 
896
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
897
- background: #ffffff;
898
- color: #0a0e17;
899
- font-weight: 700;
900
- border-radius: 3px;
854
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
855
+ bottom: 2.4em !important;
856
+ right: -1em;
857
+ z-index: 1;
901
858
  }
902
859
 
903
- .video-js.skin_cn_news .vjs-live-control {
904
- display: none !important;
860
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
861
+ width: 24px !important;
862
+ height: 24px !important;
905
863
  }
906
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
907
- display: inline-flex;
908
- align-items: center;
909
- align-self: center;
910
- height: 2.2em;
911
- gap: 5px;
912
- width: auto;
913
- padding: 0 10px;
914
- border: 1px solid rgba(255, 255, 255, 0.45);
915
- border-radius: 4px;
864
+ .settings-selector-icon>svg{
865
+ height: 19px !important;
866
+ width: 19px !important;
867
+ }
868
+
869
+
870
+ .video-js.skin_news_live button.vjs-rewind-button{
916
871
  cursor: pointer;
917
872
  }
918
873
 
919
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
874
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
875
+ padding-right: 0;
920
876
  display: none;
921
877
  }
922
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
923
- display: inline-flex;
924
- align-items: center;
925
- }
926
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
927
- content: '';
928
- display: inline-block;
929
- width: 8px;
930
- height: 8px;
931
- border-radius: 50%;
932
- background: #ff2d2d; /* red live dot */
878
+
879
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
880
+ padding-left: 0;
881
+ display: none;
933
882
  }
934
- .video-js.skin_cn_news .vjs-seek-to-live-text {
935
- color: #ffffff;
936
- font-weight: 700;
937
- font-size: 12px;
938
- letter-spacing: 0.03em;
883
+
884
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
885
+ padding-left: 0;
886
+ padding-right: 0;
887
+ display: none;
939
888
  }
940
889
 
941
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
942
- border-color: transparent;
890
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
891
+ display: none
943
892
  }
944
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
945
- color: #ff2d2d;
893
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
894
+ display: none
946
895
  }
947
896
 
948
- /* ---- time controls ---- */
949
- .video-js.skin_cn_news .vjs-current-time,
950
- .video-js.skin_cn_news .vjs-duration,
951
- .video-js.skin_cn_news .vjs-time-divider {
952
- display: none !important;
953
- }
954
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
955
- display: none;
897
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
898
+ display: flex;
956
899
  align-items: center;
957
- justify-content: center;
958
- font-size: 11px;
959
900
  font-weight: 700;
960
- color: #fff;
961
- padding: 0 6px;
962
- user-select: none;
901
+ font-size: 12px;
902
+ min-width: 1.2em;
963
903
  }
964
904
 
965
-
966
- .video-js.skin_cn_news .vjs-chapter-marker {
967
- z-index: 2;
968
- width: var(--vl-chapter-size, 8px);
969
- height: var(--vl-chapter-size, 8px);
970
- top: 50%;
971
- bottom: auto;
972
- background: var(--vl-chapter-color, #ffffff);
973
- opacity: var(--vl-chapter-opacity, 1);
974
- border-radius: 50%;
975
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
976
- transform: translate(-50%, -50%) scale(1);
977
- transition: background-color 0.12s ease;
978
- }
979
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
980
- background: var(--vl-chapter-hover, #0a5cff);
981
- }
982
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
983
- background: var(--vl-chapter-active, #0a5cff);
905
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
906
+ display: none;
907
+ font-size: 11px;
908
+ justify-content: center;
909
+ align-items: center;
910
+ user-select: none;
984
911
  }
985
-
986
-
987
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
988
- width: 16px;
989
- height: 16px;
990
- bottom: 160%;
991
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
912
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
913
+ display: none;
992
914
  }
993
915
 
994
-
995
- .video-js.skin_cn_news .vjs-chapter-preview {
996
- background: var(--vl-chapter-tooltip, #0a5cff);
997
- border-radius: 6px;
998
- padding: 8px 10px;
999
- width: max-content;
1000
- max-width: 300px;
1001
- text-align: left;
1002
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1003
- }
1004
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1005
- color: #ffffff;
1006
- font-size: 13px;
1007
- font-weight: 400;
1008
- margin-bottom: 2px;
1009
- }
1010
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1011
- color: #ffffff;
1012
- font-size: 13px;
1013
- font-weight: 400;
1014
- line-height: 1.3;
1015
- white-space: normal;
1016
- text-align: left;
1017
- }
1018
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1019
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
916
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
917
+ height: min-content;
918
+ width: min-content;
1020
919
  }
1021
-
1022
- /* ---- responsive ---- */
1023
- @media (max-width: 576px) {
1024
- .video-js.skin_cn_news .vjs-control-bar {
1025
- height: 3.2em !important;
1026
- padding: 0 8px;
1027
- }
1028
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1029
- padding: 0 6px;
1030
- }
1031
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1032
- display: none !important;
1033
- }
920
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
921
+ width: 6em;
1034
922
  }
1035
923
 
1036
-
1037
-
1038
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1039
- font-size: 2.2em;
1040
- line-height: 2.6;
1041
- }
1042
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1043
- background: white;
1044
- }
1045
- .video-js.skin_news .vjs-control-bar{
1046
- z-index: 1 !important;
1047
- height: 5em !important;
1048
- background: black !important;
1049
- }
1050
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1051
- display: flex;
1052
- align-items: center;
1053
- justify-content: center;
924
+ .video-js.skin_news_live .content{
925
+ bottom: 3.4rem !important;
926
+ right: -4rem !important;
1054
927
  }
1055
928
 
1056
- .video-js.skin_news .vjs-fade>* {
1057
- visibility: hidden !important;
1058
- opacity: 0 !important;
1059
- transition: visibility 1s, opacity 1s !important;
929
+ .setting-icon > svg{
930
+ height:18px !important;
1060
931
  }
1061
932
 
1062
- .video-js.skin_news .custom-spaced-progress-bar {
933
+ .output-overlay{
1063
934
  position: absolute;
935
+ bottom: 0;
936
+ height: 100%;
1064
937
  width: 100%;
1065
- display: flex;
1066
- height: 0.5em;
1067
- top: -0.5em;
938
+ z-index: 0;
939
+ border: 0;
940
+ pointer-events:none
1068
941
  }
1069
942
 
1070
- .video-js.skin_news .vjs-progress-control {
1071
- /* left: -6px; */
1072
- position: relative;
943
+ .video-js.skin_news_live iframe{
1073
944
  width: 100%;
1074
- height: 0.5em;
1075
- transition: height 0.1s, top 0.1s;
1076
- }
1077
-
1078
-
1079
-
1080
-
1081
- .video-js.skin_news .vjs-custom-control-spacer {
1082
- display: block;
1083
- flex: 1 1 auto;
945
+ height: 100%;
1084
946
  }
1085
947
 
1086
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1087
- margin: 0 0px 0 0px;
1088
- }
1089
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
948
+ .video-js.skin_news_live .vjs-live-control{
949
+ align-items: center;
1090
950
  display: none;
1091
951
  }
1092
-
1093
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1094
- font-size: 14px;
1095
- font-weight: 500;
1096
- align-self: center;
1097
- height: min-content;
1098
- padding: 5px 2px;
1099
- border-radius: 8px;
952
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
953
+ height: 2.2em;
954
+ display: flex;
955
+ align-items: center;
956
+ font-family: monospace;
957
+ width: 4em;
958
+ justify-content: center;
959
+ background: red;
960
+ margin: 4px 0px 4px 12px;
1100
961
  }
1101
962
 
1102
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1103
- height: 6px !important;
963
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
964
+ text-shadow: none;
1104
965
  }
1105
966
 
1106
- .video-js.skin_news .vjs-play-progress:before {
1107
- font-size: 1.5em;
1108
- line-height: unset;
1109
- top: -0.3333333333em;
967
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
968
+ display: flex;
969
+ justify-content: center;
970
+ min-width: 5.3em;
971
+ pointer-events: none;
972
+ user-select: none;
1110
973
  }
1111
974
 
1112
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1113
- display: none !important;
975
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
976
+ color: white;
1114
977
  }
1115
978
 
1116
- /* */
1117
- .video-js.skin_news .vjs-mouse-display{
1118
- font-size: 1.6666666667em;
1119
- }
1120
979
 
1121
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1122
- font-size: 1em !important;
980
+ .settings-selection.vjs-control.vjs-button{
981
+ display: flex !important;
1123
982
  }
1124
983
 
1125
- .video-js.skin_news .vjs-button{
1126
- width: 5.3em;
1127
- display: flex;
1128
- align-items: center;
1129
- justify-content: center;
984
+ @media(max-width:576px){
985
+ .settings-selection.vjs-control.vjs-button{
986
+ display: none !important;
987
+ }
1130
988
  }
1131
989
 
1132
990
 
1133
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1134
- .icon-maximize {
1135
- display: block;
1136
- height: 32px;
1137
- }
991
+ @media(max-width:576px){
992
+ .tvProviderImage{
993
+ display: none
994
+ }
995
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
996
+ .icon-maximize {
997
+ height: 30px !important;
998
+ }
1138
999
 
1139
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1140
- line-height: 4;
1141
- }
1000
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1001
+ .icon-minimize {
1002
+ height: 30px !important;
1003
+ }
1004
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1005
+ width: 4.5em;
1006
+ }
1007
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1008
+ height: min-content;
1009
+ }
1142
1010
 
1143
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1144
- .icon-minimize {
1011
+ .video-js.skin_news_live button.vjs-slowmo-button{
1145
1012
  display: none;
1146
- height: 32px;
1013
+ }
1014
+ .video-js.skin_news_live button.vjs-rewind-button{
1015
+ display: none;
1016
+ }
1017
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1018
+ height: 20px;
1019
+ }
1020
+ .video-js.skin_news_live .vjs-button{
1021
+ width: 4.8em;
1022
+ }
1023
+ .video-js.skin_news_live .widget-selection{
1024
+ display: none;
1025
+ }
1026
+ .video-js.skin_news_live .container{
1027
+ display: none !important;
1028
+ }
1029
+ .video-js.skin_news_live .vjs-control-bar{
1030
+ height: 4em !important;
1031
+ }
1032
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1033
+ font-size: 2.5em;
1034
+ line-height: 1.5;
1035
+ }
1036
+ .video-js.skin_news_live .vjs-play-progress:before {
1037
+ font-size: 1.2em;
1038
+ position: absolute;
1039
+ right: -0.5em;
1040
+ z-index: 1;
1147
1041
  }
1148
-
1149
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1150
- outline: none !important;
1042
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1043
+ height: 20px;
1151
1044
  }
1152
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1153
- .vjs-icon-fullscreen-enter:before {
1154
- /* content: '' !important; */
1045
+ .video-js.skin_news_live button.vjs-big-play-button {
1046
+ width: 50px !important;
1047
+ height: 50px !important;
1048
+ font-size: 2.1rem !important;
1155
1049
  }
1156
1050
 
1157
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1158
- display: flex;
1051
+ .stream-selector-icon>svg{
1052
+ width: 24px;
1053
+ height: 24px;
1054
+ }
1055
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1056
+ margin: 0 12px 0 12px;
1057
+ }
1058
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1059
+ font-size: 12px;
1060
+ }
1061
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1062
+ margin: 0 12px 0 12px;
1063
+ }
1064
+ }
1065
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1066
+ width: 90px;
1067
+ height: 90px;
1068
+ display: flex;
1069
+ justify-content: center;
1070
+ align-items: center;
1071
+ border-radius: 50%;
1072
+ position: absolute;
1073
+ top: 0;
1074
+ left: 0;
1075
+ right: 0;
1076
+ bottom: 0;
1077
+ margin: auto;
1078
+ font-size: 6em;
1079
+ line-height: 1.4em;
1080
+ }
1081
+
1082
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1083
+ display: flex;
1084
+ justify-content: center;
1085
+ align-items: center;
1086
+ height: 100%;
1087
+ transition: width 0.1s;
1088
+ }
1089
+
1090
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1091
+ display: flex;
1092
+ justify-content: center;
1093
+ align-items: center;
1094
+ height: 100%;
1095
+ transition: width 0.1s;
1096
+ }
1097
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1098
+ display: none !important;
1099
+ }
1100
+
1101
+ @media (max-width: 576px) {
1102
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1103
+ height: 5px !important;
1104
+ }
1105
+ .video-js.skin_news_live button.vjs-big-play-button {
1106
+ width: 50px !important;
1107
+ height: 50px !important;
1108
+ font-size: 2.1rem !important;
1109
+ }
1110
+
1111
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1112
+ display: none;
1113
+ }
1114
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1115
+ bottom: 2.4em !important;
1116
+ right: -1em;
1117
+ z-index: 1;
1118
+ }
1119
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1120
+ display: none !important;
1121
+ }
1122
+
1123
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1124
+ color: white !important;
1125
+ font-size: 13px !important;
1126
+ background-color: black !important;
1127
+ }
1128
+ }
1129
+
1130
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1131
+ width: 100% !important;
1132
+ }
1133
+
1134
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1135
+ color: white !important;
1136
+ font-size: 16px !important;
1137
+ background-color: black !important;
1138
+ }
1139
+
1140
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1141
+ margin-bottom: 2rem !important;
1142
+ }
1143
+
1144
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
1145
+ font-size: 18px !important;
1146
+ }
1147
+
1148
+
1149
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1150
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1151
+ font-size: 1.2em !important;
1152
+ line-height: 1.5em !important;
1153
+ padding: 0.2em 0.8em !important;
1154
+ }
1155
+
1156
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1157
+ content: none !important;
1158
+ fill: none !important;
1159
+ filter: none !important;
1160
+ }
1161
+
1162
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1163
+ color: rgba(255, 255, 2555, 0.7)!important;
1164
+ }
1165
+
1166
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1167
+ color: rgba(255, 255, 2555, 1)!important;
1168
+ }
1169
+
1170
+
1171
+
1172
+
1173
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1174
+ font-size: 2.2em;
1175
+ line-height: 2.6;
1176
+ }
1177
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1178
+ background: white;
1179
+ }
1180
+ .video-js.skin_news .vjs-control-bar{
1181
+ z-index: 1 !important;
1182
+ height: 5em !important;
1183
+ background: black !important;
1184
+ }
1185
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1186
+ display: flex;
1187
+ align-items: center;
1188
+ justify-content: center;
1189
+ }
1190
+
1191
+ .video-js.skin_news .vjs-fade>* {
1192
+ visibility: hidden !important;
1193
+ opacity: 0 !important;
1194
+ transition: visibility 1s, opacity 1s !important;
1195
+ }
1196
+
1197
+ .video-js.skin_news .custom-spaced-progress-bar {
1198
+ position: absolute;
1199
+ width: 100%;
1200
+ display: flex;
1201
+ height: 0.5em;
1202
+ top: -0.5em;
1203
+ }
1204
+
1205
+ .video-js.skin_news .vjs-progress-control {
1206
+ /* left: -6px; */
1207
+ position: relative;
1208
+ width: 100%;
1209
+ height: 0.5em;
1210
+ transition: height 0.1s, top 0.1s;
1211
+ }
1212
+
1213
+
1214
+
1215
+
1216
+ .video-js.skin_news .vjs-custom-control-spacer {
1217
+ display: block;
1218
+ flex: 1 1 auto;
1219
+ }
1220
+
1221
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1222
+ margin: 0 0px 0 0px;
1223
+ }
1224
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1225
+ display: none;
1226
+ }
1227
+
1228
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1229
+ font-size: 14px;
1230
+ font-weight: 500;
1231
+ align-self: center;
1232
+ height: min-content;
1233
+ padding: 5px 2px;
1234
+ border-radius: 8px;
1235
+ }
1236
+
1237
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1238
+ height: 6px !important;
1239
+ }
1240
+
1241
+ .video-js.skin_news .vjs-play-progress:before {
1242
+ font-size: 1.5em;
1243
+ line-height: unset;
1244
+ top: -0.3333333333em;
1245
+ }
1246
+
1247
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1248
+ display: none !important;
1249
+ }
1250
+
1251
+ /* */
1252
+ .video-js.skin_news .vjs-mouse-display{
1253
+ font-size: 1.6666666667em;
1254
+ }
1255
+
1256
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1257
+ font-size: 1em !important;
1258
+ }
1259
+
1260
+ .video-js.skin_news .vjs-button{
1261
+ width: 5.3em;
1262
+ display: flex;
1263
+ align-items: center;
1264
+ justify-content: center;
1265
+ }
1266
+
1267
+
1268
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1269
+ .icon-maximize {
1270
+ display: block;
1271
+ height: 32px;
1272
+ }
1273
+
1274
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1275
+ line-height: 4;
1276
+ }
1277
+
1278
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1279
+ .icon-minimize {
1280
+ display: none;
1281
+ height: 32px;
1282
+ }
1283
+
1284
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1285
+ outline: none !important;
1286
+ }
1287
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1288
+ .vjs-icon-fullscreen-enter:before {
1289
+ /* content: '' !important; */
1290
+ }
1291
+
1292
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1293
+ display: flex;
1159
1294
  justify-content: center;
1160
1295
  align-items: center;
1161
1296
  /* transform: rotate(90deg); */
@@ -1504,16 +1639,16 @@
1504
1639
  }
1505
1640
 
1506
1641
  .video-js.skin_news .vjs-text-track-display-ttml span {
1507
- color: white !important;
1508
- font-size: 13px !important;
1509
- background-color: black !important;
1642
+ color: white;
1643
+ font-size: 13px;
1644
+ background-color: black;
1510
1645
  }
1511
1646
  }
1512
1647
 
1513
1648
  .video-js.skin_news .vjs-text-track-display-ttml span {
1514
- color: white !important;
1515
- font-size: 16px !important;
1516
- background-color: black !important;
1649
+ color: white;
1650
+ font-size: 16px;
1651
+ background-color: black;
1517
1652
  }
1518
1653
 
1519
1654
  .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
@@ -1563,472 +1698,337 @@
1563
1698
 
1564
1699
 
1565
1700
 
1566
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1567
- font-size: 2.2em;
1568
- line-height: 2.6;
1569
- }
1570
- .video-js.skin_mini{
1571
- overflow: hidden;
1572
- }
1573
- .video-js.skin_mini .vjs-control-bar{
1574
- z-index: 1 !important;
1575
- height: 4em !important;
1576
- background: black !important;
1577
- }
1578
1701
 
1579
- .video-js.skin_mini .vjs-fade>* {
1580
- visibility: hidden !important;
1581
- opacity: 0 !important;
1582
- transition: visibility 1s, opacity 1s !important;
1702
+ .video-js.skin_cn_news .vjs-control-bar {
1703
+ z-index: 1 !important;
1704
+ height: auto !important;
1705
+ padding: 0.8em 30px 0.6em;
1706
+ background: transparent !important;
1707
+ display: flex;
1708
+ flex-wrap: wrap;
1709
+ align-items: center;
1710
+ column-gap: 10px;
1583
1711
  }
1584
1712
 
1585
- .video-js.skin_mini .custom-spaced-progress-bar {
1713
+
1714
+ .video-js.skin_cn_news .vjs-control-bar::before {
1715
+ content: '';
1586
1716
  position: absolute;
1587
- width: 100%;
1588
- display: flex;
1589
- height: 0.5em;
1590
- top: -0.5em;
1717
+ left: 0;
1718
+ right: 0;
1719
+ bottom: 0;
1720
+ top: -3em;
1721
+ background: linear-gradient(
1722
+ to top,
1723
+ rgba(0, 0, 0, 0.85) 0%,
1724
+ rgba(0, 0, 0, 0.7) 40%,
1725
+ rgba(0, 0, 0, 0.55) 70%,
1726
+ rgba(0, 0, 0, 0.38) 86%,
1727
+ transparent 100%
1728
+ );
1729
+ pointer-events: none;
1730
+ z-index: -1;
1591
1731
  }
1592
1732
 
1593
- .video-js.skin_mini .vjs-progress-control {
1594
- /* left: -6px; */
1733
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1734
+ order: -1;
1735
+ flex: 0 0 100%;
1736
+ width: 80%;
1737
+ margin: 0 0 5em;
1595
1738
  position: relative;
1596
- width: 100%;
1597
- height: 0.5em;
1598
- transition: height 0.1s, top 0.1s;
1599
1739
  }
1600
1740
 
1741
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1742
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1743
+ width: auto;
1744
+ min-width: 0;
1745
+ }
1746
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1747
+ display: inline-flex;
1748
+ align-items: center;
1749
+ justify-content: center;
1750
+ height: 7em;
1751
+ padding: 0 10px;
1752
+ color: #fff;
1753
+ }
1601
1754
 
1602
-
1603
-
1604
- .video-js.skin_mini .vjs-custom-control-spacer {
1605
- display: block;
1606
- flex: 1 1 auto;
1755
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1756
+ content: none !important;
1607
1757
  }
1608
1758
 
1609
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1610
- margin: 0 0px 0 0px;
1759
+
1760
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1761
+ display: inline-flex;
1762
+ align-items: center;
1763
+ justify-content: center;
1611
1764
  }
1612
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1613
- display: none;
1765
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1766
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1767
+ width: 24px;
1768
+ height: 24px;
1769
+ display: block;
1614
1770
  }
1615
1771
 
1616
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1617
- font-size: 14px;
1618
- font-weight: 500;
1619
- align-self: center;
1620
- height: min-content;
1621
- padding: 5px 2px;
1622
- border-radius: 8px;
1623
- }
1624
1772
 
1625
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1626
- height: 5px !important;
1627
- }
1628
1773
 
1629
- .video-js.skin_mini .vjs-play-progress:before {
1630
- font-size: 1.3em;
1631
- line-height: unset;
1632
- top: -0.3333333333em;
1774
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1775
+ opacity: 1;
1633
1776
  }
1634
1777
 
1635
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1636
- display: none !important;
1637
- }
1638
1778
 
1639
- /* */
1640
- .video-js.skin_mini .vjs-mouse-display{
1641
- font-size: 1.6666666667em;
1642
- }
1643
1779
 
1644
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1645
- font-size: 1em !important;
1780
+ .video-js.skin_cn_news .vjs-volume-panel {
1781
+ margin: 0;
1782
+ display: inline-flex;
1783
+ align-items: center;
1784
+ align-self: center;
1785
+ height: 2.2em;
1786
+ min-width: 7em;
1787
+ transition: none;
1646
1788
  }
1647
-
1648
- .video-js.skin_mini .vjs-button{
1649
- width: 3em;
1789
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1790
+ width: 0;
1791
+ height: 100%;
1650
1792
  display: flex;
1651
1793
  align-items: center;
1652
- justify-content: center;
1794
+ overflow: hidden;
1795
+ opacity: 0;
1796
+ transition: width 0.15s ease, opacity 0.15s ease;
1653
1797
  }
1654
-
1655
-
1656
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1657
- .icon-maximize {
1658
- display: block;
1659
- height: 32px;
1798
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1799
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1800
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1801
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1802
+ width: 5em;
1803
+ opacity: 1;
1660
1804
  }
1661
1805
 
1662
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1663
- line-height: 4;
1806
+ .video-js.skin_cn_news .vjs-volume-bar {
1807
+ width: 4em;
1808
+ height: 0.3em;
1809
+ margin: 0 0.45em;
1664
1810
  }
1665
1811
 
1666
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1667
- .icon-minimize {
1668
- display: none;
1669
- height: 32px;
1670
- }
1671
1812
 
1672
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1673
- outline: none !important;
1674
- }
1675
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1676
- .vjs-icon-fullscreen-enter:before {
1677
- /* content: '' !important; */
1813
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1814
+ display: none !important;
1678
1815
  }
1679
1816
 
1680
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1681
- display: flex;
1682
- justify-content: center;
1683
- align-items: center;
1684
- /* transform: rotate(90deg); */
1817
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1818
+ width: 0 !important;
1685
1819
  }
1686
1820
 
1687
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1688
- display: none;
1689
- }
1690
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1691
- margin-left: -10px;
1692
- display: none;
1693
- }
1694
1821
 
1695
- .video-js.skin_mini .vjs-loading-spinner {
1696
- position: absolute;
1697
- top: 50%;
1698
- left: 50%;
1699
- transform: translate(-50%, -50%);
1700
- opacity: .85;
1701
- text-align: left;
1702
- border: .2em solid rgba(43, 51, 63, .7);
1703
- box-sizing: border-box;
1704
- background-clip: padding-box;
1705
- width: 3em;
1706
- height: 3em;
1707
- border-radius: 50%;
1708
- visibility: hidden;
1822
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1823
+ display: block !important;
1824
+ flex: 1 1 auto;
1709
1825
  }
1710
1826
 
1711
- .video-js.skin_mini .skipbtn:hover{
1712
- cursor: pointer;
1713
- }
1714
1827
 
1715
- .video-js.skin_mini .rewindbtn:hover{
1716
- cursor: pointer;
1828
+ .video-js.skin_cn_news .vjs-big-play-button {
1829
+ display: none;
1717
1830
  }
1718
-
1719
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1720
- position: relative;
1721
- padding-left: 0;
1831
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1832
+ position: relative !important;
1833
+ display: flex;
1834
+ left: 0;
1835
+ top: -1px;
1722
1836
  }
1723
-
1724
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1725
- width: 40px;
1726
- height: 40px;
1837
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1727
1838
  display: flex;
1728
1839
  justify-content: center;
1729
1840
  align-items: center;
1730
- border: none;
1731
1841
  position: absolute;
1732
1842
  top: 0;
1733
1843
  left: 0;
1734
1844
  right: 0;
1735
1845
  bottom: 0;
1736
1846
  margin: auto;
1737
- font-size: 3em;
1847
+ width: 80px;
1848
+ height: 80px;
1849
+ border: none;
1850
+ border-radius: 50%;
1851
+ background: rgba(0, 0, 0, 0.55);
1852
+ font-size: 5em;
1738
1853
  line-height: 1.3em;
1739
1854
  transform: none !important;
1740
- border-radius: 1.3em;
1741
1855
  }
1742
1856
 
1743
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1744
- font-weight: bold;
1745
- }
1746
1857
 
1747
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1748
- bottom: 1.1em !important;
1749
- right: 1em;
1750
- z-index: 1;
1751
- font-size: 10px;
1858
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1859
+ height: 4px !important;
1860
+ margin: 0;
1861
+ border-radius: 20px;
1862
+ background-color: #393944;
1752
1863
  }
1753
1864
 
1754
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1755
- width: 24px !important;
1756
- height: 24px !important;
1757
- }
1758
- .video-js.skin_mini .settings-selector-icon>svg{
1759
- height: 19px !important;
1760
- width: 19px !important;
1865
+ .video-js.skin_cn_news .vjs-play-progress {
1866
+ background-color: #ffffff;
1867
+ border-radius: 20px;
1761
1868
  }
1762
1869
 
1763
-
1764
- .video-js.skin_mini button.vjs-rewind-button{
1765
- cursor: pointer;
1870
+ .video-js.skin_cn_news .vjs-load-progress,
1871
+ .video-js.skin_cn_news .vjs-load-progress div {
1872
+ background: rgba(255, 255, 255, 0.15);
1873
+ border-radius: 20px;
1766
1874
  }
1767
1875
 
1768
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1769
- padding-right: 0;
1770
- }
1771
1876
 
1772
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1773
- padding-left: 0;
1774
- }
1775
-
1776
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1777
- padding-left: 0;
1778
- padding-right: 0;
1779
- display: flex;
1780
- justify-content: center;
1781
- width: min-content;
1782
- }
1783
-
1784
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1785
- display: none
1786
- }
1787
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1788
- display: none
1789
- }
1790
-
1791
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1792
- display: flex;
1793
- align-items: center;
1794
- font-weight: 700;
1795
- font-size: 9px;
1796
- min-width: 0.8em;
1797
- padding-left: 0;
1798
- }
1799
-
1800
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1801
- display: none;
1802
- font-size: 11px;
1803
- justify-content: center;
1804
- align-items: center;
1805
- user-select: none;
1806
- }
1807
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1808
- display: none;
1809
- }
1810
-
1811
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1812
- height: min-content;
1813
- width: min-content;
1814
- }
1815
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1816
- width: 3em;
1817
- margin-right: 4px;
1818
- }
1819
-
1820
- .video-js.skin_mini .content{
1821
- bottom: 3.4rem !important;
1822
- right: -4rem !important;
1877
+ .video-js.skin_cn_news .vjs-play-progress:before {
1878
+ content: '';
1879
+ width: 16px;
1880
+ height: 16px;
1881
+ border-radius: 50%;
1882
+ background: #ffffff;
1883
+ border: 2px solid rgba(0, 0, 0, 0.6);
1884
+ box-sizing: border-box;
1885
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1886
+ top: -6px;
1887
+ right: -8px;
1888
+ position: absolute;
1823
1889
  }
1824
-
1825
- .video-js.skin_mini .setting-icon > svg{
1826
- height:18px !important;
1890
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1891
+ display: none !important;
1827
1892
  }
1828
1893
 
1829
- .output-overlay{
1830
- position: absolute;
1831
- bottom: 0;
1832
- height: 100%;
1833
- width: 100%;
1834
- z-index: 0;
1835
- border: 0;
1836
- pointer-events:none
1894
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1895
+ background: #ffffff;
1896
+ color: #0a0e17;
1897
+ font-weight: 700;
1898
+ border-radius: 3px;
1837
1899
  }
1838
1900
 
1839
- .video-js.skin_mini iframe{
1840
- width: 100%;
1841
- height: 100%;
1901
+ .video-js.skin_cn_news .vjs-live-control {
1902
+ display: none !important;
1842
1903
  }
1843
-
1844
- .video-js.skin_mini .vjs-live-control{
1904
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1905
+ display: inline-flex;
1845
1906
  align-items: center;
1846
- max-width: 5em;
1847
- }
1848
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1907
+ align-self: center;
1849
1908
  height: 2.2em;
1850
- display: flex;
1851
- align-items: center;
1852
- font-family: monospace;
1853
- width: 4em;
1854
- justify-content: center;
1855
- background: red;
1856
- margin: 4px 0px 4px 2px;
1909
+ gap: 5px;
1910
+ width: auto;
1911
+ padding: 0 10px;
1912
+ border: 1px solid rgba(255, 255, 255, 0.45);
1913
+ border-radius: 4px;
1914
+ cursor: pointer;
1857
1915
  }
1858
1916
 
1859
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1860
- text-shadow: none;
1861
- }
1862
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1917
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1863
1918
  display: none;
1864
- font-size: 12px;
1865
1919
  }
1866
-
1867
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1868
- height: 1.8em;
1920
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1869
1921
  display: inline-flex;
1870
1922
  align-items: center;
1871
- font-family: monospace;
1872
- justify-content: center;
1873
- border: 1.5px solid;
1874
- margin: 4px 0px 4px 2px;
1875
- white-space: pre;
1876
- padding: 2px 4px;
1877
- font-size: 1.2em;
1878
- font-weight: 500;
1879
- color: rgba(255, 255, 2555, 0.7);
1880
- }
1881
-
1882
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1883
- content: "NOT LIVE";
1884
- word-spacing: -4px;
1885
- }
1886
-
1887
-
1888
- @media(max-width:600px){
1889
- .tvProviderImage{
1890
- display: none
1891
- }
1892
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1893
- .icon-maximize {
1894
- height: 30px !important;
1895
- }
1896
-
1897
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1898
- .icon-minimize {
1899
- height: 30px !important;
1900
- }
1901
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1902
- width: 3.5em;
1903
- }
1904
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1905
- height: min-content;
1906
- }
1907
-
1908
- .video-js.skin_mini button.vjs-slowmo-button{
1909
- display: none;
1910
- }
1911
- .video-js.skin_mini button.vjs-rewind-button{
1912
- display: none;
1913
- }
1914
- .video-js.skin_mini button.vjs-rewind-button>svg{
1915
- height: 20px;
1916
- }
1917
- .video-js.skin_mini .vjs-button{
1918
- width: 3em;
1919
- }
1920
- .video-js.skin_mini .widget-selection{
1921
- display: none;
1922
- }
1923
- .video-js.skin_mini .container{
1924
- display: none !important;
1925
- }
1926
- .video-js.skin_mini .vjs-control-bar{
1927
- height: 4em !important;
1928
- }
1929
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1930
- font-size: 2.5em;
1931
- line-height: 1.5;
1932
- }
1933
- .video-js.skin_mini .vjs-play-progress:before {
1934
- font-size: 1.2em;
1935
- position: absolute;
1936
- right: -0.5em;
1937
- z-index: 1;
1938
1923
  }
1939
- .video-js.skin_mini button.vjs-skip-button>svg{
1940
- height: 20px;
1941
- }
1942
-
1943
- .stream-selector-icon>svg{
1944
- width: 24px;
1945
- height: 24px;
1924
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1925
+ content: '';
1926
+ display: inline-block;
1927
+ width: 8px;
1928
+ height: 8px;
1929
+ border-radius: 50%;
1930
+ background: #ff2d2d; /* red live dot */
1946
1931
  }
1947
- .video-js.skin_mini .vjs-seek-to-live-text{
1932
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1933
+ color: #ffffff;
1934
+ font-weight: 700;
1948
1935
  font-size: 12px;
1936
+ letter-spacing: 0.03em;
1949
1937
  }
1950
1938
 
1951
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1952
- color: white !important;
1953
- font-size: 16px !important;
1954
- background-color: rgba(0,0,0,0.2) !important;
1955
- }
1956
- }
1957
-
1958
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1959
- color: white !important;
1960
- font-size: 16px !important;
1961
- background-color: rgba(0,0,0,0.2) !important;
1939
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1940
+ border-color: transparent;
1962
1941
  }
1963
-
1964
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1965
- font-size: 18px !important;
1942
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1943
+ color: #ff2d2d;
1966
1944
  }
1967
1945
 
1968
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1969
- margin-bottom: 1rem !important;
1946
+ /* ---- time controls ---- */
1947
+ .video-js.skin_cn_news .vjs-current-time,
1948
+ .video-js.skin_cn_news .vjs-duration,
1949
+ .video-js.skin_cn_news .vjs-time-divider {
1950
+ display: none !important;
1970
1951
  }
1971
-
1972
-
1973
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1974
- display: flex;
1975
- justify-content: center;
1952
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1953
+ display: none;
1976
1954
  align-items: center;
1977
- height: 100%;
1978
- transition: width 0.1s;
1979
- }
1980
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1981
- margin: 2px;
1955
+ justify-content: center;
1956
+ font-size: 11px;
1957
+ font-weight: 700;
1958
+ color: #fff;
1959
+ padding: 0 6px;
1960
+ user-select: none;
1982
1961
  }
1983
1962
 
1984
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1985
- display: flex;
1986
- justify-content: center;
1987
- align-items: center;
1988
- height: 100%;
1989
- transition: width 0.1s;
1963
+
1964
+ .video-js.skin_cn_news .vjs-chapter-marker {
1965
+ z-index: 2;
1966
+ width: var(--vl-chapter-size, 8px);
1967
+ height: var(--vl-chapter-size, 8px);
1968
+ top: 50%;
1969
+ bottom: auto;
1970
+ background: var(--vl-chapter-color, #ffffff);
1971
+ opacity: var(--vl-chapter-opacity, 1);
1972
+ border-radius: 50%;
1973
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1974
+ transform: translate(-50%, -50%) scale(1);
1975
+ transition: background-color 0.12s ease;
1990
1976
  }
1991
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1992
- display: grid;
1993
- font-size: 10px;
1994
- grid-template-columns: 1fr;
1995
- grid-template-rows: 1fr;
1996
- padding: 1px 0px 0 0px;
1997
- margin: 0;
1977
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1978
+ background: var(--vl-chapter-hover, #0a5cff);
1979
+ }
1980
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1981
+ background: var(--vl-chapter-active, #0a5cff);
1998
1982
  }
1999
1983
 
2000
- @media (max-width: 600px) {
2001
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
2002
- height: 5px !important;
2003
- }
2004
-
2005
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2006
- display: none;
2007
- }
2008
1984
 
1985
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1986
+ width: 16px;
1987
+ height: 16px;
1988
+ bottom: 160%;
1989
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
2009
1990
  }
2010
1991
 
2011
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2012
- content: none !important;
2013
- fill: none !important;
2014
- filter: none !important;
2015
- }
2016
1992
 
2017
- /* svg icons opacity and hover effect */
2018
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2019
- opacity: 0.7 !important;
1993
+ .video-js.skin_cn_news .vjs-chapter-preview {
1994
+ background: var(--vl-chapter-tooltip, #0a5cff);
1995
+ border-radius: 6px;
1996
+ padding: 8px 10px;
1997
+ width: max-content;
1998
+ max-width: 300px;
1999
+ text-align: left;
2000
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2020
2001
  }
2021
-
2022
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2023
- opacity: 1 !important;
2002
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2003
+ color: #ffffff;
2004
+ font-size: 13px;
2005
+ font-weight: 400;
2006
+ margin-bottom: 2px;
2024
2007
  }
2025
-
2026
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2027
- color: rgba(255, 255, 2555, 0.7)!important;
2008
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2009
+ color: #ffffff;
2010
+ font-size: 13px;
2011
+ font-weight: 400;
2012
+ line-height: 1.3;
2013
+ white-space: normal;
2014
+ text-align: left;
2015
+ }
2016
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2017
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2028
2018
  }
2029
2019
 
2030
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2031
- color: rgba(255, 255, 2555, 1)!important;
2020
+ /* ---- responsive ---- */
2021
+ @media (max-width: 576px) {
2022
+ .video-js.skin_cn_news .vjs-control-bar {
2023
+ height: 3.2em !important;
2024
+ padding: 0 8px;
2025
+ }
2026
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2027
+ padding: 0 6px;
2028
+ }
2029
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2030
+ display: none !important;
2031
+ }
2032
2032
  }
2033
2033
 
2034
2034
 
@@ -2212,6 +2212,7 @@
2212
2212
 
2213
2213
 
2214
2214
 
2215
+
2215
2216
  .video-js .multicamera-parent.default{
2216
2217
  height: 345px;
2217
2218
  position: absolute;
@@ -2290,11 +2291,6 @@
2290
2291
  align-content: baseline;
2291
2292
  }
2292
2293
 
2293
-
2294
-
2295
-
2296
-
2297
-
2298
2294
  .vjs-custom-big-mute.vjs-control{
2299
2295
  position: absolute;
2300
2296
  align-items: center;
@@ -2343,81 +2339,330 @@
2343
2339
  width: 22px;
2344
2340
  }
2345
2341
 
2346
- /* nextep */
2347
- .next-ep-preview{
2342
+
2343
+
2344
+
2345
+
2346
+ /* nextep — up-next card (centered in player, scales with player size) */
2347
+ .video-js:has(.next-ep-preview),
2348
+ .video-js:has(.next-ep-preview-player-thumb) {
2349
+ position: relative;
2350
+ }
2351
+
2352
+ .next-ep-preview {
2353
+ container-type: inline-size;
2354
+ container-name: next-ep-preview;
2355
+
2348
2356
  position: absolute;
2349
- height: min-content;
2350
- width: 300px;
2351
- bottom: 16%;
2352
- right: 1.5%;
2353
- padding: 13px;
2357
+ top: 50%;
2358
+ left: 50%;
2359
+ right: auto;
2360
+ bottom: auto;
2361
+ transform: translate(-50%, -50%);
2362
+ z-index: 15;
2363
+
2364
+ box-sizing: border-box;
2365
+ width: min(92%, 16rem);
2366
+ max-width: calc(100% - 1.5rem);
2367
+ max-height: min(90%, 100%);
2368
+ overflow: auto;
2369
+ overscroll-behavior: contain;
2370
+
2371
+ padding: clamp(0.625rem, 3.5cqi, 1rem) clamp(0.75rem, 4cqi, 1rem);
2372
+ border-radius: clamp(0.5rem, 2cqi, 0.75rem);
2373
+
2374
+ font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
2375
+ color: #fff;
2376
+ }
2377
+
2378
+ .next-heading-wrapper {
2379
+ display: flex;
2380
+ flex-direction: row;
2381
+ justify-content: space-between;
2382
+ align-items: flex-start;
2383
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2384
+ margin-bottom: clamp(0.375rem, 2.5cqi, 0.5rem);
2385
+ }
2386
+
2387
+ .next-ep-header {
2388
+ display: flex;
2389
+ flex-direction: row;
2390
+ flex-wrap: wrap;
2391
+ align-items: baseline;
2392
+ gap: 0.35em;
2393
+ flex: 1;
2394
+ min-width: 0;
2395
+ text-align: left;
2396
+ font-weight: 600;
2397
+ font-size: clamp(0.5625rem, 3.2cqi, 0.6875rem);
2398
+ color: rgba(255, 255, 255, 0.95);
2399
+ margin: 0;
2400
+ }
2401
+
2402
+ .next-ep-header-text {
2403
+ flex-shrink: 0;
2404
+ }
2405
+
2406
+ .next-ep-header .next-ep-duration {
2407
+ flex-shrink: 0;
2408
+ font-weight: 700;
2409
+ color: #fff;
2410
+ }
2411
+
2412
+ .next-ep-close {
2413
+ display: flex;
2414
+ align-items: center;
2415
+ justify-content: center;
2416
+ flex-shrink: 0;
2417
+ padding: clamp(0.125rem, 1cqi, 0.25rem) clamp(0.25rem, 1.5cqi, 0.25rem);
2418
+ margin: 0;
2354
2419
  border-radius: 4px;
2355
- background: rgba(0, 0, 0, 0.75);
2420
+ cursor: pointer;
2421
+ color: rgba(255, 255, 255, 0.85);
2422
+ line-height: 0;
2423
+ opacity: 0.9;
2356
2424
  }
2357
- .next-ep-img{
2358
- width: 185px;
2359
- height: 95px;
2360
-
2425
+
2426
+ .next-ep-close:hover {
2427
+ opacity: 1;
2428
+ }
2429
+
2430
+ .next-ep-close svg {
2431
+ width: clamp(0.75rem, 4cqi, 1rem);
2432
+ height: clamp(0.75rem, 4cqi, 1rem);
2433
+ }
2434
+
2435
+ .next-ep-content {
2436
+ display: flex;
2437
+ flex-direction: column;
2438
+ align-items: stretch;
2439
+ gap: clamp(0.5rem, 3cqi, 0.75rem);
2440
+ cursor: pointer;
2441
+ min-width: 0;
2442
+ }
2443
+
2444
+ .next-ep-content:hover {
2445
+ opacity: 0.98;
2446
+ }
2447
+
2448
+ .next-ep-thumb-wrap {
2449
+ position: relative;
2450
+ width: 100%;
2451
+ aspect-ratio: 16 / 9;
2452
+ border-radius: clamp(0.375rem, 2cqi, 0.5rem);
2453
+ overflow: hidden;
2454
+ background: #1a1a1a;
2361
2455
  }
2362
- .next-ep-img-container{
2456
+
2457
+ .next-ep-img {
2363
2458
  width: 100%;
2364
2459
  height: 100%;
2460
+ object-fit: cover;
2461
+ display: block;
2365
2462
  }
2366
- .next-ep-header{
2367
- text-align: left;
2368
- font-weight: bold;
2369
- font-size: 18px;
2370
- margin-bottom: 8px;
2463
+
2464
+ .next-ep-thumb-runtime {
2465
+ position: absolute;
2466
+ left: clamp(0.375rem, 2.5cqi, 0.625rem);
2467
+ bottom: clamp(0.375rem, 2.5cqi, 0.625rem);
2468
+ padding: clamp(0.125rem, 1cqi, 0.1875rem) clamp(0.375rem, 2cqi, 0.5rem);
2469
+ border-radius: 999px;
2470
+ font-size: clamp(0.5625rem, 2.8cqi, 0.6875rem);
2471
+ font-weight: 600;
2472
+ color: #fff;
2473
+ background: rgba(0, 0, 0, 0.65);
2474
+ letter-spacing: 0.02em;
2475
+ }
2476
+
2477
+ .next-ep-thumb-runtime--empty {
2478
+ display: none;
2371
2479
  }
2372
2480
 
2373
- .next-ep-title{
2374
- font-size: 15px;
2375
- margin-left: 8px;
2481
+ .next-ep-meta-with-logo {
2482
+ display: flex;
2483
+ flex-direction: row;
2484
+ align-items: flex-start;
2485
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2486
+ min-width: 0;
2487
+ }
2376
2488
 
2489
+ .next-ep-meta-with-logo > .next-ep-meta {
2490
+ flex: 1;
2491
+ min-width: 0;
2377
2492
  }
2378
2493
 
2379
- .next-ep-content{
2494
+ .next-ep-meta {
2380
2495
  display: flex;
2381
- align-items: center;
2496
+ flex-direction: column;
2497
+ gap: 0;
2498
+ min-width: 0;
2382
2499
  }
2383
- .next-ep-content:hover{
2384
- cursor: pointer;
2500
+
2501
+ .next-ep-title {
2502
+ font-size: clamp(0.75rem, 4.5cqi, 0.875rem);
2503
+ font-weight: 700;
2504
+ line-height: 1.25;
2505
+ color: #fff;
2506
+ margin: 0;
2507
+ min-width: 0;
2508
+ white-space: nowrap;
2509
+ overflow: hidden;
2510
+ text-overflow: ellipsis;
2511
+ }
2512
+
2513
+ .next-ep-desc {
2514
+ font-size: clamp(0.6875rem, 3.8cqi, 0.75rem);
2515
+ font-weight: 400;
2516
+ line-height: 1.35;
2517
+ color: rgba(255, 255, 255, 0.82);
2518
+ margin: 0;
2519
+ margin-top: 3px;
2520
+ min-width: 0;
2521
+ white-space: nowrap;
2522
+ overflow: hidden;
2523
+ text-overflow: ellipsis;
2524
+ }
2525
+
2526
+ .next-ep-desc--empty {
2527
+ display: none;
2385
2528
  }
2386
- .next-heading-wrapper{
2529
+
2530
+ .next-ep-meta-row {
2387
2531
  display: flex;
2388
- flex-direction: unset;
2389
- justify-content: space-between;
2532
+ flex-direction: row;
2390
2533
  align-items: center;
2534
+ justify-content: flex-start;
2535
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2536
+ margin-top: 2px;
2537
+ min-width: 0;
2391
2538
  }
2392
- .next-ep-close{
2393
- align-items: right;
2394
- font-weight: bold;
2395
- font-size: 18px;
2396
- margin-bottom: 8px;
2397
- font-size: 20px;
2539
+
2540
+ .next-ep-meta-row-left {
2541
+ display: flex;
2542
+ flex-direction: row;
2543
+ align-items: center;
2544
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2545
+ min-width: 0;
2546
+ flex: 1;
2547
+ }
2548
+
2549
+ .next-ep-badge {
2550
+ flex-shrink: 0;
2551
+ font-size: clamp(0.5rem, 2.6cqi, 0.625rem);
2552
+ font-weight: 600;
2553
+ letter-spacing: 0.08em;
2554
+ text-transform: uppercase;
2555
+ padding: clamp(0.0625rem, 0.8cqi, 0.125rem) clamp(0.1875rem, 1.6cqi, 0.25rem);
2556
+ border: 1px solid rgba(255, 255, 255, 0.75);
2398
2557
  border-radius: 3px;
2399
- cursor: pointer;
2558
+ color: rgba(255, 255, 255, 0.95);
2400
2559
  }
2401
2560
 
2402
- @media (max-width:600px){
2403
- .next-ep-preview{
2404
- width: 170px;
2405
- right: 2.5%;
2406
- padding: 6px;
2407
- bottom: 56px;
2408
- }
2409
- .next-ep-header{
2410
- font-size: 12px;
2411
- }
2412
- .next-ep-img {
2413
- width: 100px;
2414
- height: 60px;
2561
+ .next-ep-badge--empty {
2562
+ display: none;
2563
+ }
2564
+
2565
+ .next-ep-episode {
2566
+ font-size: clamp(0.6875rem, 3.6cqi, 0.75rem);
2567
+ color: rgba(255, 255, 255, 0.88);
2568
+ white-space: nowrap;
2569
+ overflow: hidden;
2570
+ text-overflow: ellipsis;
2571
+ min-width: 0;
2572
+ }
2573
+
2574
+ .next-ep-network-logo {
2575
+ flex-shrink: 0;
2576
+ max-height: clamp(0.875rem, 5cqi, 1.375rem);
2577
+ max-width: clamp(2.5rem, 14cqi, 3.5rem);
2578
+ width: auto;
2579
+ height: auto;
2580
+ object-fit: contain;
2581
+ opacity: 0.98;
2582
+ }
2583
+
2584
+ .next-ep-network-logo--empty {
2585
+ display: none;
2586
+ }
2587
+
2588
+ /* Narrow card: stack meta and network logo */
2589
+ @container next-ep-preview (max-width: 220px) {
2590
+ .next-ep-meta-with-logo {
2591
+ flex-direction: column;
2592
+ align-items: flex-start;
2415
2593
  }
2416
- .next-ep-title {
2417
- font-size: 9px;
2418
- margin-left: 8px;
2594
+
2595
+ .next-ep-network-logo {
2596
+ align-self: flex-end;
2419
2597
  }
2420
2598
  }
2599
+
2600
+ /* Full-player thumbnail while the next episode asset loads */
2601
+ .video-js.next-ep-load-pending {
2602
+ position: relative;
2603
+ }
2604
+
2605
+ .next-ep-preview-player-thumb {
2606
+ position: absolute;
2607
+ inset: 0;
2608
+ z-index: 5;
2609
+ overflow: hidden;
2610
+ background: #000;
2611
+ pointer-events: none;
2612
+ }
2613
+
2614
+ .next-ep-load-overlay {
2615
+ position: absolute;
2616
+ inset: 0;
2617
+ z-index: 10;
2618
+ overflow: hidden;
2619
+ background: #000;
2620
+ pointer-events: none;
2621
+ }
2622
+
2623
+ .next-ep-load-overlay-img {
2624
+ width: 100%;
2625
+ height: 100%;
2626
+ object-fit: cover;
2627
+ display: block;
2628
+ }
2629
+
2630
+ .video-js.next-ep-load-pending .vjs-loading-spinner {
2631
+ z-index: 30 !important;
2632
+ }
2633
+
2634
+ /* a wrapper element that tracks the mouse vertically */
2635
+ .vjs-thumbnail-holder {
2636
+ position: absolute;
2637
+ left: -1000px;
2638
+ }
2639
+
2640
+ /* the thumbnail image itself */
2641
+ .vjs-thumbnail {
2642
+ position: absolute;
2643
+ left: 0;
2644
+ bottom: 1.3em;
2645
+ opacity: 0;
2646
+ transition: opacity .2s ease;
2647
+ -webkit-transition: opacity .2s ease;
2648
+ -moz-transition: opacity .2s ease;
2649
+ -mz-transition: opacity .2s ease;
2650
+ }
2651
+
2652
+ /* fade in the thumbnail when hovering over the progress bar */
2653
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2654
+ .vjs-progress-control:hover .vjs-thumbnail,
2655
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2656
+ .vjs-progress-control:active .vjs-thumbnail {
2657
+ opacity: 1;
2658
+ }
2659
+
2660
+ /* ... but hide the thumbnail when hovering directly over it */
2661
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2662
+ .vjs-progress-control:active .vjs-thumbnail:active {
2663
+ opacity: 0;
2664
+ }
2665
+
2421
2666
  .video-js.vjs-quality-menu {
2422
2667
  display: block;
2423
2668
  }
@@ -2488,38 +2733,6 @@
2488
2733
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2489
2734
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2490
2735
  }
2491
- /* a wrapper element that tracks the mouse vertically */
2492
- .vjs-thumbnail-holder {
2493
- position: absolute;
2494
- left: -1000px;
2495
- }
2496
-
2497
- /* the thumbnail image itself */
2498
- .vjs-thumbnail {
2499
- position: absolute;
2500
- left: 0;
2501
- bottom: 1.3em;
2502
- opacity: 0;
2503
- transition: opacity .2s ease;
2504
- -webkit-transition: opacity .2s ease;
2505
- -moz-transition: opacity .2s ease;
2506
- -mz-transition: opacity .2s ease;
2507
- }
2508
-
2509
- /* fade in the thumbnail when hovering over the progress bar */
2510
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2511
- .vjs-progress-control:hover .vjs-thumbnail,
2512
- .vjs-progress-control.fake-active .vjs-thumbnail,
2513
- .vjs-progress-control:active .vjs-thumbnail {
2514
- opacity: 1;
2515
- }
2516
-
2517
- /* ... but hide the thumbnail when hovering directly over it */
2518
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2519
- .vjs-progress-control:active .vjs-thumbnail:active {
2520
- opacity: 0;
2521
- }
2522
-
2523
2736
  .vjs-poster {
2524
2737
  display: inline-block;
2525
2738
  vertical-align: middle;