@viewlift/player-backup 2.0.363-backup → 2.0.365-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 (59) hide show
  1. package/cjs/{autoNextVideo-b57fd94e.js → autoNextVideo-811e11da.js} +1 -1
  2. package/cjs/bundle.css +1009 -1009
  3. package/cjs/{features-84532cac.js → features-0936b5af.js} +1 -1
  4. package/cjs/generic-13a91ec5.js +1 -0
  5. package/cjs/{index-d28c1d04.js → index-60892626.js} +1 -1
  6. package/cjs/{index-ee9cb57f.js → index-df20371f.js} +1 -1
  7. package/cjs/{index-66e473f7.js → index-e90e7409.js} +1 -1
  8. package/cjs/{index-27a62060.js → index-f13b3d8f.js} +1 -1
  9. package/cjs/index.js +1 -1
  10. package/cjs/{multicamv2-96472b7c.js → multicamv2-56ccadee.js} +1 -1
  11. package/cjs/{multicamv2-a3b15f57.js → multicamv2-69695db2.js} +1 -1
  12. package/cjs/{nextEpisodeButton-0e7c699e.js → nextEpisodeButton-44695234.js} +1 -1
  13. package/cjs/{playlist-6dbaae47.js → playlist-7d9d7801.js} +1 -1
  14. package/cjs/{series-3754d0a9.js → series-cb2f703d.js} +1 -1
  15. package/cjs/{series-v2-00ad95c3.js → series-v2-22d33a71.js} +1 -1
  16. package/cjs/{series-v2-faf6c719.js → series-v2-62561a7d.js} +1 -1
  17. package/cjs/{skin-c211c3a9.js → skin-34daa5af.js} +1 -1
  18. package/cjs/{skin-5e92eba9.js → skin-3e5b38ec.js} +1 -1
  19. package/cjs/{skin-eecb289d.js → skin-4ff70a8a.js} +1 -1
  20. package/cjs/{skin-13c66191.js → skin-519c290a.js} +1 -1
  21. package/cjs/{skin-65a80a93.js → skin-9592b2ba.js} +1 -1
  22. package/cjs/{skin-e3d5c1a7.js → skin-a80f284c.js} +1 -1
  23. package/cjs/{skin-0220bbd7.js → skin-ac1c1c07.js} +1 -1
  24. package/cjs/{skin-5f049521.js → skin-c3d9dece.js} +1 -1
  25. package/cjs/{skin-2b08e648.js → skin-c7f4269a.js} +1 -1
  26. package/cjs/{skin-8111bf49.js → skin-cda77c59.js} +1 -1
  27. package/cjs/{videoSelector-99835c7d.js → videoSelector-1f3df3f8.js} +1 -1
  28. package/cjs/{videoSelector-0bd954a8.js → videoSelector-e68f8389.js} +1 -1
  29. package/esm/{autoNextVideo-ca468d20.js → autoNextVideo-e2b1c087.js} +1 -1
  30. package/esm/bundle.css +1009 -1009
  31. package/esm/{features-0d4290a8.js → features-8deec72c.js} +1 -1
  32. package/esm/generic-0d0a277e.js +1 -0
  33. package/esm/{index-c276e2a6.js → index-85075eee.js} +1 -1
  34. package/esm/{index-eded6cb0.js → index-e17032b4.js} +1 -1
  35. package/esm/{index-4be0bb5b.js → index-f2a77538.js} +1 -1
  36. package/esm/{index-e096af23.js → index-fa30d136.js} +1 -1
  37. package/esm/index.js +1 -1
  38. package/esm/{multicamv2-63047664.js → multicamv2-8156b632.js} +1 -1
  39. package/esm/{multicamv2-7b8465e8.js → multicamv2-e4093591.js} +1 -1
  40. package/esm/{nextEpisodeButton-a3ed5cde.js → nextEpisodeButton-7cc5e2ab.js} +1 -1
  41. package/esm/{playlist-41378efa.js → playlist-2e496036.js} +1 -1
  42. package/esm/{series-b9736092.js → series-e503b7c7.js} +1 -1
  43. package/esm/{series-v2-1d1e574d.js → series-v2-8ad15b53.js} +1 -1
  44. package/esm/{series-v2-768b237e.js → series-v2-b1a87193.js} +1 -1
  45. package/esm/{skin-30bed6f1.js → skin-2d84c046.js} +1 -1
  46. package/esm/{skin-eb02f212.js → skin-49baa314.js} +1 -1
  47. package/esm/{skin-05244e25.js → skin-577dd99f.js} +1 -1
  48. package/esm/{skin-5dd350fb.js → skin-726aae93.js} +1 -1
  49. package/esm/{skin-012028ab.js → skin-82f255a6.js} +1 -1
  50. package/esm/{skin-35b6305b.js → skin-872f78ab.js} +1 -1
  51. package/esm/{skin-5bafce20.js → skin-9f14475f.js} +1 -1
  52. package/esm/{skin-322d12ce.js → skin-a647d0aa.js} +1 -1
  53. package/esm/{skin-9126d695.js → skin-d339138a.js} +1 -1
  54. package/esm/{skin-62c1d140.js → skin-d938243c.js} +1 -1
  55. package/esm/{videoSelector-f3f07a76.js → videoSelector-282e3b13.js} +1 -1
  56. package/esm/{videoSelector-323e9112.js → videoSelector-90350493.js} +1 -1
  57. package/package.json +3 -2
  58. package/cjs/generic-ca18a946.js +0 -1
  59. package/esm/generic-6c14b09e.js +0 -1
package/cjs/bundle.css CHANGED
@@ -2,33 +2,232 @@
2
2
 
3
3
 
4
4
 
5
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
6
+ height: 0.7em !important;
7
+ position: absolute !important;
8
+ top: -0.7em !important;
9
+ width: 100% !important;
10
+ }
11
+
12
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
13
+ height: 100%;
14
+ }
5
15
 
16
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
17
+ line-height: 2.5;
18
+ }
6
19
 
7
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
20
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
21
+ height: 19px;
22
+ width: 19px;
23
+ cursor: pointer;
24
+ }
25
+ .video-js.skin_vlone .vjs-control {
26
+ user-select: none;
27
+ }
28
+ .video-js.skin_vlone .vjs-custom-control-spacer{
29
+ user-select: none;
30
+ }
31
+
32
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
33
+ height: 19px;
34
+ width: 19px;
35
+ cursor: pointer;
36
+ }
37
+
38
+ .video-js.skin_vlone .vjs-play-progress:before {
39
+ display: none !important;
40
+ }
41
+
42
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
43
+ margin: 0 !important;
44
+
45
+ }
46
+
47
+
48
+ .video-js.skin_vlone .vjs-custom-control-spacer {
49
+ display: block;
50
+ flex: 1 1 auto;
51
+ }
52
+
53
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
54
+ z-index: 1;
55
+ }
56
+
57
+
58
+ .video-js.skin_vlone .vjs-control-bar {
59
+ height: 40px;
60
+ }
61
+
62
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
63
+ .vjs-button>.vjs-icon-placeholder:before {
64
+ position: relative !important;
65
+ }
66
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
67
+ display: flex;
68
+ left: 0px;
69
+ top: -1px;
70
+ }
71
+
72
+ .vjs-button>.vjs-icon-placeholder:before {
73
+ font-size: 2em !important;
74
+ }
75
+
76
+ .video-js.skin_vlone .vjs-control {
77
+ width: 4.3em;
78
+ }
79
+
80
+ .vjs-menu-button-popup .vjs-menu {
81
+ bottom: 10px !important;
82
+ }
83
+
84
+
85
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
86
+ height: 1.3em !important;
87
+ position: absolute !important;
88
+ top: -1.3em !important;
89
+ transition: height 0.3s, top 0.3s !important;
90
+ }
91
+
92
+
93
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
94
+ display: none !important;
95
+ }
96
+
97
+ .video-js.skin_vlone .vjs-time-control {
98
+ display: block;
99
+ }
100
+ .video-js.skin_vlone .vjs-remaining-time {
101
+ display: none;
102
+ }
103
+
104
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
105
+ line-height: 3.5em;
106
+ font-size: 1.1em;
107
+ min-width: 4em;
108
+ }
109
+
110
+ .video-js.skin_vlone .vjs-time-divider > div{
111
+ display: flex;
112
+ justify-content: center;
113
+ }
114
+
115
+ .video-js.skin_vlone .vjs-live-control{
116
+ align-items: center;
117
+ }
118
+ .video-js.skin_vlone .vjs-live-display{
119
+ height: 2.2em;
120
+ display: flex;
121
+ align-items: center;
122
+ font-family: monospace;
123
+ width: 4em;
124
+ justify-content: center;
125
+ background: red;
126
+ margin: 4px 0px 4px 12px;
127
+ }
128
+ .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
129
+ background: #6b6b6b;
130
+ }
131
+ .video-js.skin_vlone .vjs-live-display:hover{
132
+ cursor: pointer;
133
+ }
134
+
135
+ .video-js.skin_vlone .vjs-time-control {
136
+ line-height: 3.5em !important;
137
+ font-size: 1.1em !important;
138
+ width: min-content !important;
139
+ min-width: 1.5em;
140
+ padding: 0 !important;
141
+ user-select: none;
142
+ }
143
+
144
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
145
+ margin-left: 16px !important;
146
+ }
147
+
148
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
149
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
150
+ font-size: 1.2em !important;
151
+ line-height: 1.5em !important;
152
+ padding: 0.2em 0.8em !important;
153
+ }
154
+
155
+
156
+ /* Big play */
157
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
158
+ width: 80px;
159
+ height: 80px;
160
+ display: flex;
161
+ justify-content: center;
162
+ align-items: center;
163
+ border: none;
164
+ position: absolute;
165
+ top: 0;
166
+ left: 0;
167
+ right: 0;
168
+ bottom: 0;
169
+ margin: auto;
170
+ font-size: 5em;
171
+ line-height: 1.3em;
172
+ transform: none !important;
173
+ border-radius: 1.3em;
174
+ }
175
+ .video-js.skin_vlone .ssai-ad-container{
176
+ position: absolute;
177
+ bottom: 4px;
178
+ }
179
+
180
+ @media(max-width:600px){
181
+ .video-js.skin_vlone button.vjs-big-play-button {
182
+ width: 50px !important;
183
+ height: 50px !important;
184
+ font-size: 2.1rem !important;
185
+ }
186
+
187
+ .video-js.skin_vlone .ssai-ad-container {
188
+ position: absolute;
189
+ bottom: 2px;
190
+ }
191
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
192
+ display: none;
193
+ }
194
+
195
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
196
+ /* display: none; */
197
+ }
198
+
199
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
200
+ /* display: none; */
201
+ }
202
+ }
203
+ .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
204
+ text-decoration: underline;
205
+ }
206
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
8
207
  font-size: 2.2em;
