@viewlift/player-backup 2.0.366-backup → 2.0.367-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.
package/cjs/bundle.css CHANGED
@@ -1,34 +1,31 @@
1
1
 
2
2
 
3
3
 
4
-
5
-
6
-
7
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
4
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
8
5
  font-size: 2.2em;
9
6
  line-height: 2.6;
10
7
  }
11
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
12
- background: #fcb700;
8
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
9
+ background: white;
13
10
  }
14
- .video-js.skin_news_live .vjs-control-bar{
11
+ .video-js.skin_news .vjs-control-bar{
15
12
  z-index: 1 !important;
16
13
  height: 5em !important;
17
14
  background: black !important;
18
15
  }
19
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
16
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
20
17
  display: flex;
21
18
  align-items: center;
22
19
  justify-content: center;
23
20
  }
24
21
 
25
- .video-js.skin_news_live .vjs-fade>* {
22
+ .video-js.skin_news .vjs-fade>* {
26
23
  visibility: hidden !important;
27
24
  opacity: 0 !important;
28
25
  transition: visibility 1s, opacity 1s !important;
29
26
  }
30
27
 
31
- .video-js.skin_news_live .custom-spaced-progress-bar {
28
+ .video-js.skin_news .custom-spaced-progress-bar {
32
29
  position: absolute;
33
30
  width: 100%;
34
31
  display: flex;
@@ -36,7 +33,7 @@
36
33
  top: -0.5em;
37
34
  }
38
35
 
39
- .video-js.skin_news_live .vjs-progress-control {
36
+ .video-js.skin_news .vjs-progress-control {
40
37
  /* left: -6px; */
41
38
  position: relative;
42
39
  width: 100%;
@@ -44,25 +41,22 @@
44
41
  transition: height 0.1s, top 0.1s;
45
42
  }
46
43
 
47
- .video-js.skin_news_live .vjs-volume-panel{
48
- min-width: 5.3em;
49
- }
50
44
 
51
45
 
52
46
 
53
- .video-js.skin_news_live .vjs-custom-control-spacer {
54
- /* display: block; */
55
- /* flex: 1 1 auto; */
47
+ .video-js.skin_news .vjs-custom-control-spacer {
48
+ display: block;
49
+ flex: 1 1 auto;
56
50
  }
57
51
 
58
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
52
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
59
53
  margin: 0 0px 0 0px;
60
54
  }
61
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
55
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
62
56
  display: none;
63
57
  }
64
58
 
65
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
59
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
66
60
  font-size: 14px;
67
61
  font-weight: 500;
68
62
  align-self: center;
@@ -71,30 +65,30 @@
71
65
  border-radius: 8px;
72
66
  }
73
67
 
74
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
68
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
75
69
  height: 6px !important;
76
70
  }
77
71
 
78
- .video-js.skin_news_live .vjs-play-progress:before {
72
+ .video-js.skin_news .vjs-play-progress:before {
79
73
  font-size: 1.5em;
80
74
  line-height: unset;
81
75
  top: -0.3333333333em;
82
76
  }
83
77
 
84
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
78
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
85
79
  display: none !important;
86
80
  }
87
81
 
88
82
  /* */
89
- .video-js.skin_news_live .vjs-mouse-display{
83
+ .video-js.skin_news .vjs-mouse-display{
90
84
  font-size: 1.6666666667em;
91
85
  }
92
86
 
93
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
87
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
94
88
  font-size: 1em !important;
95
89
  }
96
90
 
97
- .video-js.skin_news_live .vjs-button{
91
+ .video-js.skin_news .vjs-button{
98
92
  width: 5.3em;
99
93
  display: flex;
100
94
  align-items: center;
@@ -102,71 +96,63 @@
102
96
  }
103
97
 
104
98
 
105
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
99
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
106
100
  .icon-maximize {
107
101
  display: block;
108
102
  height: 32px;
109
103
  }
110
104
 
111
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
105
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
112
106
  line-height: 4;
113
107
  }
114
108
 
115
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
109
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
116
110
  .icon-minimize {
117
111
  display: none;
118
112
  height: 32px;
119
113
  }
120
114
 
121
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
115
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
122
116
  outline: none !important;
123
- /* flex: 1; */
124
- }
125
- .video-js.skin_news_live .vjs-play-toggle-container{
126
- display: flex;
127
- flex: 1;
128
- justify-content: center;
129
117
  }
130
-
131
-
132
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
118
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
133
119
  .vjs-icon-fullscreen-enter:before {
134
120
  /* content: '' !important; */
135
121
  }
136
122
 
137
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
123
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
138
124
  display: flex;
139
125
  justify-content: center;
140
126
  align-items: center;
141
127
  /* transform: rotate(90deg); */
142
128
  }
143
129
 
144
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
130
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
145
131
  display: none;
146
132
  }
147
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
133
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
148
134
  margin-left: -10px;
149
135
  }
150
136
 
151
- .video-js.skin_news_live .skipbtn:hover{
137
+ .video-js.skin_news .skipbtn:hover{
152
138
  cursor: pointer;
153
139
  }
154
140
 
155
- .video-js.skin_news_live .rewindbtn:hover{
141
+ .video-js.skin_news .rewindbtn:hover{
156
142
  cursor: pointer;
157
143
  }
158
144
 
159
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
145
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
160
146
  position: relative;
161
147
  padding-left: 0;
162
148
  }
163
149
 
164
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
150
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
165
151
  display: none !important;
166
152
  }
167
153
 
168
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
169
- /* width: 90px;
154
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
155
+ width: 90px;
170
156
  height: 90px;
171
157
  display: flex;
172
158
  justify-content: center;
@@ -181,20 +167,19 @@
181
167
  font-size: 6em;
182
168
  line-height: 1.4em;
183
169
  border: 0.05em solid;
184
- color: inherit; */
185
- display: none !important;
170
+ color: inherit;
186
171
  }
187
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
172
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
188
173
  font-weight: bold;
189
174
  }
190
175
 
191
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
176
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
192
177
  bottom: 2.4em !important;
193
178
  right: -1em;
194
179
  z-index: 1;
195
180
  }
196
181
 
197
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
182
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
198
183
  width: 24px !important;
199
184
  height: 24px !important;
200
185
  }