9
208
  line-height: 2.6;
10
209
  }
11
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
12
- background: white;
210
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
211
+ background: #fcb700;
13
212
  }
14
- .video-js.skin_news .vjs-control-bar{
213
+ .video-js.skin_news_live .vjs-control-bar{
15
214
  z-index: 1 !important;
16
215
  height: 5em !important;
17
216
  background: black !important;
18
217
  }
19
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
218
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
20
219
  display: flex;
21
220
  align-items: center;
22
221
  justify-content: center;
23
222
  }
24
223
 
25
- .video-js.skin_news .vjs-fade>* {
224
+ .video-js.skin_news_live .vjs-fade>* {
26
225
  visibility: hidden !important;
27
226
  opacity: 0 !important;
28
227
  transition: visibility 1s, opacity 1s !important;
29
228
  }
30
229
 
31
- .video-js.skin_news .custom-spaced-progress-bar {
230
+ .video-js.skin_news_live .custom-spaced-progress-bar {
32
231
  position: absolute;
33
232
  width: 100%;
34
233
  display: flex;
@@ -36,7 +235,7 @@
36
235
  top: -0.5em;
37
236
  }
38
237
 
39
- .video-js.skin_news .vjs-progress-control {
238
+ .video-js.skin_news_live .vjs-progress-control {
40
239
  /* left: -6px; */
41
240
  position: relative;
42
241
  width: 100%;
@@ -44,22 +243,25 @@
44
243
  transition: height 0.1s, top 0.1s;
45
244
  }
46
245
 
246
+ .video-js.skin_news_live .vjs-volume-panel{
247
+ min-width: 5.3em;
248
+ }
47
249
 
48
250
 
49
251
 
50
- .video-js.skin_news .vjs-custom-control-spacer {
51
- display: block;
52
- flex: 1 1 auto;
252
+ .video-js.skin_news_live .vjs-custom-control-spacer {
253
+ /* display: block; */
254
+ /* flex: 1 1 auto; */
53
255
  }
54
256
 
55
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
257
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
56
258
  margin: 0 0px 0 0px;
57
259
  }
58
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
260
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
59
261
  display: none;
60
262
  }
61
263
 
62
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
264
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
63
265
  font-size: 14px;
64
266
  font-weight: 500;
65
267
  align-self: center;
@@ -68,30 +270,30 @@
68
270
  border-radius: 8px;
69
271
  }
70
272
 
71
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
273
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
72
274
  height: 6px !important;
73
275
  }
74
276
 
75
- .video-js.skin_news .vjs-play-progress:before {
277
+ .video-js.skin_news_live .vjs-play-progress:before {
76
278
  font-size: 1.5em;
77
279
  line-height: unset;
78
280
  top: -0.3333333333em;
79
281
  }
80
282
 
81
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
283
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
82
284
  display: none !important;
83
285
  }
84
286
 
85
287
  /* */
86
- .video-js.skin_news .vjs-mouse-display{
288
+ .video-js.skin_news_live .vjs-mouse-display{
87
289
  font-size: 1.6666666667em;
88
290
  }
89
291
 
90
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
292
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
91
293
  font-size: 1em !important;
92
294
  }
93
295
 
94
- .video-js.skin_news .vjs-button{
296
+ .video-js.skin_news_live .vjs-button{
95
297
  width: 5.3em;
96
298
  display: flex;
97
299
  align-items: center;
@@ -99,63 +301,71 @@
99
301
  }
100
302
 
101
303
 
102
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
304
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
103
305
  .icon-maximize {
104
306
  display: block;
105
307
  height: 32px;
106
308
  }
107
309
 
108
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
310
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
109
311
  line-height: 4;
110
312
  }
111
313
 
112
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
314
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
113
315
  .icon-minimize {
114
316
  display: none;
115
317
  height: 32px;
116
318
  }
117
319
 
118
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
320
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
119
321
  outline: none !important;
322
+ /* flex: 1; */
120
323
  }
121
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
122
- .vjs-icon-fullscreen-enter:before {
123
- /* content: '' !important; */
124
- }
125
-
126
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
324
+ .video-js.skin_news_live .vjs-play-toggle-container{
325
+ display: flex;
326
+ flex: 1;
327
+ justify-content: center;
328
+ }
329
+
330
+
331
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
332
+ .vjs-icon-fullscreen-enter:before {
333
+ /* content: '' !important; */
334
+ }
335
+
336
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
127
337
  display: flex;
128
338
  justify-content: center;
129
339
  align-items: center;
130
340
  /* transform: rotate(90deg); */
131
341
  }
132
342
 
133
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
343
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
134
344
  display: none;
135
345
  }
136
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
346
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
137
347
  margin-left: -10px;
138
348
  }
139
349
 
140
- .video-js.skin_news .skipbtn:hover{
350
+ .video-js.skin_news_live .skipbtn:hover{
141
351
  cursor: pointer;
142
352
  }
143
353
 
144
- .video-js.skin_news .rewindbtn:hover{
354
+ .video-js.skin_news_live .rewindbtn:hover{
145
355
  cursor: pointer;
146
356
  }
147
357
 
148
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
358
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
149
359
  position: relative;
150
360
  padding-left: 0;
151
361
  }
152
362
 
153
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
363
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
154
364
  display: none !important;
155
365
  }
156
366
 
157
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
158
- width: 90px;
367
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
368
+ /* width: 90px;
159
369
  height: 90px;
160
370
  display: flex;
161
371
  justify-content: center;
@@ -170,19 +380,20 @@
170
380
  font-size: 6em;
171
381
  line-height: 1.4em;
172
382
  border: 0.05em solid;
173
- color: inherit;
383
+ color: inherit; */
384
+ display: none !important;
174
385
  }
175
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
386
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
176
387
  font-weight: bold;
177
388
  }
178
389
 
179
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
390
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
180
391
  bottom: 2.4em !important;
181
392
  right: -1em;
182
393
  z-index: 1;
183
394
  }
184
395
 
185
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
396
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
186
397
  width: 24px !important;
187
398
  height: 24px !important;
188
399
  }
@@ -192,34 +403,34 @@
192
403
  }
193
404
 
194
405
 
195
- .video-js.skin_news button.vjs-rewind-button{
406
+ .video-js.skin_news_live button.vjs-rewind-button{
196
407
  cursor: pointer;
197
408
  }
198
409
 
199
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
410
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
200
411
  padding-right: 0;
412
+ display: none;
201
413
  }
202
414
 
203
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
415
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
204
416
  padding-left: 0;
417
+ display: none;
205
418
  }
206
419
 
207
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
420
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
208
421
  padding-left: 0;
209
422
  padding-right: 0;
210
- display: flex;
211
- justify-content: center;
212
- width: min-content;
423
+ display: none;
213
424
  }
214
425
 
215
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
426
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
216
427
  display: none
217
428
  }
218
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
429
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
219
430
  display: none
220
431
  }
221
432
 
222
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
433
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
223
434
  display: flex;
224
435
  align-items: center;
225
436
  font-weight: 700;
@@ -227,26 +438,26 @@
227
438
  min-width: 1.2em;
228
439
  }
229
440
 
230
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
441
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
231
442
  display: none;
232
443
  font-size: 11px;
233
444
  justify-content: center;
234
445
  align-items: center;
235
446
  user-select: none;
236
447
  }
237
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
448
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
238
449
  display: none;
239
450
  }
240
451
 
241
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
452
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
242
453
  height: min-content;
243
454
  width: min-content;
244
455
  }
245
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
456
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
246
457
  width: 6em;
247
458
  }
248
459
 
249
- .video-js.skin_news .content{
460
+ .video-js.skin_news_live .content{
250
461
  bottom: 3.4rem !important;
251
462
  right: -4rem !important;
252
463
  }
@@ -265,15 +476,16 @@
265
476
  pointer-events:none
266
477
  }
267
478
 
268
- .video-js.skin_news iframe{
479
+ .video-js.skin_news_live iframe{
269
480
  width: 100%;
270
481
  height: 100%;
271
482
  }
272
483
 
273
- .video-js.skin_news .vjs-live-control{
484
+ .video-js.skin_news_live .vjs-live-control{
274
485
  align-items: center;
486
+ display: none;
275
487
  }
276
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
488
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
277
489
  height: 2.2em;
278
490
  display: flex;
279
491
  align-items: center;
@@ -284,43 +496,22 @@
284
496
  margin: 4px 0px 4px 12px;
285
497
  }
286
498
 
287
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
499
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
288
500
  text-shadow: none;
289
501
  }
290
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
291
- display: none;
292
- font-size: 12px;
293
- }
294
502
 
295
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
296
- height: 2.2em;
297
- display: inline-flex;
298
- align-items: center;
299
- /* font-family: monospace; */
503
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
504
+ display: flex;
300
505
  justify-content: center;
301
- border: 2px solid;
302
- margin: 4px 0px 4px 6px;
303
- white-space: pre;
304
- padding: 0px 6px;
305
- font-size: 1.2em;
306
- font-weight: 500;
307
- color: rgba(255, 255, 2555, 0.7);
308
-
309
- letter-spacing: -.1px;
310
- line-height: normal;
311
- text-transform: uppercase;
312
- color: #FFFFFF;
313
- opacity: .7;
314
- font-family: "Proxima Nova";
506
+ min-width: 5.3em;
507
+ pointer-events: none;
508
+ user-select: none;
315
509
  }
316
510
 
317
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
318
- opacity: 1;
511
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
512
+ color: white;
319
513
  }
320
514
 
321
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
322
- content: "NOT LIVE";
323
- }
324
515
 
325
516
  .settings-selection.vjs-control.vjs-button{
326
517
  display: flex !important;
@@ -337,57 +528,57 @@
337
528
  .tvProviderImage{
338
529
  display: none
339
530
  }
340
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
531
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
341
532
  .icon-maximize {
342
533
  height: 30px !important;
343
534
  }
344
535
 
345
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
536
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
346
537
  .icon-minimize {
347
538
  height: 30px !important;
348
539
  }
349
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
540
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
350
541
  width: 4.5em;
351
542
  }
352
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
543
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
353
544
  height: min-content;
354
545
  }
355
546
 
356
- .video-js.skin_news button.vjs-slowmo-button{
547
+ .video-js.skin_news_live button.vjs-slowmo-button{
357
548
  display: none;
358
549
  }
359
- .video-js.skin_news button.vjs-rewind-button{
550
+ .video-js.skin_news_live button.vjs-rewind-button{
360
551
  display: none;
361
552
  }
362
- .video-js.skin_news button.vjs-rewind-button>svg{
553
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
363
554
  height: 20px;
364
555
  }
365
- .video-js.skin_news .vjs-button{
556
+ .video-js.skin_news_live .vjs-button{
366
557
  width: 4.8em;
367
558
  }
368
- .video-js.skin_news .widget-selection{
559
+ .video-js.skin_news_live .widget-selection{
369
560
  display: none;
370
561
  }
371
- .video-js.skin_news .container{
562
+ .video-js.skin_news_live .container{
372
563
  display: none !important;
373
564
  }
374
- .video-js.skin_news .vjs-control-bar{
565
+ .video-js.skin_news_live .vjs-control-bar{
375
566
  height: 4em !important;
376
567
  }
377
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
568
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
378
569
  font-size: 2.5em;
379
570
  line-height: 1.5;
380
571
  }
381
- .video-js.skin_news .vjs-play-progress:before {
572
+ .video-js.skin_news_live .vjs-play-progress:before {
382
573
  font-size: 1.2em;
383
574
  position: absolute;
384
575
  right: -0.5em;
385
576
  z-index: 1;
386
577
  }
387
- .video-js.skin_news button.vjs-skip-button>svg{
578
+ .video-js.skin_news_live button.vjs-skip-button>svg{
388
579
  height: 20px;
389
580
  }
390
- .video-js.skin_news button.vjs-big-play-button {
581
+ .video-js.skin_news_live button.vjs-big-play-button {
391
582
  width: 50px !important;
392
583
  height: 50px !important;
393
584
  font-size: 2.1rem !important;
@@ -397,17 +588,17 @@
397
588
  width: 24px;
398
589
  height: 24px;
399
590
  }
400
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
591
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
401
592
  margin: 0 12px 0 12px;
402
593
  }
403
- .video-js.skin_news .vjs-seek-to-live-text{
594
+ .video-js.skin_news_live .vjs-seek-to-live-text{
404
595
  font-size: 12px;
405
596
  }
406
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
597
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
407
598
  margin: 0 12px 0 12px;
408
599
  }
409
600
  }
410
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
601
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
411
602
  width: 90px;
412
603
  height: 90px;
413
604
  display: flex;
@@ -424,7 +615,7 @@
424
615
  line-height: 1.4em;
425
616
  }
426
617
 
427
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
618
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
428
619
  display: flex;
429
620
  justify-content: center;
430
621
  align-items: center;
@@ -432,29 +623,22 @@
432
623
  transition: width 0.1s;
433
624
  }
434
625
 
435
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
626
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
436
627
  display: flex;
437
628
  justify-content: center;
438
629
  align-items: center;
439
630
  height: 100%;
440
631
  transition: width 0.1s;
441
632
  }
442
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
633
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
443
634
  display: none !important;
444
635
  }
445
- .video-js.skin_news .ssai-ad-container{
446
- position: absolute;
447
- bottom: 14px;
448
- }
449
636
 
450
637
  @media (max-width: 576px) {
451
- .video-js.skin_news .ssai-ad-container{
452
- bottom: 2px;
453
- }
454
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
638
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
455
639
  height: 5px !important;
456
640
  }
457
- .video-js.skin_news button.vjs-big-play-button {
641
+ .video-js.skin_news_live button.vjs-big-play-button {
458
642
  width: 50px !important;
459
643
  height: 50px !important;
460
644
  font-size: 2.1rem !important;
@@ -463,293 +647,63 @@
463
647
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
464
648
  display: none;
465
649
  }
466
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
650
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
467
651
  bottom: 2.4em !important;
468
652
  right: -1em;
469
653
  z-index: 1;
470
654
  }
471
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
655
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
472
656
  display: none !important;
473
657
  }
474
658
 
475
- .video-js.skin_news .vjs-text-track-display-ttml span {
476
- color: white;
477
- font-size: 13px;
478
- background-color: black;
479
- }
480
- }
481
-
482
- .video-js.skin_news .vjs-text-track-display-ttml span {
483
- color: white;
484
- font-size: 16px;
485
- background-color: black;
486
- }
487
-
488
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
489
- margin-bottom: 2rem !important;
490
659
  }
491
660
 
492
- .video-js.skin_news .vjs-text-track-display-ttml p {
493
- font-size: 18px !important;
661
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
662
+ width: 100% !important;
494
663
  }
495
664
 
496
-
497
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
498
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
665
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
666
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
499
667
  font-size: 1.2em !important;
500
668
  line-height: 1.5em !important;
501
669
  padding: 0.2em 0.8em !important;
502
670
  }
503
671
 
504
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
672
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
505
673
  content: none !important;
506
674
  fill: none !important;
507
675
  filter: none !important;
508
676
  }
509
677
 
510
- /* svg icons opacity and hover effect */
511
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
512
- opacity: 0.7 !important;
513
- }
514
-
515
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
516
- opacity: 1 !important;
517
- }
518
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
519
- opacity: 0.7 !important;
520
- }
521
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
522
- opacity: 1 !important;
523
- }
524
-
525
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
678
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
526
679
  color: rgba(255, 255, 2555, 0.7)!important;
527
680
  }
528
681
 
529
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
682
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
530
683
  color: rgba(255, 255, 2555, 1)!important;
531
684
  }
532
685
 
533
686
 
534
687
 
535
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
536
- height: 0.7em !important;
537
- position: absolute !important;
538
- top: -0.7em !important;
539
- width: 100% !important;
540
- }
541
-
542
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
543
- height: 100%;
544
- }
545
688
 
546
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
547
- line-height: 2.5;
548
- }
549
689
 
550
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
551
- height: 19px;
552
- width: 19px;
553
- cursor: pointer;
690
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
691
+ font-size: 2.2em;
692
+ line-height: 2.6;
554
693
  }