@@ -204,34 +189,34 @@
204
189
  }
205
190
 
206
191
 
207
- .video-js.skin_news_live button.vjs-rewind-button{
192
+ .video-js.skin_news button.vjs-rewind-button{
208
193
  cursor: pointer;
209
194
  }
210
195
 
211
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
196
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
212
197
  padding-right: 0;
213
- display: none;
214
198
  }
215
199
 
216
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
200
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
217
201
  padding-left: 0;
218
- display: none;
219
202
  }
220
203
 
221
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
204
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
222
205
  padding-left: 0;
223
206
  padding-right: 0;
224
- display: none;
207
+ display: flex;
208
+ justify-content: center;
209
+ width: min-content;
225
210
  }
226
211
 
227
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
212
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
228
213
  display: none
229
214
  }
230
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
215
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
231
216
  display: none
232
217
  }
233
218
 
234
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
219
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
235
220
  display: flex;
236
221
  align-items: center;
237
222
  font-weight: 700;
@@ -239,26 +224,26 @@
239
224
  min-width: 1.2em;
240
225
  }
241
226
 
242
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
227
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
243
228
  display: none;
244
229
  font-size: 11px;
245
230
  justify-content: center;
246
231
  align-items: center;
247
232
  user-select: none;
248
233
  }
249
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
234
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
250
235
  display: none;
251
236
  }
252
237
 
253
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
238
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
254
239
  height: min-content;
255
240
  width: min-content;
256
241
  }
257
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
242
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
258
243
  width: 6em;
259
244
  }
260
245
 
261
- .video-js.skin_news_live .content{
246
+ .video-js.skin_news .content{
262
247
  bottom: 3.4rem !important;
263
248
  right: -4rem !important;
264
249
  }
@@ -277,16 +262,15 @@
277
262
  pointer-events:none
278
263
  }
279
264
 
280
- .video-js.skin_news_live iframe{
265
+ .video-js.skin_news iframe{
281
266
  width: 100%;
282
267
  height: 100%;
283
268
  }
284
269
 
285
- .video-js.skin_news_live .vjs-live-control{
270
+ .video-js.skin_news .vjs-live-control{
286
271
  align-items: center;
287
- display: none;
288
272
  }
289
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
273
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
290
274
  height: 2.2em;
291
275
  display: flex;
292
276
  align-items: center;
@@ -297,22 +281,43 @@
297
281
  margin: 4px 0px 4px 12px;
298
282
  }
299
283
 
300
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
284
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
301
285
  text-shadow: none;
302
286
  }
287
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
288
+ display: none;
289
+ font-size: 12px;
290
+ }
303
291
 
304
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
305
- display: flex;
292
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
293
+ height: 2.2em;
294
+ display: inline-flex;
295
+ align-items: center;
296
+ /* font-family: monospace; */
306
297
  justify-content: center;
307
- min-width: 5.3em;
308
- pointer-events: none;
309
- user-select: none;
298
+ border: 2px solid;
299
+ margin: 4px 0px 4px 6px;
300
+ white-space: pre;
301
+ padding: 0px 6px;
302
+ font-size: 1.2em;
303
+ font-weight: 500;
304
+ color: rgba(255, 255, 2555, 0.7);
305
+
306
+ letter-spacing: -.1px;
307
+ line-height: normal;
308
+ text-transform: uppercase;
309
+ color: #FFFFFF;
310
+ opacity: .7;
311
+ font-family: "Proxima Nova";
310
312
  }
311
313
 
312
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
313
- color: white;
314
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
315
+ opacity: 1;
314
316
  }
315
317
 
318
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
319
+ content: "NOT LIVE";
320
+ }
316
321
 
317
322
  .settings-selection.vjs-control.vjs-button{
318
323
  display: flex !important;
@@ -329,57 +334,57 @@
329
334
  .tvProviderImage{
330
335
  display: none
331
336
  }
332
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
337
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
333
338
  .icon-maximize {
334
339
  height: 30px !important;
335
340
  }
336
341
 
337
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
342
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
338
343
  .icon-minimize {
339
344
  height: 30px !important;
340
345
  }
341
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
346
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
342
347
  width: 4.5em;
343
348
  }
344
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
349
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
345
350
  height: min-content;
346
351
  }
347
352
 