555
- .video-js.skin_vlone .vjs-control {
556
- user-select: none;
694
+ .video-js.skin_mini{
695
+ overflow: hidden;
557
696
  }
558
- .video-js.skin_vlone .vjs-custom-control-spacer{
559
- user-select: none;
697
+ .video-js.skin_mini .vjs-control-bar{
698
+ z-index: 1 !important;
699
+ height: 4em !important;
700
+ background: black !important;
560
701
  }
561
702
 
562
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
563
- height: 19px;
564
- width: 19px;
565
- cursor: pointer;
566
- }
567
-
568
- .video-js.skin_vlone .vjs-play-progress:before {
569
- display: none !important;
570
- }
571
-
572
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
573
- margin: 0 !important;
574
-
575
- }
576
-
577
-
578
- .video-js.skin_vlone .vjs-custom-control-spacer {
579
- display: block;
580
- flex: 1 1 auto;
581
- }
582
-
583
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
584
- z-index: 1;
585
- }
586
-
587
-
588
- .video-js.skin_vlone .vjs-control-bar {
589
- height: 40px;
590
- }
591
-
592
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
593
- .vjs-button>.vjs-icon-placeholder:before {
594
- position: relative !important;
595
- }
596
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
597
- display: flex;
598
- left: 0px;
599
- top: -1px;
600
- }
601
-
602
- .vjs-button>.vjs-icon-placeholder:before {
603
- font-size: 2em !important;
604
- }
605
-
606
- .video-js.skin_vlone .vjs-control {
607
- width: 4.3em;
608
- }
609
-
610
- .vjs-menu-button-popup .vjs-menu {
611
- bottom: 10px !important;
612
- }
613
-
614
-
615
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
616
- height: 1.3em !important;
617
- position: absolute !important;
618
- top: -1.3em !important;
619
- transition: height 0.3s, top 0.3s !important;
620
- }
621
-
622
-
623
- .video-js.skin_vlone.vjs-live .vjs-time-control{
624
- display: none !important;
625
- }
626
-
627
- .video-js.skin_vlone .vjs-time-control {
628
- display: block;
629
- }
630
- .video-js.skin_vlone .vjs-remaining-time {
631
- display: none;
632
- }
633
-
634
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
635
- line-height: 3.5em;
636
- font-size: 1.1em;
637
- min-width: 4em;
638
- }
639
-
640
- .video-js.skin_vlone .vjs-time-divider > div{
641
- display: flex;
642
- justify-content: center;
643
- }
644
-
645
- .video-js.skin_vlone .vjs-live-control{
646
- align-items: center;
647
- }
648
- .video-js.skin_vlone .vjs-live-display{
649
- height: 2.2em;
650
- display: flex;
651
- align-items: center;
652
- font-family: monospace;
653
- width: 4em;
654
- justify-content: center;
655
- background: red;
656
- margin: 4px 0px 4px 12px;
657
- }
658
- .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
659
- background: #6b6b6b;
660
- }
661
- .video-js.skin_vlone .vjs-live-display:hover{
662
- cursor: pointer;
663
- }
664
-
665
- .video-js.skin_vlone .vjs-time-control {
666
- line-height: 3.5em !important;
667
- font-size: 1.1em !important;
668
- width: min-content !important;
669
- min-width: 1.5em;
670
- padding: 0 !important;
671
- user-select: none;
672
- }
673
-
674
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
675
- margin-left: 16px !important;
676
- }
677
-
678
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
679
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
680
- font-size: 1.2em !important;
681
- line-height: 1.5em !important;
682
- padding: 0.2em 0.8em !important;
683
- }
684
-
685
-
686
- /* Big play */
687
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
688
- width: 80px;
689
- height: 80px;
690
- display: flex;
691
- justify-content: center;
692
- align-items: center;
693
- border: none;
694
- position: absolute;
695
- top: 0;
696
- left: 0;
697
- right: 0;
698
- bottom: 0;
699
- margin: auto;
700
- font-size: 5em;
701
- line-height: 1.3em;
702
- transform: none !important;
703
- border-radius: 1.3em;
704
- }
705
- .video-js.skin_vlone .ssai-ad-container{
706
- position: absolute;
707
- bottom: 4px;
708
- }
709
-
710
- @media(max-width:600px){
711
- .video-js.skin_vlone button.vjs-big-play-button {
712
- width: 50px !important;
713
- height: 50px !important;
714
- font-size: 2.1rem !important;
715
- }
716
-
717
- .video-js.skin_vlone .ssai-ad-container {
718
- position: absolute;
719
- bottom: 2px;
720
- }
721
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
722
- display: none;
723
- }
724
-
725
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
726
- /* display: none; */
727
- }
728
-
729
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
730
- /* display: none; */
731
- }
732
- }
733
- .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
734
- text-decoration: underline;
735
- }
736
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
737
- font-size: 2.2em;
738
- line-height: 2.6;
739
- }
740
- .video-js.skin_mini{
741
- overflow: hidden;
742
- }
743
- .video-js.skin_mini .vjs-control-bar{
744
- z-index: 1 !important;
745
- height: 4em !important;
746
- background: black !important;
747
- }
748
-
749
- .video-js.skin_mini .vjs-fade>* {
750
- visibility: hidden !important;
751
- opacity: 0 !important;
752
- transition: visibility 1s, opacity 1s !important;
703
+ .video-js.skin_mini .vjs-fade>* {
704
+ visibility: hidden !important;
705
+ opacity: 0 !important;
706
+ transition: visibility 1s, opacity 1s !important;
753
707
  }
754
708
 
755
709
  .video-js.skin_mini .custom-spaced-progress-bar {
@@ -1204,821 +1158,867 @@
1204
1158
  }
1205
1159
 
1206
1160
 
1207
-
1208
- .video-js.skin_cn_news .vjs-control-bar {
1209
- z-index: 1 !important;
1210
- height: auto !important;
1211
- padding: 0.8em 30px 0.6em;
1212
- background: transparent !important;
1161
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1162
+ font-size: 2.2em;
1163
+ line-height: 2.6;
1164
+ }
1165
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1166
+ background: white;
1167
+ }
1168
+ .video-js.skin_news .vjs-control-bar{
1169
+ z-index: 1 !important;
1170
+ height: 5em !important;
1171
+ background: black !important;
1172
+ }
1173
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1213
1174
  display: flex;
1214
- flex-wrap: wrap;
1215
1175
  align-items: center;
1216
- column-gap: 10px;
1176
+ justify-content: center;
1217
1177
  }
1218
1178
 
1179
+ .video-js.skin_news .vjs-fade>* {
1180
+ visibility: hidden !important;
1181
+ opacity: 0 !important;
1182
+ transition: visibility 1s, opacity 1s !important;
1183
+ }
1219
1184
 
1220
- .video-js.skin_cn_news .vjs-control-bar::before {
1221
- content: '';
1185
+ .video-js.skin_news .custom-spaced-progress-bar {
1222
1186
  position: absolute;
1223
- left: 0;
1224
- right: 0;
1225
- bottom: 0;
1226
- top: -3em;
1227
- background: linear-gradient(
1228
- to top,
1229
- rgba(0, 0, 0, 0.85) 0%,
1230
- rgba(0, 0, 0, 0.7) 40%,
1231
- rgba(0, 0, 0, 0.55) 70%,
1232
- rgba(0, 0, 0, 0.38) 86%,
1233
- transparent 100%
1234
- );
1235
- pointer-events: none;
1236
- z-index: -1;
1187
+ width: 100%;
1188
+ display: flex;
1189
+ height: 0.5em;
1190
+ top: -0.5em;
1237
1191
  }
1238
1192
 
1239
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1240
- order: -1;
1241
- flex: 0 0 100%;
1242
- width: 80%;
1243
- margin: 0 0 5em;
1193
+ .video-js.skin_news .vjs-progress-control {
1194
+ /* left: -6px; */
1244
1195
  position: relative;
1196
+ width: 100%;
1197
+ height: 0.5em;
1198
+ transition: height 0.1s, top 0.1s;
1245
1199
  }
1246
1200
 
1247
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1248
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1249
- width: auto;
1250
- min-width: 0;
1251
- }
1252
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1253
- display: inline-flex;
1254
- align-items: center;
1255
- justify-content: center;
1256
- height: 7em;
1257
- padding: 0 10px;
1258
- color: #fff;
1259
- }
1260
-
1261
- .video-js.skin_cn_news .vjs-svg-icon::before {
1262
- content: none !important;
1201
+
1202
+
1203
+
1204
+ .video-js.skin_news .vjs-custom-control-spacer {
1205
+ display: block;
1206
+ flex: 1 1 auto;
1263
1207
  }
1264
1208
 
1265
-
1266
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1267
- display: inline-flex;
1268
- align-items: center;
1269
- justify-content: center;
1209
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1210
+ margin: 0 0px 0 0px;
1270
1211
  }
1271
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1272
- .video-js.skin_cn_news .vjs-rewind-button svg {
1273
- width: 24px;
1274
- height: 24px;
1275
- display: block;
1212
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1213
+ display: none;
1276
1214
  }
1277
1215
 
1216
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1217
+ font-size: 14px;
1218
+ font-weight: 500;
1219
+ align-self: center;
1220
+ height: min-content;
1221
+ padding: 5px 2px;
1222
+ border-radius: 8px;
1223
+ }
1278
1224
 
1225
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1226
+ height: 6px !important;
1227
+ }
1279
1228
 
1280
- .video-js.skin_cn_news .vjs-subs-caps-button {
1281
- opacity: 1;
1229
+ .video-js.skin_news .vjs-play-progress:before {
1230
+ font-size: 1.5em;
1231
+ line-height: unset;
1232
+ top: -0.3333333333em;
1282
1233
  }
1283
1234
 
1235
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1236
+ display: none !important;
1237
+ }
1284
1238
 
1239
+ /* */
1240
+ .video-js.skin_news .vjs-mouse-display{
1241
+ font-size: 1.6666666667em;
1242
+ }
1285
1243
 
1286
- .video-js.skin_cn_news .vjs-volume-panel {
1287
- margin: 0;
1288
- display: inline-flex;
1289
- align-items: center;
1290
- align-self: center;
1291
- height: 2.2em;
1292
- min-width: 7em;
1293
- transition: none;
1244
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1245
+ font-size: 1em !important;
1294
1246
  }
1295
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1296
- width: 0;
1297
- height: 100%;
1247
+
1248
+ .video-js.skin_news .vjs-button{
1249
+ width: 5.3em;
1298
1250
  display: flex;
1299
1251
  align-items: center;
1300
- overflow: hidden;
1301
- opacity: 0;
1302
- transition: width 0.15s ease, opacity 0.15s ease;
1303
- }
1304
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1305
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1306
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1307
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1308
- width: 5em;
1309
- opacity: 1;
1310
- }
1311
-
1312
- .video-js.skin_cn_news .vjs-volume-bar {
1313
- width: 4em;
1314
- height: 0.3em;
1315
- margin: 0 0.45em;
1252
+ justify-content: center;
1316
1253
  }
1317
1254
 
1318
1255
 
1319
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1320
- display: none !important;
1256
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1257
+ .icon-maximize {
1258
+ display: block;
1259
+ height: 32px;
1321
1260
  }
1322
1261
 
1323
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1324
- width: 0 !important;
1262
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1263
+ line-height: 4;
1325
1264
  }
1326
1265
 
1327
-
1328
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1329
- display: block !important;
1330
- flex: 1 1 auto;
1266
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1267
+ .icon-minimize {
1268
+ display: none;
1269
+ height: 32px;
1331
1270
  }
1332
1271
 
1333
-
1334
- .video-js.skin_cn_news .vjs-big-play-button {
1335
- display: none;
1272
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1273
+ outline: none !important;
1336
1274
  }
1337
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1338
- position: relative !important;
1339
- display: flex;
1340
- left: 0;
1341
- top: -1px;
1275
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1276
+ .vjs-icon-fullscreen-enter:before {
1277
+ /* content: '' !important; */
1342
1278
  }
1343
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1279
+
1280
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1344
1281
  display: flex;
1345
1282
  justify-content: center;
1346
1283
  align-items: center;
1347
- position: absolute;
1348
- top: 0;
1349
- left: 0;
1350
- right: 0;
1351
- bottom: 0;
1352
- margin: auto;
1353
- width: 80px;
1354
- height: 80px;
1355
- border: none;
1356
- border-radius: 50%;
1357
- background: rgba(0, 0, 0, 0.55);
1358
- font-size: 5em;
1359
- line-height: 1.3em;
1360
- transform: none !important;
1284
+ /* transform: rotate(90deg); */
1361
1285
  }