348
- .video-js.skin_news_live button.vjs-slowmo-button{
353
+ .video-js.skin_news button.vjs-slowmo-button{
349
354
  display: none;
350
355
  }
351
- .video-js.skin_news_live button.vjs-rewind-button{
356
+ .video-js.skin_news button.vjs-rewind-button{
352
357
  display: none;
353
358
  }
354
- .video-js.skin_news_live button.vjs-rewind-button>svg{
359
+ .video-js.skin_news button.vjs-rewind-button>svg{
355
360
  height: 20px;
356
361
  }
357
- .video-js.skin_news_live .vjs-button{
362
+ .video-js.skin_news .vjs-button{
358
363
  width: 4.8em;
359
364
  }
360
- .video-js.skin_news_live .widget-selection{
365
+ .video-js.skin_news .widget-selection{
361
366
  display: none;
362
367
  }
363
- .video-js.skin_news_live .container{
368
+ .video-js.skin_news .container{
364
369
  display: none !important;
365
370
  }
366
- .video-js.skin_news_live .vjs-control-bar{
371
+ .video-js.skin_news .vjs-control-bar{
367
372
  height: 4em !important;
368
373
  }
369
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
374
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
370
375
  font-size: 2.5em;
371
376
  line-height: 1.5;
372
377
  }
373
- .video-js.skin_news_live .vjs-play-progress:before {
378
+ .video-js.skin_news .vjs-play-progress:before {
374
379
  font-size: 1.2em;
375
380
  position: absolute;
376
381
  right: -0.5em;
377
382
  z-index: 1;
378
383
  }
379
- .video-js.skin_news_live button.vjs-skip-button>svg{
384
+ .video-js.skin_news button.vjs-skip-button>svg{
380
385
  height: 20px;
381
386
  }
382
- .video-js.skin_news_live button.vjs-big-play-button {
387
+ .video-js.skin_news button.vjs-big-play-button {
383
388
  width: 50px !important;
384
389
  height: 50px !important;
385
390
  font-size: 2.1rem !important;
@@ -389,17 +394,17 @@
389
394
  width: 24px;
390
395
  height: 24px;
391
396
  }
392
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
397
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
393
398
  margin: 0 12px 0 12px;
394
399
  }
395
- .video-js.skin_news_live .vjs-seek-to-live-text{
400
+ .video-js.skin_news .vjs-seek-to-live-text{
396
401
  font-size: 12px;
397
402
  }
398
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
403
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
399
404
  margin: 0 12px 0 12px;
400
405
  }
401
406
  }
402
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
407
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
403
408
  width: 90px;
404
409
  height: 90px;
405
410
  display: flex;
@@ -416,7 +421,7 @@
416
421
  line-height: 1.4em;
417
422
  }
418
423
 
419
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
424
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
420
425
  display: flex;
421
426
  justify-content: center;
422
427
  align-items: center;
@@ -424,22 +429,29 @@
424
429
  transition: width 0.1s;
425
430
  }
426
431
 
427
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
432
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
428
433
  display: flex;
429
434
  justify-content: center;
430
435
  align-items: center;
431
436
  height: 100%;
432
437
  transition: width 0.1s;
433
438
  }
434
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
439
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
435
440
  display: none !important;
436
441
  }
442
+ .video-js.skin_news .ssai-ad-container{
443
+ position: absolute;
444
+ bottom: 14px;
445
+ }
437
446
 
438
447
  @media (max-width: 576px) {
439
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
448
+ .video-js.skin_news .ssai-ad-container{
449
+ bottom: 2px;
450
+ }
451
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
440
452
  height: 5px !important;
441
453
  }
442
- .video-js.skin_news_live button.vjs-big-play-button {
454
+ .video-js.skin_news button.vjs-big-play-button {
443
455
  width: 50px !important;
444
456
  height: 50px !important;
445
457
  font-size: 2.1rem !important;
@@ -448,39 +460,70 @@
448
460
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
449
461
  display: none;
450
462
  }
451
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
463
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
452
464
  bottom: 2.4em !important;
453
465
  right: -1em;
454
466
  z-index: 1;
455
467
  }
456
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
468
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
457
469
  display: none !important;
458
470
  }
459
471
 
472
+ .video-js.skin_news .vjs-text-track-display-ttml span {
473
+ color: white;
474
+ font-size: 13px;
475
+ background-color: black;
476
+ }
460
477
  }
461
478
 
462
- .video-js.skin_news_live .vjs-text-track-display-ttml {
463
- width: 100% !important;
479
+ .video-js.skin_news .vjs-text-track-display-ttml span {
480
+ color: white;
481
+ font-size: 16px;
482
+ background-color: black;
464
483
  }
465
484
 
466
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
467
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
485
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
486
+ margin-bottom: 2rem !important;
487
+ }
488
+
489
+ .video-js.skin_news .vjs-text-track-display-ttml p {
490
+ font-size: 18px !important;
491
+ }
492
+
493
+
494
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
495
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
468
496
  font-size: 1.2em !important;
469
497
  line-height: 1.5em !important;
470
498
  padding: 0.2em 0.8em !important;
471
499
  }
472
500
 
473
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
501
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
474
502
  content: none !important;
475
503
  fill: none !important;
476
504
  filter: none !important;
477
505
  }
478
506
 
479
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
480
- color: rgba(255, 255, 2555, 0.7)!important;
507
+ /* svg icons opacity and hover effect */
508
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
509
+ opacity: 0.7 !important;
481
510
  }
482
511
 
483
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
512
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
513
+ opacity: 1 !important;
514
+ }
515
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
516
+ opacity: 0.7 !important;
517
+ }
518
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
519
+ opacity: 1 !important;
520
+ }
521
+
522
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
523
+ color: rgba(255, 255, 2555, 0.7)!important;
524
+ }
525
+
526
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
484
527
  color: rgba(255, 255, 2555, 1)!important;
485
528
  }
486
529
 
@@ -687,6 +730,7 @@
687
730
  .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
688
731
  text-decoration: underline;
689
732
  }
733
+
690
734
  .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
691
735
  font-size: 2.2em;
692
736
  line-height: 2.6;
@@ -1159,490 +1203,169 @@
1159
1203
 
1160
1204
 
1161
1205
 
1162
- .video-js.skin_cn_news .vjs-control-bar {
1163
- z-index: 1 !important;
1164
- height: auto !important;
1165
- padding: 0.8em 30px 0.6em;
1166
- background: transparent !important;
1206
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1207
+ font-size: 2.2em;
1208
+ line-height: 2.6;
1209
+ }
1210
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1211
+ background: #fcb700;
1212
+ }
1213
+ .video-js.skin_news_live .vjs-control-bar{
1214
+ z-index: 1 !important;
1215
+ height: 5em !important;
1216
+ background: black !important;
1217
+ }
1218
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1167
1219
  display: flex;
1168
- flex-wrap: wrap;
1169
1220
  align-items: center;
1170
- column-gap: 10px;
1221
+ justify-content: center;
1171
1222
  }
1172
1223
 
1224
+ .video-js.skin_news_live .vjs-fade>* {
1225
+ visibility: hidden !important;
1226
+ opacity: 0 !important;
1227
+ transition: visibility 1s, opacity 1s !important;
1228
+ }
1173
1229
 
1174
- .video-js.skin_cn_news .vjs-control-bar::before {
1175
- content: '';
1230
+ .video-js.skin_news_live .custom-spaced-progress-bar {
1176
1231
  position: absolute;
1177
- left: 0;
1178
- right: 0;
1179
- bottom: 0;
1180
- top: -3em;
1181
- background: linear-gradient(
1182
- to top,
1183
- rgba(0, 0, 0, 0.85) 0%,
1184
- rgba(0, 0, 0, 0.7) 40%,
1185
- rgba(0, 0, 0, 0.55) 70%,
1186
- rgba(0, 0, 0, 0.38) 86%,
1187
- transparent 100%
1188
- );
1189
- pointer-events: none;
1190
- z-index: -1;
1232
+ width: 100%;
1233
+ display: flex;
1234
+ height: 0.5em;
1235
+ top: -0.5em;
1191
1236
  }
1192
1237
 
1193
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1194
- order: -1;
1195
- flex: 0 0 100%;
1196
- width: 80%;
1197
- margin: 0 0 5em;
1238
+ .video-js.skin_news_live .vjs-progress-control {
1239
+ /* left: -6px; */
1198
1240
  position: relative;
1241
+ width: 100%;
1242
+ height: 0.5em;
1243
+ transition: height 0.1s, top 0.1s;
1199
1244
  }
1200
1245
 
1201
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1202
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1203
- width: auto;
1204
- min-width: 0;
1205
- }
1206
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1207
- display: inline-flex;
1208
- align-items: center;
1209
- justify-content: center;
1210
- height: 7em;
1211
- padding: 0 10px;
1212
- color: #fff;
1246
+ .video-js.skin_news_live .vjs-volume-panel{
1247
+ min-width: 5.3em;
1213
1248
  }