1362
1286
 
1287
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1288
+ display: none;
1289
+ }
1290
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1291
+ margin-left: -10px;
1292
+ }
1363
1293
 
1364
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1365
- height: 4px !important;
1366
- margin: 0;
1367
- border-radius: 20px;
1368
- background-color: #393944;
1294
+ .video-js.skin_news .skipbtn:hover{
1295
+ cursor: pointer;
1369
1296
  }
1370
1297
 
1371
- .video-js.skin_cn_news .vjs-play-progress {
1372
- background-color: #ffffff;
1373
- border-radius: 20px;
1298
+ .video-js.skin_news .rewindbtn:hover{
1299
+ cursor: pointer;
1374
1300
  }
1375
1301
 
1376
- .video-js.skin_cn_news .vjs-load-progress,
1377
- .video-js.skin_cn_news .vjs-load-progress div {
1378
- background: rgba(255, 255, 255, 0.15);
1379
- border-radius: 20px;
1302
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1303
+ position: relative;
1304
+ padding-left: 0;
1380
1305
  }
1381
1306
 
1307
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1308
+ display: none !important;
1309
+ }
1382
1310
 
1383
- .video-js.skin_cn_news .vjs-play-progress:before {
1384
- content: '';
1385
- width: 16px;
1386
- height: 16px;
1387
- border-radius: 50%;
1388
- background: #ffffff;
1389
- border: 2px solid rgba(0, 0, 0, 0.6);
1390
- box-sizing: border-box;
1391
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1392
- top: -6px;
1393
- right: -8px;
1394
- position: absolute;
1311
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1312
+ width: 90px;
1313
+ height: 90px;
1314
+ display: flex;
1315
+ justify-content: center;
1316
+ align-items: center;
1317
+ border-radius: 50%;
1318
+ position: absolute;
1319
+ top: 0;
1320
+ left: 0;
1321
+ right: 0;
1322
+ bottom: 0;
1323
+ margin: auto;
1324
+ font-size: 6em;
1325
+ line-height: 1.4em;
1326
+ border: 0.05em solid;
1327
+ color: inherit;
1395
1328
  }
1396
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1397
- display: none !important;
1329
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1330
+ font-weight: bold;
1398
1331
  }
1399
1332
 
1400
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1401
- background: #ffffff;
1402
- color: #0a0e17;
1403
- font-weight: 700;
1404
- border-radius: 3px;
1333
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1334
+ bottom: 2.4em !important;
1335
+ right: -1em;
1336
+ z-index: 1;
1405
1337
  }
1406
1338
 
1407
- .video-js.skin_cn_news .vjs-live-control {
1408
- display: none !important;
1339
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1340
+ width: 24px !important;
1341
+ height: 24px !important;
1409
1342
  }
1410
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1411
- display: inline-flex;
1412
- align-items: center;
1413
- align-self: center;
1414
- height: 2.2em;
1415
- gap: 5px;
1416
- width: auto;
1417
- padding: 0 10px;
1418
- border: 1px solid rgba(255, 255, 255, 0.45);
1419
- border-radius: 4px;
1420
- cursor: pointer;
1343
+ .settings-selector-icon>svg{
1344
+ height: 19px !important;
1345
+ width: 19px !important;
1421
1346
  }
1422
1347
 
1423
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1424
- display: none;
1348
+
1349
+ .video-js.skin_news button.vjs-rewind-button{
1350
+ cursor: pointer;
1425
1351
  }
1426
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1427
- display: inline-flex;
1428
- align-items: center;
1352
+
1353
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1354
+ padding-right: 0;
1429
1355
  }
1430
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1431
- content: '';
1432
- display: inline-block;
1433
- width: 8px;
1434
- height: 8px;
1435
- border-radius: 50%;
1436
- background: #ff2d2d; /* red live dot */
1356
+
1357
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1358
+ padding-left: 0;
1437
1359
  }
1438
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1439
- color: #ffffff;
1440
- font-weight: 700;
1441
- font-size: 12px;
1442
- letter-spacing: 0.03em;
1360
+
1361
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1362
+ padding-left: 0;
1363
+ padding-right: 0;
1364
+ display: flex;
1365
+ justify-content: center;
1366
+ width: min-content;
1443
1367
  }
1444
1368
 
1445
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1446
- border-color: transparent;
1369
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1370
+ display: none
1447
1371
  }
1448
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1449
- color: #ff2d2d;
1372
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1373
+ display: none
1450
1374
  }
1451
1375
 
1452
- /* ---- time controls ---- */
1453
- .video-js.skin_cn_news .vjs-current-time,
1454
- .video-js.skin_cn_news .vjs-duration,
1455
- .video-js.skin_cn_news .vjs-time-divider {
1456
- display: none !important;
1457
- }
1458
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1459
- display: none;
1376
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
1377
+ display: flex;
1460
1378
  align-items: center;
1461
- justify-content: center;
1462
- font-size: 11px;
1463
1379
  font-weight: 700;
1464
- color: #fff;
1465
- padding: 0 6px;
1466
- user-select: none;
1380
+ font-size: 12px;
1381
+ min-width: 1.2em;
1467
1382
  }
1468
1383
 
1469
-
1470
- .video-js.skin_cn_news .vjs-chapter-marker {
1471
- z-index: 2;
1472
- width: var(--vl-chapter-size, 8px);
1473
- height: var(--vl-chapter-size, 8px);
1474
- top: 50%;
1475
- bottom: auto;
1476
- background: var(--vl-chapter-color, #ffffff);
1477
- opacity: var(--vl-chapter-opacity, 1);
1478
- border-radius: 50%;
1479
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1480
- transform: translate(-50%, -50%) scale(1);
1481
- transition: background-color 0.12s ease;
1482
- }
1483
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1484
- background: var(--vl-chapter-hover, #0a5cff);
1485
- }
1486
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1487
- background: var(--vl-chapter-active, #0a5cff);
1384
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1385
+ display: none;
1386
+ font-size: 11px;
1387
+ justify-content: center;
1388
+ align-items: center;
1389
+ user-select: none;
1488
1390
  }
1489
-
1490
-
1491
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1492
- width: 16px;
1493
- height: 16px;
1494
- bottom: 160%;
1495
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1391
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1392
+ display: none;
1496
1393
  }
1497
1394
 
1498
-
1499
- .video-js.skin_cn_news .vjs-chapter-preview {
1500
- background: var(--vl-chapter-tooltip, #0a5cff);
1501
- border-radius: 6px;
1502
- padding: 8px 10px;
1503
- width: max-content;
1504
- max-width: 300px;
1505
- text-align: left;
1506
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1507
- }
1508
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1509
- color: #ffffff;
1510
- font-size: 13px;
1511
- font-weight: 400;
1512
- margin-bottom: 2px;
1513
- }
1514
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1515
- color: #ffffff;
1516
- font-size: 13px;
1517
- font-weight: 400;
1518
- line-height: 1.3;
1519
- white-space: normal;
1520
- text-align: left;
1521
- }
1522
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1523
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1395
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1396
+ height: min-content;
1397
+ width: min-content;
1524
1398
  }
1525
-
1526
- /* ---- responsive ---- */
1527
- @media (max-width: 576px) {
1528
- .video-js.skin_cn_news .vjs-control-bar {
1529
- height: 3.2em !important;
1530
- padding: 0 8px;
1531
- }
1532
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1533
- padding: 0 6px;
1534
- }
1535
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1536
- display: none !important;
1537
- }
1399
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1400
+ width: 6em;
1538
1401
  }
1539
1402
 
1540
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1541
- font-size: 2.2em;
1542
- line-height: 2.6;
1543
- }
1544
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1545
- background: #fcb700;
1546
- }
1547
- .video-js.skin_news_live .vjs-control-bar{
1548
- z-index: 1 !important;
1549
- height: 5em !important;
1550
- background: black !important;
1551
- }
1552
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1553
- display: flex;
1554
- align-items: center;
1555
- justify-content: center;
1403
+ .video-js.skin_news .content{
1404
+ bottom: 3.4rem !important;
1405
+ right: -4rem !important;
1556
1406
  }
1557
1407
 
1558
- .video-js.skin_news_live .vjs-fade>* {
1559
- visibility: hidden !important;
1560
- opacity: 0 !important;
1561
- transition: visibility 1s, opacity 1s !important;
1408
+ .setting-icon > svg{
1409
+ height:18px !important;
1562
1410
  }
1563
1411
 
1564
- .video-js.skin_news_live .custom-spaced-progress-bar {
1412
+ .output-overlay{
1565
1413
  position: absolute;
1414
+ bottom: 0;
1415
+ height: 100%;
1566
1416
  width: 100%;
1567
- display: flex;
1568
- height: 0.5em;
1569
- top: -0.5em;
1417
+ z-index: 0;
1418
+ border: 0;
1419
+ pointer-events:none
1570
1420
  }
1571
1421
 
1572
- .video-js.skin_news_live .vjs-progress-control {
1573
- /* left: -6px; */
1574
- position: relative;
1422
+ .video-js.skin_news iframe{
1575
1423
  width: 100%;
1576
- height: 0.5em;
1577
- transition: height 0.1s, top 0.1s;
1424
+ height: 100%;
1578
1425
  }
1579
1426
 
1580
- .video-js.skin_news_live .vjs-volume-panel{
1581
- min-width: 5.3em;
1427
+ .video-js.skin_news .vjs-live-control{
1428
+ align-items: center;
1582
1429
  }
1583
-
1584
-
1585
-
1586
- .video-js.skin_news_live .vjs-custom-control-spacer {
1587
- /* display: block; */
1588
- /* flex: 1 1 auto; */
1430
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1431
+ height: 2.2em;
1432
+ display: flex;
1433
+ align-items: center;
1434
+ font-family: monospace;
1435
+ width: 4em;
1436
+ justify-content: center;
1437
+ background: red;
1438
+ margin: 4px 0px 4px 12px;
1589
1439
  }
1590
1440
 
1591
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1592
- margin: 0 0px 0 0px;
1441
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1442
+ text-shadow: none;
1593
1443
  }
1594
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1444
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1595
1445
  display: none;
1446
+ font-size: 12px;
1596
1447
  }
1597
1448
 
1598
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1599
- font-size: 14px;
1449
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1450
+ height: 2.2em;
1451
+ display: inline-flex;
1452
+ align-items: center;
1453
+ /* font-family: monospace; */
1454
+ justify-content: center;
1455
+ border: 2px solid;
1456
+ margin: 4px 0px 4px 6px;
1457
+ white-space: pre;
1458
+ padding: 0px 6px;
1459
+ font-size: 1.2em;
1600
1460
  font-weight: 500;
1601
- align-self: center;
1602
- height: min-content;
1603
- padding: 5px 2px;
1604
- border-radius: 8px;
1605
- }
1606
-
1607
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1608
- height: 6px !important;
1609
- }
1461
+ color: rgba(255, 255, 2555, 0.7);
1610
1462
 
1611
- .video-js.skin_news_live .vjs-play-progress:before {
1612
- font-size: 1.5em;
1613
- line-height: unset;
1614
- top: -0.3333333333em;
1463
+ letter-spacing: -.1px;
1464
+ line-height: normal;
1465
+ text-transform: uppercase;
1466
+ color: #FFFFFF;
1467
+ opacity: .7;
1468
+ font-family: "Proxima Nova";
1615
1469
  }
1616
1470
 
1617
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1618
- display: none !important;
1471
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1472
+ opacity: 1;
1619
1473
  }
1620
1474
 
1621
- /* */
1622
- .video-js.skin_news_live .vjs-mouse-display{
1623
- font-size: 1.6666666667em;
1475
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1476
+ content: "NOT LIVE";
1624
1477
  }
1625
1478
 
1626
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1627
- font-size: 1em !important;
1479
+ .settings-selection.vjs-control.vjs-button{
1480
+ display: flex !important;
1628
1481
  }
1629
1482
 
1630
- .video-js.skin_news_live .vjs-button{
1631
- width: 5.3em;
1632
- display: flex;
1633
- align-items: center;
1634
- justify-content: center;
1483
+ @media(max-width:576px){
1484
+ .settings-selection.vjs-control.vjs-button{
1485
+ display: none !important;
1486
+ }
1635
1487
  }
1636
1488
 
1637
1489
 
1638
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1639
- .icon-maximize {
1640
- display: block;
1641
- height: 32px;
1642
- }
1490
+ @media(max-width:576px){
1491
+ .tvProviderImage{
1492
+ display: none
1493
+ }
1494
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1495
+ .icon-maximize {
1496
+ height: 30px !important;
1497
+ }
1643
1498
 
1644
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1645
- line-height: 4;
1646
- }
1499
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1500
+ .icon-minimize {
1501
+ height: 30px !important;
1502
+ }
1503
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1504
+ width: 4.5em;
1505
+ }
1506
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1507
+ height: min-content;
1508
+ }
1647
1509
 
1648
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1649
- .icon-minimize {
1510
+ .video-js.skin_news button.vjs-slowmo-button{
1650
1511
  display: none;
1651
- height: 32px;
1652
- }
1653
-
1654
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1655
- outline: none !important;
1656
- /* flex: 1; */
1512
+ }
1513
+ .video-js.skin_news button.vjs-rewind-button{
1514
+ display: none;
1515
+ }
1516
+ .video-js.skin_news button.vjs-rewind-button>svg{
1517
+ height: 20px;
1518
+ }
1519
+ .video-js.skin_news .vjs-button{
1520
+ width: 4.8em;
1521
+ }
1522
+ .video-js.skin_news .widget-selection{
1523
+ display: none;
1524
+ }
1525
+ .video-js.skin_news .container{
1526
+ display: none !important;
1527
+ }
1528
+ .video-js.skin_news .vjs-control-bar{
1529
+ height: 4em !important;
1530
+ }
1531
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1532
+ font-size: 2.5em;
1533
+ line-height: 1.5;
1534
+ }
1535
+ .video-js.skin_news .vjs-play-progress:before {
1536
+ font-size: 1.2em;
1537
+ position: absolute;
1538
+ right: -0.5em;
1539
+ z-index: 1;
1657
1540
  }
1658
- .video-js.skin_news_live .vjs-play-toggle-container{
1659
- display: flex;
1660
- flex: 1;
1661
- justify-content: center;
1541
+ .video-js.skin_news button.vjs-skip-button>svg{
1542
+ height: 20px;
1543
+ }
1544
+ .video-js.skin_news button.vjs-big-play-button {
1545
+ width: 50px !important;
1546
+ height: 50px !important;
1547
+ font-size: 2.1rem !important;
1662
1548
  }
1663
1549
 
1664
-
1665
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1666
- .vjs-icon-fullscreen-enter:before {
1667
- /* content: '' !important; */
1550
+ .stream-selector-icon>svg{
1551
+ width: 24px;
1552
+ height: 24px;
1553
+ }
1554
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1555
+ margin: 0 12px 0 12px;
1556
+ }
1557
+ .video-js.skin_news .vjs-seek-to-live-text{
1558
+ font-size: 12px;
1559
+ }
1560
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1561
+ margin: 0 12px 0 12px;
1562
+ }
1563
+ }
1564
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1565
+ width: 90px;
1566
+ height: 90px;
1567
+ display: flex;
1568
+ justify-content: center;
1569
+ align-items: center;
1570
+ border-radius: 50%;
1571
+ position: absolute;
1572
+ top: 0;
1573
+ left: 0;
1574
+ right: 0;
1575
+ bottom: 0;
1576
+ margin: auto;
1577
+ font-size: 6em;
1578
+ line-height: 1.4em;
1668
1579
  }
1669
1580
 
1670
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1581
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1671
1582
  display: flex;
1672
1583
  justify-content: center;
1673
1584
  align-items: center;
1674
- /* transform: rotate(90deg); */
1585
+ height: 100%;
1586
+ transition: width 0.1s;
1675
1587
  }
1676
1588
 
1677
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1678
- display: none;
1589
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1590
+ display: flex;
1591
+ justify-content: center;
1592
+ align-items: center;
1593
+ height: 100%;
1594
+ transition: width 0.1s;
1679
1595
  }
1680
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1681
- margin-left: -10px;
1596
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1597
+ display: none !important;
1682
1598
  }
1683
-
1684
- .video-js.skin_news_live .skipbtn:hover{
1685
- cursor: pointer;
1599
+ .video-js.skin_news .ssai-ad-container{
1600
+ position: absolute;
1601
+ bottom: 14px;
1686
1602
  }
1687
1603
 
1688
- .video-js.skin_news_live .rewindbtn:hover{
1689
- cursor: pointer;
1690
- }
1604
+ @media (max-width: 576px) {
1605
+ .video-js.skin_news .ssai-ad-container{
1606
+ bottom: 2px;
1607
+ }
1608
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1609
+ height: 5px !important;
1610
+ }
1611
+ .video-js.skin_news button.vjs-big-play-button {
1612
+ width: 50px !important;
1613
+ height: 50px !important;
1614
+ font-size: 2.1rem !important;
1615
+ }
1691
1616
 
1692
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1693
- position: relative;
1694
- padding-left: 0;
1617
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1618
+ display: none;
1619
+ }
1620
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1621
+ bottom: 2.4em !important;
1622
+ right: -1em;
1623
+ z-index: 1;
1695
1624
  }
1625
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1626
+ display: none !important;
1627
+ }
1696
1628
 
1697
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1698
- display: none !important;
1629
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1630
+ color: white;
1631
+ font-size: 13px;
1632
+ background-color: black;
1633
+ }
1699
1634
  }
1700
1635
 
1701
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1702
- /* width: 90px;
1703
- height: 90px;
1704
- display: flex;
1705
- justify-content: center;
1706
- align-items: center;
1707
- border-radius: 50%;
1708
- position: absolute;
1709
- top: 0;
1710
- left: 0;
1711
- right: 0;
1712
- bottom: 0;
1713
- margin: auto;
1714
- font-size: 6em;
1715
- line-height: 1.4em;
1716
- border: 0.05em solid;
1717
- color: inherit; */
1718
- display: none !important;
1719
- }
1720
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1721
- font-weight: bold;
1636
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1637
+ color: white;
1638
+ font-size: 16px;
1639
+ background-color: black;
1722
1640
  }
1723
1641
 
1724
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1725
- bottom: 2.4em !important;
1726
- right: -1em;
1727
- z-index: 1;
1642
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1643
+ margin-bottom: 2rem !important;
1728
1644
  }
1729
1645
 
1730
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1731
- width: 24px !important;
1732
- height: 24px !important;
1733
- }
1734
- .settings-selector-icon>svg{
1735
- height: 19px !important;
1736
- width: 19px !important;
1646
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1647
+ font-size: 18px !important;
1737
1648
  }
1738
1649
 
1739
1650
 
1740
- .video-js.skin_news_live button.vjs-rewind-button{
1741
- cursor: pointer;
1651
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1652
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1653
+ font-size: 1.2em !important;
1654
+ line-height: 1.5em !important;
1655
+ padding: 0.2em 0.8em !important;
1742
1656
  }
1743
1657
 
1744
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1745
- padding-right: 0;
1746
- display: none;
1658
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1659
+ content: none !important;
1660
+ fill: none !important;
1661
+ filter: none !important;
1747
1662
  }
1748
1663
 
1749
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1750
- padding-left: 0;
1751
- display: none;
1664
+ /* svg icons opacity and hover effect */
1665
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1666
+ opacity: 0.7 !important;
1752
1667
  }