1214
1249
 
1215
- .video-js.skin_cn_news .vjs-svg-icon::before {
1216
- content: none !important;
1217
- }
1218
1250
 
1219
1251
 
1220
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1221
- display: inline-flex;
1222
- align-items: center;
1223
- justify-content: center;
1252
+ .video-js.skin_news_live .vjs-custom-control-spacer {
1253
+ /* display: block; */
1254
+ /* flex: 1 1 auto; */
1224
1255
  }
1225
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1226
- .video-js.skin_cn_news .vjs-rewind-button svg {
1227
- width: 24px;
1228
- height: 24px;
1229
- display: block;
1256
+
1257
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1258
+ margin: 0 0px 0 0px;
1259
+ }
1260
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1261
+ display: none;
1230
1262
  }
1231
1263
 
1264
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1265
+ font-size: 14px;
1266
+ font-weight: 500;
1267
+ align-self: center;
1268
+ height: min-content;
1269
+ padding: 5px 2px;
1270
+ border-radius: 8px;
1271
+ }
1232
1272
 
1273
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1274
+ height: 6px !important;
1275
+ }
1233
1276
 
1234
- .video-js.skin_cn_news .vjs-subs-caps-button {
1235
- opacity: 1;
1277
+ .video-js.skin_news_live .vjs-play-progress:before {
1278
+ font-size: 1.5em;
1279
+ line-height: unset;
1280
+ top: -0.3333333333em;
1236
1281
  }
1237
1282
 
1283
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1284
+ display: none !important;
1285
+ }
1238
1286
 
1287
+ /* */
1288
+ .video-js.skin_news_live .vjs-mouse-display{
1289
+ font-size: 1.6666666667em;
1290
+ }
1239
1291
 
1240
- .video-js.skin_cn_news .vjs-volume-panel {
1241
- margin: 0;
1242
- display: inline-flex;
1243
- align-items: center;
1244
- align-self: center;
1245
- height: 2.2em;
1246
- min-width: 7em;
1247
- transition: none;
1292
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1293
+ font-size: 1em !important;
1248
1294
  }
1249
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1250
- width: 0;
1251
- height: 100%;
1295
+
1296
+ .video-js.skin_news_live .vjs-button{
1297
+ width: 5.3em;
1252
1298
  display: flex;
1253
1299
  align-items: center;
1254
- overflow: hidden;
1255
- opacity: 0;
1256
- transition: width 0.15s ease, opacity 0.15s ease;
1257
- }
1258
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1259
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1260
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1261
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1262
- width: 5em;
1263
- opacity: 1;
1264
- }
1265
-
1266
- .video-js.skin_cn_news .vjs-volume-bar {
1267
- width: 4em;
1268
- height: 0.3em;
1269
- margin: 0 0.45em;
1300
+ justify-content: center;
1270
1301
  }
1271
1302
 
1272
1303
 
1273
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1274
- display: none !important;
1304
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1305
+ .icon-maximize {
1306
+ display: block;
1307
+ height: 32px;
1275
1308
  }
1276
1309
 
1277
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1278
- width: 0 !important;
1310
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1311
+ line-height: 4;
1279
1312
  }
1280
1313
 
1281
-
1282
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1283
- display: block !important;
1284
- flex: 1 1 auto;
1314
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1315
+ .icon-minimize {
1316
+ display: none;
1317
+ height: 32px;
1285
1318
  }
1286
1319
 
1287
-
1288
- .video-js.skin_cn_news .vjs-big-play-button {
1289
- display: none;
1320
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1321
+ outline: none !important;
1322
+ /* flex: 1; */
1290
1323
  }
1291
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1292
- position: relative !important;
1324
+ .video-js.skin_news_live .vjs-play-toggle-container{
1293
1325
  display: flex;
1294
- left: 0;
1295
- top: -1px;
1326
+ flex: 1;
1327
+ justify-content: center;
1296
1328
  }
1297
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1329
+
1330
+
1331
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1332
+ .vjs-icon-fullscreen-enter:before {
1333
+ /* content: '' !important; */
1334
+ }
1335
+
1336
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1298
1337
  display: flex;
1299
1338
  justify-content: center;
1300
1339
  align-items: center;
1301
- position: absolute;
1302
- top: 0;
1303
- left: 0;
1304
- right: 0;
1305
- bottom: 0;
1306
- margin: auto;
1307
- width: 80px;
1308
- height: 80px;
1309
- border: none;
1310
- border-radius: 50%;
1311
- background: rgba(0, 0, 0, 0.55);
1312
- font-size: 5em;
1313
- line-height: 1.3em;
1314
- transform: none !important;
1340
+ /* transform: rotate(90deg); */
1315
1341
  }
1316
1342
 
1343
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1344
+ display: none;
1345
+ }
1346
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1347
+ margin-left: -10px;
1348
+ }
1317
1349
 
1318
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1319
- height: 4px !important;
1320
- margin: 0;
1321
- border-radius: 20px;
1322
- background-color: #393944;
1350
+ .video-js.skin_news_live .skipbtn:hover{
1351
+ cursor: pointer;
1323
1352
  }
1324
1353
 
1325
- .video-js.skin_cn_news .vjs-play-progress {
1326
- background-color: #ffffff;
1327
- border-radius: 20px;
1354
+ .video-js.skin_news_live .rewindbtn:hover{
1355
+ cursor: pointer;
1328
1356
  }
1329
1357
 
1330
- .video-js.skin_cn_news .vjs-load-progress,
1331
- .video-js.skin_cn_news .vjs-load-progress div {
1332
- background: rgba(255, 255, 255, 0.15);
1333
- border-radius: 20px;
1358
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1359
+ position: relative;
1360
+ padding-left: 0;
1334
1361
  }
1335
1362
 
1363
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1364
+ display: none !important;
1365
+ }
1336
1366
 
1337
- .video-js.skin_cn_news .vjs-play-progress:before {
1338
- content: '';
1339
- width: 16px;
1340
- height: 16px;
1341
- border-radius: 50%;
1342
- background: #ffffff;
1343
- border: 2px solid rgba(0, 0, 0, 0.6);
1344
- box-sizing: border-box;
1345
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1346
- top: -6px;
1347
- right: -8px;
1348
- position: absolute;
1349
- }
1350
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1351
- display: none !important;
1352
- }
1353
-
1354
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1355
- background: #ffffff;
1356
- color: #0a0e17;
1357
- font-weight: 700;
1358
- border-radius: 3px;
1359
- }
1360
-
1361
- .video-js.skin_cn_news .vjs-live-control {
1362
- display: none !important;
1363
- }
1364
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1365
- display: inline-flex;
1366
- align-items: center;
1367
- align-self: center;
1368
- height: 2.2em;
1369
- gap: 5px;
1370
- width: auto;
1371
- padding: 0 10px;
1372
- border: 1px solid rgba(255, 255, 255, 0.45);
1373
- border-radius: 4px;
1374
- cursor: pointer;
1375
- }
1376
-
1377
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1378
- display: none;
1379
- }
1380
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1381
- display: inline-flex;
1382
- align-items: center;
1383
- }
1384
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1385
- content: '';
1386
- display: inline-block;
1387
- width: 8px;
1388
- height: 8px;
1389
- border-radius: 50%;
1390
- background: #ff2d2d; /* red live dot */
1391
- }
1392
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1393
- color: #ffffff;
1394
- font-weight: 700;
1395
- font-size: 12px;
1396
- letter-spacing: 0.03em;
1397
- }
1398
-
1399
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1400
- border-color: transparent;
1401
- }
1402
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1403
- color: #ff2d2d;
1404
- }
1405
-
1406
- /* ---- time controls ---- */
1407
- .video-js.skin_cn_news .vjs-current-time,
1408
- .video-js.skin_cn_news .vjs-duration,
1409
- .video-js.skin_cn_news .vjs-time-divider {
1410
- display: none !important;
1411
- }
1412
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1413
- display: none;
1414
- align-items: center;
1415
- justify-content: center;
1416
- font-size: 11px;
1417
- font-weight: 700;
1418
- color: #fff;
1419
- padding: 0 6px;
1420
- user-select: none;
1421
- }
1422
-
1423
-
1424
- .video-js.skin_cn_news .vjs-chapter-marker {
1425
- z-index: 2;
1426
- width: var(--vl-chapter-size, 8px);
1427
- height: var(--vl-chapter-size, 8px);
1428
- top: 50%;
1429
- bottom: auto;
1430
- background: var(--vl-chapter-color, #ffffff);
1431
- opacity: var(--vl-chapter-opacity, 1);
1432
- border-radius: 50%;
1433
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1434
- transform: translate(-50%, -50%) scale(1);
1435
- transition: background-color 0.12s ease;
1436
- }
1437
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1438
- background: var(--vl-chapter-hover, #0a5cff);
1439
- }
1440
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1441
- background: var(--vl-chapter-active, #0a5cff);
1442
- }
1443
-
1444
-
1445
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1446
- width: 16px;
1447
- height: 16px;
1448
- bottom: 160%;
1449
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1450
- }
1451
-
1452
-
1453
- .video-js.skin_cn_news .vjs-chapter-preview {
1454
- background: var(--vl-chapter-tooltip, #0a5cff);
1455
- border-radius: 6px;
1456
- padding: 8px 10px;
1457
- width: max-content;
1458
- max-width: 300px;
1459
- text-align: left;
1460
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1461
- }
1462
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1463
- color: #ffffff;
1464
- font-size: 13px;
1465
- font-weight: 400;
1466
- margin-bottom: 2px;
1467
- }
1468
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1469
- color: #ffffff;
1470
- font-size: 13px;
1471
- font-weight: 400;
1472
- line-height: 1.3;
1473
- white-space: normal;
1474
- text-align: left;
1475
- }
1476
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1477
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1478
- }
1479
-
1480
- /* ---- responsive ---- */
1481
- @media (max-width: 576px) {
1482
- .video-js.skin_cn_news .vjs-control-bar {
1483
- height: 3.2em !important;
1484
- padding: 0 8px;
1485
- }
1486
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1487
- padding: 0 6px;
1488
- }
1489
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1490
- display: none !important;
1491
- }
1492
- }
1493
-
1494
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1495
- font-size: 2.2em;
1496
- line-height: 2.6;
1497
- }
1498
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1499
- background: white;
1500
- }
1501
- .video-js.skin_news .vjs-control-bar{
1502
- z-index: 1 !important;
1503
- height: 5em !important;
1504
- background: black !important;
1505
- }
1506
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1507
- display: flex;
1508
- align-items: center;
1509
- justify-content: center;
1510
- }
1511
-
1512
- .video-js.skin_news .vjs-fade>* {
1513
- visibility: hidden !important;
1514
- opacity: 0 !important;
1515
- transition: visibility 1s, opacity 1s !important;
1516
- }
1517
-
1518
- .video-js.skin_news .custom-spaced-progress-bar {
1519
- position: absolute;
1520
- width: 100%;
1521
- display: flex;
1522
- height: 0.5em;
1523
- top: -0.5em;
1524
- }
1525
-
1526
- .video-js.skin_news .vjs-progress-control {
1527
- /* left: -6px; */
1528
- position: relative;
1529
- width: 100%;
1530
- height: 0.5em;
1531
- transition: height 0.1s, top 0.1s;
1532
- }
1533
-
1534
-
1535
-
1536
-
1537
- .video-js.skin_news .vjs-custom-control-spacer {
1538
- display: block;
1539
- flex: 1 1 auto;
1540
- }
1541
-
1542
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1543
- margin: 0 0px 0 0px;
1544
- }
1545
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1546
- display: none;
1547
- }
1548
-
1549
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1550
- font-size: 14px;
1551
- font-weight: 500;
1552
- align-self: center;
1553
- height: min-content;
1554
- padding: 5px 2px;
1555
- border-radius: 8px;
1556
- }
1557
-
1558
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1559
- height: 6px !important;
1560
- }
1561
-
1562
- .video-js.skin_news .vjs-play-progress:before {
1563
- font-size: 1.5em;
1564
- line-height: unset;
1565
- top: -0.3333333333em;
1566
- }
1567
-
1568
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1569
- display: none !important;
1570
- }
1571
-
1572
- /* */
1573
- .video-js.skin_news .vjs-mouse-display{
1574
- font-size: 1.6666666667em;
1575
- }
1576
-
1577
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1578
- font-size: 1em !important;
1579
- }
1580
-
1581
- .video-js.skin_news .vjs-button{
1582
- width: 5.3em;
1583
- display: flex;
1584
- align-items: center;
1585
- justify-content: center;
1586
- }
1587
-
1588
-
1589
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1590
- .icon-maximize {
1591
- display: block;
1592
- height: 32px;
1593
- }
1594
-
1595
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1596
- line-height: 4;
1597
- }
1598
-
1599
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1600
- .icon-minimize {
1601
- display: none;
1602
- height: 32px;
1603
- }
1604
-
1605
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1606
- outline: none !important;
1607
- }
1608
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1609
- .vjs-icon-fullscreen-enter:before {
1610
- /* content: '' !important; */
1611
- }
1612
-
1613
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1614
- display: flex;
1615
- justify-content: center;
1616
- align-items: center;
1617
- /* transform: rotate(90deg); */
1618
- }
1619
-
1620
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1621
- display: none;
1622
- }
1623
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1624
- margin-left: -10px;
1625
- }
1626
-
1627
- .video-js.skin_news .skipbtn:hover{
1628
- cursor: pointer;
1629
- }
1630
-
1631
- .video-js.skin_news .rewindbtn:hover{
1632
- cursor: pointer;
1633
- }
1634
-
1635
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1636
- position: relative;
1637
- padding-left: 0;
1638
- }
1639
-
1640
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1641
- display: none !important;
1642
- }
1643
-
1644
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1645
- width: 90px;
1367
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1368
+ /* width: 90px;
1646
1369
  height: 90px;
1647
1370
  display: flex;
1648
1371
  justify-content: center;
@@ -1657,19 +1380,20 @@
1657
1380
  font-size: 6em;
1658
1381
  line-height: 1.4em;
1659
1382
  border: 0.05em solid;
1660
- color: inherit;
1383
+ color: inherit; */
1384
+ display: none !important;
1661
1385
  }