1753
1668
 
1754
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1755
- padding-left: 0;
1756
- padding-right: 0;
1757
- display: none;
1669
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1670
+ opacity: 1 !important;
1671
+ }
1672
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1673
+ opacity: 0.7 !important;
1674
+ }
1675
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1676
+ opacity: 1 !important;
1758
1677
  }
1759
1678
 
1760
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1761
- display: none
1679
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1680
+ color: rgba(255, 255, 2555, 0.7)!important;
1762
1681
  }
1763
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1764
- display: none
1682
+
1683
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1684
+ color: rgba(255, 255, 2555, 1)!important;
1765
1685
  }
1766
1686
 
1767
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1687
+
1688
+
1689
+
1690
+ .video-js.skin_cn_news .vjs-control-bar {
1691
+ z-index: 1 !important;
1692
+ height: auto !important;
1693
+ padding: 0.8em 30px 0.6em;
1694
+ background: transparent !important;
1768
1695
  display: flex;
1696
+ flex-wrap: wrap;
1769
1697
  align-items: center;
1770
- font-weight: 700;
1771
- font-size: 12px;
1772
- min-width: 1.2em;
1698
+ column-gap: 10px;
1773
1699
  }
1774
1700
 
1775
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1776
- display: none;
1777
- font-size: 11px;
1778
- justify-content: center;
1779
- align-items: center;
1780
- user-select: none;
1701
+
1702
+ .video-js.skin_cn_news .vjs-control-bar::before {
1703
+ content: '';
1704
+ position: absolute;
1705
+ left: 0;
1706
+ right: 0;
1707
+ bottom: 0;
1708
+ top: -3em;
1709
+ background: linear-gradient(
1710
+ to top,
1711
+ rgba(0, 0, 0, 0.85) 0%,
1712
+ rgba(0, 0, 0, 0.7) 40%,
1713
+ rgba(0, 0, 0, 0.55) 70%,
1714
+ rgba(0, 0, 0, 0.38) 86%,
1715
+ transparent 100%
1716
+ );
1717
+ pointer-events: none;
1718
+ z-index: -1;
1781
1719
  }
1782
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1783
- display: none;
1720
+
1721
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1722
+ order: -1;
1723
+ flex: 0 0 100%;
1724
+ width: 80%;
1725
+ margin: 0 0 5em;
1726
+ position: relative;
1784
1727
  }
1785
1728
 
1786
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1787
- height: min-content;
1788
- width: min-content;
1729
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1730
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1731
+ width: auto;
1732
+ min-width: 0;
1789
1733
  }
1790
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1791
- width: 6em;
1734
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1735
+ display: inline-flex;
1736
+ align-items: center;
1737
+ justify-content: center;
1738
+ height: 7em;
1739
+ padding: 0 10px;
1740
+ color: #fff;
1792
1741
  }
1793
1742
 
1794
- .video-js.skin_news_live .content{
1795
- bottom: 3.4rem !important;
1796
- right: -4rem !important;
1743
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1744
+ content: none !important;
1797
1745
  }
1798
1746
 
1799
- .setting-icon > svg{
1800
- height:18px !important;
1801
- }
1802
1747
 
1803
- .output-overlay{
1804
- position: absolute;
1805
- bottom: 0;
1806
- height: 100%;
1807
- width: 100%;
1808
- z-index: 0;
1809
- border: 0;
1810
- pointer-events:none
1748
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1749
+ display: inline-flex;
1750
+ align-items: center;
1751
+ justify-content: center;
1752
+ }
1753
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1754
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1755
+ width: 24px;
1756
+ height: 24px;
1757
+ display: block;
1811
1758
  }
1812
1759
 
1813
- .video-js.skin_news_live iframe{
1814
- width: 100%;
1815
- height: 100%;
1760
+
1761
+
1762
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1763
+ opacity: 1;
1816
1764
  }
1817
1765
 
1818
- .video-js.skin_news_live .vjs-live-control{
1766
+
1767
+
1768
+ .video-js.skin_cn_news .vjs-volume-panel {
1769
+ margin: 0;
1770
+ display: inline-flex;
1819
1771
  align-items: center;
1820
- display: none;
1821
- }
1822
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1772
+ align-self: center;
1823
1773
  height: 2.2em;
1774
+ min-width: 7em;
1775
+ transition: none;
1776
+ }
1777
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1778
+ width: 0;
1779
+ height: 100%;
1824
1780
  display: flex;
1825
1781
  align-items: center;
1826
- font-family: monospace;
1782
+ overflow: hidden;
1783
+ opacity: 0;
1784
+ transition: width 0.15s ease, opacity 0.15s ease;
1785
+ }
1786
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1787
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1788
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1789
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1790
+ width: 5em;
1791
+ opacity: 1;
1792
+ }
1793
+
1794
+ .video-js.skin_cn_news .vjs-volume-bar {
1827
1795
  width: 4em;
1828
- justify-content: center;
1829
- background: red;
1830
- margin: 4px 0px 4px 12px;
1796
+ height: 0.3em;
1797
+ margin: 0 0.45em;
1831
1798
  }
1832
1799
 
1833
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1834
- text-shadow: none;
1800
+
1801
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1802
+ display: none !important;
1835
1803
  }
1836
1804
 
1837
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1838
- display: flex;
1839
- justify-content: center;
1840
- min-width: 5.3em;
1841
- pointer-events: none;
1842
- user-select: none;
1805
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1806
+ width: 0 !important;
1843
1807
  }
1844
1808
 
1845
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1846
- color: white;
1809
+
1810
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1811
+ display: block !important;
1812
+ flex: 1 1 auto;
1847
1813
  }
1848
1814
 
1849
1815
 
1850
- .settings-selection.vjs-control.vjs-button{
1851
- display: flex !important;
1816
+ .video-js.skin_cn_news .vjs-big-play-button {
1817
+ display: none;
1818
+ }
1819
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1820
+ position: relative !important;
1821
+ display: flex;
1822
+ left: 0;
1823
+ top: -1px;
1824
+ }
1825
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1826
+ display: flex;
1827
+ justify-content: center;
1828
+ align-items: center;
1829
+ position: absolute;
1830
+ top: 0;
1831
+ left: 0;
1832
+ right: 0;
1833
+ bottom: 0;
1834
+ margin: auto;
1835
+ width: 80px;
1836
+ height: 80px;
1837
+ border: none;
1838
+ border-radius: 50%;
1839
+ background: rgba(0, 0, 0, 0.55);
1840
+ font-size: 5em;
1841
+ line-height: 1.3em;
1842
+ transform: none !important;
1852
1843
  }
1853
1844
 
1854
- @media(max-width:576px){
1855
- .settings-selection.vjs-control.vjs-button{
1856
- display: none !important;
1857
- }
1845
+
1846
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1847
+ height: 4px !important;
1848
+ margin: 0;
1849
+ border-radius: 20px;
1850
+ background-color: #393944;
1858
1851
  }
1859
1852
 
1853
+ .video-js.skin_cn_news .vjs-play-progress {
1854
+ background-color: #ffffff;
1855
+ border-radius: 20px;
1856
+ }
1860
1857
 
1861
- @media(max-width:576px){
1862
- .tvProviderImage{
1863
- display: none
1864
- }
1865
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1866
- .icon-maximize {
1867
- height: 30px !important;
1868
- }
1858
+ .video-js.skin_cn_news .vjs-load-progress,
1859
+ .video-js.skin_cn_news .vjs-load-progress div {
1860
+ background: rgba(255, 255, 255, 0.15);
1861
+ border-radius: 20px;
1862
+ }
1869
1863
 
1870
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1871
- .icon-minimize {
1872
- height: 30px !important;
1873
- }
1874
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1875
- width: 4.5em;
1876
- }
1877
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1878
- height: min-content;
1879
- }
1880
1864
 
1881
- .video-js.skin_news_live button.vjs-slowmo-button{
1882
- display: none;
1883
- }
1884
- .video-js.skin_news_live button.vjs-rewind-button{
1885
- display: none;
1886
- }
1887
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1888
- height: 20px;
1889
- }
1890
- .video-js.skin_news_live .vjs-button{
1891
- width: 4.8em;
1892
- }
1893
- .video-js.skin_news_live .widget-selection{
1894
- display: none;
1895
- }
1896
- .video-js.skin_news_live .container{
1897
- display: none !important;
1898
- }
1899
- .video-js.skin_news_live .vjs-control-bar{
1900
- height: 4em !important;
1901
- }
1902
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1903
- font-size: 2.5em;
1904
- line-height: 1.5;
1905
- }
1906
- .video-js.skin_news_live .vjs-play-progress:before {
1907
- font-size: 1.2em;
1908
- position: absolute;
1909
- right: -0.5em;
1910
- z-index: 1;
1865
+ .video-js.skin_cn_news .vjs-play-progress:before {
1866
+ content: '';
1867
+ width: 16px;
1868
+ height: 16px;
1869
+ border-radius: 50%;
1870
+ background: #ffffff;
1871
+ border: 2px solid rgba(0, 0, 0, 0.6);
1872
+ box-sizing: border-box;
1873
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1874
+ top: -6px;
1875
+ right: -8px;
1876
+ position: absolute;
1911
1877
  }
1912
- .video-js.skin_news_live button.vjs-skip-button>svg{
1913
- height: 20px;
1878
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1879
+ display: none !important;
1880
+ }
1881
+
1882
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1883
+ background: #ffffff;
1884
+ color: #0a0e17;
1885
+ font-weight: 700;
1886
+ border-radius: 3px;
1887
+ }
1888
+
1889
+ .video-js.skin_cn_news .vjs-live-control {
1890
+ display: none !important;
1914
1891
  }