1662
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1386
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1663
1387
  font-weight: bold;
1664
1388
  }
1665
1389
 
1666
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1390
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1667
1391
  bottom: 2.4em !important;
1668
1392
  right: -1em;
1669
1393
  z-index: 1;
1670
1394
  }
1671
1395
 
1672
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1396
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1673
1397
  width: 24px !important;
1674
1398
  height: 24px !important;
1675
1399
  }
@@ -1679,34 +1403,34 @@
1679
1403
  }
1680
1404
 
1681
1405
 
1682
- .video-js.skin_news button.vjs-rewind-button{
1406
+ .video-js.skin_news_live button.vjs-rewind-button{
1683
1407
  cursor: pointer;
1684
1408
  }
1685
1409
 
1686
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1410
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1687
1411
  padding-right: 0;
1412
+ display: none;
1688
1413
  }
1689
1414
 
1690
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1415
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1691
1416
  padding-left: 0;
1417
+ display: none;
1692
1418
  }
1693
1419
 
1694
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1420
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1695
1421
  padding-left: 0;
1696
1422
  padding-right: 0;
1697
- display: flex;
1698
- justify-content: center;
1699
- width: min-content;
1423
+ display: none;
1700
1424
  }
1701
1425
 
1702
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1426
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1703
1427
  display: none
1704
1428
  }
1705
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1429
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1706
1430
  display: none
1707
1431
  }
1708
1432
 
1709
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
1433
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1710
1434
  display: flex;
1711
1435
  align-items: center;
1712
1436
  font-weight: 700;
@@ -1714,26 +1438,26 @@
1714
1438
  min-width: 1.2em;
1715
1439
  }
1716
1440
 
1717
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1441
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1718
1442
  display: none;
1719
1443
  font-size: 11px;
1720
1444
  justify-content: center;
1721
1445
  align-items: center;
1722
1446
  user-select: none;
1723
1447
  }
1724
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1448
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1725
1449
  display: none;
1726
1450
  }
1727
1451
 
1728
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1452
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1729
1453
  height: min-content;
1730
1454
  width: min-content;
1731
1455
  }
1732
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1456
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1733
1457
  width: 6em;
1734
1458
  }
1735
1459
 
1736
- .video-js.skin_news .content{
1460
+ .video-js.skin_news_live .content{
1737
1461
  bottom: 3.4rem !important;
1738
1462
  right: -4rem !important;
1739
1463
  }
@@ -1752,15 +1476,16 @@
1752
1476
  pointer-events:none
1753
1477
  }
1754
1478
 
1755
- .video-js.skin_news iframe{
1479
+ .video-js.skin_news_live iframe{
1756
1480
  width: 100%;
1757
1481
  height: 100%;
1758
1482
  }
1759
1483
 
1760
- .video-js.skin_news .vjs-live-control{
1484
+ .video-js.skin_news_live .vjs-live-control{
1761
1485
  align-items: center;
1486
+ display: none;
1762
1487
  }
1763
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1488
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1764
1489
  height: 2.2em;
1765
1490
  display: flex;
1766
1491
  align-items: center;
@@ -1771,44 +1496,23 @@
1771
1496
  margin: 4px 0px 4px 12px;
1772
1497
  }
1773
1498
 
1774
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1499
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1775
1500
  text-shadow: none;
1776
1501
  }
1777
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1778
- display: none;
1779
- font-size: 12px;
1780
- }
1781
1502
 