1915
- .video-js.skin_news_live button.vjs-big-play-button {
1916
- width: 50px !important;
1917
- height: 50px !important;
1918
- font-size: 2.1rem !important;
1892
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1893
+ display: inline-flex;
1894
+ align-items: center;
1895
+ align-self: center;
1896
+ height: 2.2em;
1897
+ gap: 5px;
1898
+ width: auto;
1899
+ padding: 0 10px;
1900
+ border: 1px solid rgba(255, 255, 255, 0.45);
1901
+ border-radius: 4px;
1902
+ cursor: pointer;
1919
1903
  }
1920
1904
 
1921
- .stream-selector-icon>svg{
1922
- width: 24px;
1923
- height: 24px;
1905
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1906
+ display: none;
1924
1907
  }
1925
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1926
- margin: 0 12px 0 12px;
1908
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1909
+ display: inline-flex;
1910
+ align-items: center;
1927
1911
  }
1928
- .video-js.skin_news_live .vjs-seek-to-live-text{
1929
- font-size: 12px;
1912
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1913
+ content: '';
1914
+ display: inline-block;
1915
+ width: 8px;
1916
+ height: 8px;
1917
+ border-radius: 50%;
1918
+ background: #ff2d2d; /* red live dot */
1930
1919
  }
1931
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1932
- margin: 0 12px 0 12px;
1920
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1921
+ color: #ffffff;
1922
+ font-weight: 700;
1923
+ font-size: 12px;
1924
+ letter-spacing: 0.03em;
1933
1925
  }
1926
+
1927
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1928
+ border-color: transparent;
1934
1929
  }
1935
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1936
- width: 90px;
1937
- height: 90px;
1938
- display: flex;
1939
- justify-content: center;
1940
- align-items: center;
1941
- border-radius: 50%;
1942
- position: absolute;
1943
- top: 0;
1944
- left: 0;
1945
- right: 0;
1946
- bottom: 0;
1947
- margin: auto;
1948
- font-size: 6em;
1949
- line-height: 1.4em;
1930
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1931
+ color: #ff2d2d;
1950
1932
  }
1951
1933
 
1952
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1953
- display: flex;
1954
- justify-content: center;
1934
+ /* ---- time controls ---- */
1935
+ .video-js.skin_cn_news .vjs-current-time,
1936
+ .video-js.skin_cn_news .vjs-duration,
1937
+ .video-js.skin_cn_news .vjs-time-divider {
1938
+ display: none !important;
1939
+ }
1940
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1941
+ display: none;
1955
1942
  align-items: center;
1956
- height: 100%;
1957
- transition: width 0.1s;
1943
+ justify-content: center;
1944
+ font-size: 11px;
1945
+ font-weight: 700;
1946
+ color: #fff;
1947
+ padding: 0 6px;
1948
+ user-select: none;
1958
1949
  }
1959
1950
 
1960
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1961
- display: flex;
1962
- justify-content: center;
1963
- align-items: center;
1964
- height: 100%;
1965
- transition: width 0.1s;
1951
+
1952
+ .video-js.skin_cn_news .vjs-chapter-marker {
1953
+ z-index: 2;
1954
+ width: var(--vl-chapter-size, 8px);
1955
+ height: var(--vl-chapter-size, 8px);
1956
+ top: 50%;
1957
+ bottom: auto;
1958
+ background: var(--vl-chapter-color, #ffffff);
1959
+ opacity: var(--vl-chapter-opacity, 1);
1960
+ border-radius: 50%;
1961
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1962
+ transform: translate(-50%, -50%) scale(1);
1963
+ transition: background-color 0.12s ease;
1966
1964
  }
1967
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1968
- display: none !important;
1965
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1966
+ background: var(--vl-chapter-hover, #0a5cff);
1967
+ }
1968
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1969
+ background: var(--vl-chapter-active, #0a5cff);
1969
1970
  }
1970
1971
 
1971
- @media (max-width: 576px) {
1972
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1973
- height: 5px !important;
1974
- }
1975
- .video-js.skin_news_live button.vjs-big-play-button {
1976
- width: 50px !important;
1977
- height: 50px !important;
1978
- font-size: 2.1rem !important;
1979
- }
1980
1972
 
1981
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1982
- display: none;
1983
- }
1984
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1985
- bottom: 2.4em !important;
1986
- right: -1em;
1987
- z-index: 1;
1973
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1974
+ width: 16px;
1975
+ height: 16px;
1976
+ bottom: 160%;
1977
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1988
1978
  }
1989
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1990
- display: none !important;
1991
- }
1992
1979
 
1993
- }
1994
1980
 
1995
- .video-js.skin_news_live .vjs-text-track-display-ttml {
1996
- width: 100% !important;
1981
+ .video-js.skin_cn_news .vjs-chapter-preview {
1982
+ background: var(--vl-chapter-tooltip, #0a5cff);
1983
+ border-radius: 6px;
1984
+ padding: 8px 10px;
1985
+ width: max-content;
1986
+ max-width: 300px;
1987
+ text-align: left;
1988
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1997
1989
  }
1998
-
1999
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
2000
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
2001
- font-size: 1.2em !important;
2002
- line-height: 1.5em !important;
2003
- padding: 0.2em 0.8em !important;
1990
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1991
+ color: #ffffff;
1992
+ font-size: 13px;
1993
+ font-weight: 400;
1994
+ margin-bottom: 2px;
2004
1995
  }
2005
-
2006
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
2007
- content: none !important;
2008
- fill: none !important;
2009
- filter: none !important;
1996
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1997
+ color: #ffffff;
1998
+ font-size: 13px;
1999
+ font-weight: 400;
2000
+ line-height: 1.3;
2001
+ white-space: normal;
2002
+ text-align: left;
2010
2003
  }
2011
-
2012
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2013
- color: rgba(255, 255, 2555, 0.7)!important;
2004
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2005
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2014
2006
  }
2015
2007
 
2016
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2017
- color: rgba(255, 255, 2555, 1)!important;
2008
+ /* ---- responsive ---- */
2009
+ @media (max-width: 576px) {
2010
+ .video-js.skin_cn_news .vjs-control-bar {
2011
+ height: 3.2em !important;
2012
+ padding: 0 8px;
2013
+ }
2014
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2015
+ padding: 0 6px;
2016
+ }
2017
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2018
+ display: none !important;
2019
+ }
2018
2020
  }
2019
2021
 
2020
-
2021
-
2022
2022
  /* CSS for videojs-dvr-seekbar */
2023
2023
 
2024
2024
  .video-js.vjs-dvr-seekbar {
@@ -2200,6 +2200,8 @@
2200
2200
 
2201
2201
 
2202
2202
 
2203
+
2204
+
2203
2205
  .video-js .multicamera-parent.default{
2204
2206
  height: 345px;
2205
2207
  position: absolute;
@@ -2328,8 +2330,6 @@
2328
2330
  }
2329
2331
 
2330
2332
 
2331
-
2332
-
2333
2333
  /* nextep — up-next card (centered in player, scales with player size) */
2334
2334
  .video-js:has(.next-ep-preview),
2335
2335
  .video-js:has(.next-ep-preview-player-thumb) {
@@ -2612,6 +2612,38 @@
2612
2612
  z-index: 30 !important;
2613
2613
  }
2614
2614
 
2615
+ /* a wrapper element that tracks the mouse vertically */
2616
+ .vjs-thumbnail-holder {
2617
+ position: absolute;
2618
+ left: -1000px;
2619
+ }
2620
+
2621
+ /* the thumbnail image itself */
2622
+ .vjs-thumbnail {
2623
+ position: absolute;
2624
+ left: 0;
2625
+ bottom: 1.3em;
2626
+ opacity: 0;
2627
+ transition: opacity .2s ease;
2628
+ -webkit-transition: opacity .2s ease;
2629
+ -moz-transition: opacity .2s ease;
2630
+ -mz-transition: opacity .2s ease;
2631
+ }
2632
+
2633
+ /* fade in the thumbnail when hovering over the progress bar */
2634
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2635
+ .vjs-progress-control:hover .vjs-thumbnail,
2636
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2637
+ .vjs-progress-control:active .vjs-thumbnail {
2638
+ opacity: 1;
2639
+ }
2640
+
2641
+ /* ... but hide the thumbnail when hovering directly over it */
2642
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2643
+ .vjs-progress-control:active .vjs-thumbnail:active {
2644
+ opacity: 0;
2645
+ }
2646
+
2615
2647
  .video-js.vjs-quality-menu {
2616
2648
  display: block;
2617
2649
  }
@@ -2691,38 +2723,6 @@
2691
2723
  .video-js.vjs-quality-menu .vjs-quality-menu-wrapper .vjs-menu .vjs-menu-content::-webkit-scrollbar{
2692
2724
  display: none;
2693
2725
  }
2694
- /* a wrapper element that tracks the mouse vertically */
2695
- .vjs-thumbnail-holder {
2696
- position: absolute;
2697
- left: -1000px;
2698
- }
2699
-
2700
- /* the thumbnail image itself */
2701
- .vjs-thumbnail {
2702
- position: absolute;
2703
- left: 0;
2704
- bottom: 1.3em;
2705
- opacity: 0;
2706
- transition: opacity .2s ease;
2707
- -webkit-transition: opacity .2s ease;
2708
- -moz-transition: opacity .2s ease;
2709
- -mz-transition: opacity .2s ease;
2710
- }
2711
-
2712
- /* fade in the thumbnail when hovering over the progress bar */
2713
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2714
- .vjs-progress-control:hover .vjs-thumbnail,
2715
- .vjs-progress-control.fake-active .vjs-thumbnail,
2716
- .vjs-progress-control:active .vjs-thumbnail {
2717
- opacity: 1;
2718
- }
2719
-
2720
- /* ... but hide the thumbnail when hovering directly over it */
2721
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2722
- .vjs-progress-control:active .vjs-thumbnail:active {
2723
- opacity: 0;
2724
- }
2725
-
2726
2726
  .vjs-poster {
2727
2727
  display: inline-block;
2728
2728
  vertical-align: middle;