1782
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1783
- height: 2.2em;
1784
- display: inline-flex;
1785
- align-items: center;
1786
- /* font-family: monospace; */
1503
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1504
+ display: flex;
1787
1505
  justify-content: center;
1788
- border: 2px solid;
1789
- margin: 4px 0px 4px 6px;
1790
- white-space: pre;
1791
- padding: 0px 6px;
1792
- font-size: 1.2em;
1793
- font-weight: 500;
1794
- color: rgba(255, 255, 2555, 0.7);
1795
-
1796
- letter-spacing: -.1px;
1797
- line-height: normal;
1798
- text-transform: uppercase;
1799
- color: #FFFFFF;
1800
- opacity: .7;
1801
- font-family: "Proxima Nova";
1802
- }
1803
-
1804
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1805
- opacity: 1;
1506
+ min-width: 5.3em;
1507
+ pointer-events: none;
1508
+ user-select: none;
1806
1509
  }
1807
1510
 
1808
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1809
- content: "NOT LIVE";
1511
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1512
+ color: white;
1810
1513
  }
1811
1514
 
1515
+
1812
1516
  .settings-selection.vjs-control.vjs-button{
1813
1517
  display: flex !important;
1814
1518
  }
@@ -1824,57 +1528,57 @@
1824
1528
  .tvProviderImage{
1825
1529
  display: none
1826
1530
  }
1827
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1531
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1828
1532
  .icon-maximize {
1829
1533
  height: 30px !important;
1830
1534
  }
1831
1535
 
1832
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1536
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1833
1537
  .icon-minimize {
1834
1538
  height: 30px !important;
1835
1539
  }
1836
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1540
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1837
1541
  width: 4.5em;
1838
1542
  }
1839
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1543
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1840
1544
  height: min-content;
1841
1545
  }
1842
1546
 
1843
- .video-js.skin_news button.vjs-slowmo-button{
1547
+ .video-js.skin_news_live button.vjs-slowmo-button{
1844
1548
  display: none;
1845
1549
  }
1846
- .video-js.skin_news button.vjs-rewind-button{
1550
+ .video-js.skin_news_live button.vjs-rewind-button{
1847
1551
  display: none;
1848
1552
  }
1849
- .video-js.skin_news button.vjs-rewind-button>svg{
1553
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1850
1554
  height: 20px;
1851
1555
  }
1852
- .video-js.skin_news .vjs-button{
1556
+ .video-js.skin_news_live .vjs-button{
1853
1557
  width: 4.8em;
1854
1558
  }
1855
- .video-js.skin_news .widget-selection{
1559
+ .video-js.skin_news_live .widget-selection{
1856
1560
  display: none;
1857
1561
  }
1858
- .video-js.skin_news .container{
1562
+ .video-js.skin_news_live .container{
1859
1563
  display: none !important;
1860
1564
  }
1861
- .video-js.skin_news .vjs-control-bar{
1565
+ .video-js.skin_news_live .vjs-control-bar{
1862
1566
  height: 4em !important;
1863
1567
  }
1864
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1568
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1865
1569
  font-size: 2.5em;
1866
1570
  line-height: 1.5;
1867
1571
  }
1868
- .video-js.skin_news .vjs-play-progress:before {
1572
+ .video-js.skin_news_live .vjs-play-progress:before {
1869
1573
  font-size: 1.2em;
1870
1574
  position: absolute;
1871
1575
  right: -0.5em;
1872
1576
  z-index: 1;
1873
1577
  }
1874
- .video-js.skin_news button.vjs-skip-button>svg{
1578
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1875
1579
  height: 20px;
1876
1580
  }
1877
- .video-js.skin_news button.vjs-big-play-button {
1581
+ .video-js.skin_news_live button.vjs-big-play-button {
1878
1582
  width: 50px !important;
1879
1583
  height: 50px !important;
1880
1584
  font-size: 2.1rem !important;
@@ -1884,141 +1588,437 @@
1884
1588
  width: 24px;
1885
1589
  height: 24px;
1886
1590
  }
1887
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1591
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1888
1592
  margin: 0 12px 0 12px;
1889
1593
  }
1890
- .video-js.skin_news .vjs-seek-to-live-text{
1594
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1891
1595
  font-size: 12px;
1892
1596
  }
1893
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1894
- margin: 0 12px 0 12px;
1597
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1598
+ margin: 0 12px 0 12px;
1599
+ }
1600
+ }
1601
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1602
+ width: 90px;
1603
+ height: 90px;
1604
+ display: flex;
1605
+ justify-content: center;
1606
+ align-items: center;
1607
+ border-radius: 50%;
1608
+ position: absolute;
1609
+ top: 0;
1610
+ left: 0;
1611
+ right: 0;
1612
+ bottom: 0;
1613
+ margin: auto;
1614
+ font-size: 6em;
1615
+ line-height: 1.4em;
1616
+ }
1617
+
1618
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1619
+ display: flex;
1620
+ justify-content: center;
1621
+ align-items: center;
1622
+ height: 100%;
1623
+ transition: width 0.1s;
1624
+ }
1625
+
1626
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1627
+ display: flex;
1628
+ justify-content: center;
1629
+ align-items: center;
1630
+ height: 100%;
1631
+ transition: width 0.1s;
1632
+ }
1633
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1634
+ display: none !important;
1635
+ }
1636
+
1637
+ @media (max-width: 576px) {
1638
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1639
+ height: 5px !important;
1640
+ }
1641
+ .video-js.skin_news_live button.vjs-big-play-button {
1642
+ width: 50px !important;
1643
+ height: 50px !important;
1644
+ font-size: 2.1rem !important;
1645
+ }
1646
+
1647
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1648
+ display: none;
1649
+ }
1650
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1651
+ bottom: 2.4em !important;
1652
+ right: -1em;
1653
+ z-index: 1;
1654
+ }
1655
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1656
+ display: none !important;
1657
+ }
1658
+
1659
+ }
1660
+
1661
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1662
+ width: 100% !important;
1663
+ }
1664
+
1665
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1666
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1667
+ font-size: 1.2em !important;
1668
+ line-height: 1.5em !important;
1669
+ padding: 0.2em 0.8em !important;
1670
+ }
1671
+
1672
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1673
+ content: none !important;
1674
+ fill: none !important;
1675
+ filter: none !important;
1676
+ }
1677
+
1678
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1679
+ color: rgba(255, 255, 2555, 0.7)!important;
1680
+ }
1681
+
1682
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1683
+ color: rgba(255, 255, 2555, 1)!important;
1684
+ }
1685
+
1686
+
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;
1695
+ display: flex;
1696
+ flex-wrap: wrap;
1697
+ align-items: center;
1698
+ column-gap: 10px;
1699
+ }
1700
+
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;
1719
+ }
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;
1727
+ }
1728
+
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;
1733
+ }
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;
1741
+ }
1742
+
1743
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1744
+ content: none !important;
1745
+ }
1746
+
1747
+
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;
1758
+ }
1759
+
1760
+
1761
+
1762
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1763
+ opacity: 1;
1764
+ }
1765
+
1766
+
1767
+
1768
+ .video-js.skin_cn_news .vjs-volume-panel {
1769
+ margin: 0;
1770
+ display: inline-flex;
1771
+ align-items: center;
1772
+ align-self: center;
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%;
1780
+ display: flex;
1781
+ align-items: center;
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 {
1795
+ width: 4em;
1796
+ height: 0.3em;
1797
+ margin: 0 0.45em;
1798
+ }
1799
+
1800
+
1801
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1802
+ display: none !important;
1803
+ }
1804
+
1805
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1806
+ width: 0 !important;
1807
+ }
1808
+
1809
+
1810
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1811
+ display: block !important;
1812
+ flex: 1 1 auto;
1813
+ }
1814
+
1815
+
1816
+ .video-js.skin_cn_news .vjs-big-play-button {
1817
+ display: none;
1895
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;
1896
1824
  }
1897
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1898
- width: 90px;
1899
- height: 90px;
1825
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1900
1826
  display: flex;
1901
1827
  justify-content: center;
1902
1828
  align-items: center;
1903
- border-radius: 50%;
1904
1829
  position: absolute;
1905
1830
  top: 0;
1906
1831
  left: 0;
1907
1832
  right: 0;
1908
1833
  bottom: 0;
1909
1834
  margin: auto;
1910
- font-size: 6em;
1911
- line-height: 1.4em;
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;
1912
1843
  }
1913
1844
 
1914
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1915
- display: flex;
1916
- justify-content: center;
1917
- align-items: center;
1918
- height: 100%;
1919
- transition: width 0.1s;
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;
1920
1851
  }
1921
1852
 
1922
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1923
- display: flex;
1924
- justify-content: center;
1925
- align-items: center;
1926
- height: 100%;
1927
- transition: width 0.1s;
1853
+ .video-js.skin_cn_news .vjs-play-progress {
1854
+ background-color: #ffffff;
1855
+ border-radius: 20px;
1928
1856
  }
1929
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1930
- display: none !important;
1857
+
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;
1931
1862
  }
1932
- .video-js.skin_news .ssai-ad-container{
1863
+
1864
+
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;
1933
1876
  position: absolute;
1934
- bottom: 14px;
1877
+ }
1878
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1879
+ display: none !important;
1935
1880
  }
1936
1881
 
1937
- @media (max-width: 576px) {
1938
- .video-js.skin_news .ssai-ad-container{
1939
- bottom: 2px;
1940
- }
1941
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1942
- height: 5px !important;
1943
- }
1944
- .video-js.skin_news button.vjs-big-play-button {
1945
- width: 50px !important;
1946
- height: 50px !important;
1947
- font-size: 2.1rem !important;
1948
- }
1949
-
1950
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1951
- display: none;
1952
- }
1953
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1954
- bottom: 2.4em !important;
1955
- right: -1em;
1956
- z-index: 1;
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;
1957
1887
  }
1958
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1959
- display: none !important;
1960
- }
1961
1888
 
1962
- .video-js.skin_news .vjs-text-track-display-ttml span {
1963
- color: white;
1964
- font-size: 13px;
1965
- background-color: black;
1966
- }
1889
+ .video-js.skin_cn_news .vjs-live-control {
1890
+ display: none !important;
1891
+ }
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;
1967
1903
  }
1968
1904
 
1969
- .video-js.skin_news .vjs-text-track-display-ttml span {
1970
- color: white;
1971
- font-size: 16px;
1972
- background-color: black;
1905
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1906
+ display: none;
1907
+ }
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;
1911
+ }
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 */
1919
+ }
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;
1973
1925
  }
1974
1926
 
1975
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1976
- margin-bottom: 2rem !important;
1927
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1928
+ border-color: transparent;
1929
+ }
1930
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1931
+ color: #ff2d2d;
1977
1932
  }
1978
1933
 
1979
- .video-js.skin_news .vjs-text-track-display-ttml p {
1980
- font-size: 18px !important;
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;
1942
+ align-items: center;
1943
+ justify-content: center;
1944
+ font-size: 11px;
1945
+ font-weight: 700;
1946
+ color: #fff;
1947
+ padding: 0 6px;
1948
+ user-select: none;
1981
1949
  }
1982
1950
 
1983
1951
 
1984
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1985
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1986
- font-size: 1.2em !important;
1987
- line-height: 1.5em !important;
1988
- padding: 0.2em 0.8em !important;
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;
1989
1964
  }
1990
-
1991
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1992
- content: none !important;
1993
- fill: none !important;
1994
- filter: 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);
1995
1970
  }
1996
1971
 
1997
- /* svg icons opacity and hover effect */
1998
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1999
- opacity: 0.7 !important;
1972
+
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));
2000
1978
  }
2001
1979
 
2002
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
2003
- opacity: 1 !important;
1980
+
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);
2004
1989
  }
2005
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
2006
- opacity: 0.7 !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;
2007
1995
  }
2008
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
2009
- opacity: 1 !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 .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 .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 {
@@ -2199,8 +2199,6 @@
2199
2199
 
2200
2200
 
2201
2201
 
2202
-
2203
-
2204
2202
  .video-js .multicamera-parent.default{
2205
2203
  height: 345px;
2206
2204
  position: absolute;
@@ -2282,6 +2280,8 @@
2282
2280
 
2283
2281
 
2284
2282
 
2283
+
2284
+
2285
2285
  .vjs-custom-big-mute.vjs-control{
2286
2286
  position: absolute;
2287
2287
  align-items: center;