@viewlift/player-backup 2.0.316-backup → 2.0.318-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 (63) hide show
  1. package/cjs/{autoNextVideo-aca868b2.js → autoNextVideo-6704601a.js} +1 -1
  2. package/cjs/bundle.css +1085 -979
  3. package/cjs/{features-ba230d44.js → features-ef61de84.js} +1 -1
  4. package/cjs/{generic-b119e225.js → generic-754b73b9.js} +1 -1
  5. package/cjs/{index-c1289347.js → index-58a5e66f.js} +1 -1
  6. package/cjs/{index-90eaa87b.js → index-759a1ed5.js} +1 -1
  7. package/cjs/{index-069a9358.js → index-94a82c6b.js} +1 -1
  8. package/cjs/index-c82f1ab8.js +1 -0
  9. package/cjs/index.js +1 -1
  10. package/cjs/{multicamv2-afc38215.js → multicamv2-a5ccde69.js} +1 -1
  11. package/cjs/{multicamv2-1de3d2cf.js → multicamv2-c0ea0f16.js} +1 -1
  12. package/cjs/{nextEpisodeButton-ba5016fe.js → nextEpisodeButton-94a6e1c3.js} +1 -1
  13. package/cjs/{playlist-4c8be9da.js → playlist-869072fe.js} +1 -1
  14. package/cjs/{series-b93644c2.js → series-45f423d1.js} +1 -1
  15. package/cjs/{series-v2-93b2300c.js → series-v2-85099d28.js} +1 -1
  16. package/cjs/{series-v2-706cd019.js → series-v2-fa48542f.js} +1 -1
  17. package/cjs/{skin-e69b9634.js → skin-0ba3b5ee.js} +1 -1
  18. package/cjs/{skin-e0837286.js → skin-0f4c3f0c.js} +1 -1
  19. package/cjs/{skin-9fd7e847.js → skin-10eb465d.js} +1 -1
  20. package/cjs/{skin-ebca6c8b.js → skin-13f1ddc0.js} +1 -1
  21. package/cjs/{skin-dcc335ff.js → skin-211ae95b.js} +1 -1
  22. package/cjs/{skin-32b69fad.js → skin-a015e59f.js} +1 -1
  23. package/cjs/{skin-6dfcf154.js → skin-ba4cd74f.js} +1 -1
  24. package/cjs/{skin-20ef2a38.js → skin-c6e91e59.js} +1 -1
  25. package/cjs/{skin-bf860a27.js → skin-e5bc212a.js} +1 -1
  26. package/cjs/{skin-35b032cc.js → skin-f7c8304f.js} +1 -1
  27. package/cjs/videoSelector-3c8fb5e9.js +1 -0
  28. package/cjs/{videoSelector-cf477c8e.js → videoSelector-e8c72f5d.js} +1 -1
  29. package/cjs/{videojs-dash5.es-fd74bd77.js → videojs-dash5.es-e6b0205f.js} +1 -1
  30. package/esm/{autoNextVideo-91c70a62.js → autoNextVideo-d5b82444.js} +1 -1
  31. package/esm/bundle.css +1085 -979
  32. package/esm/components/video-selector/videoSelector.d.ts +1 -0
  33. package/esm/{features-ee38c5bb.js → features-99081d09.js} +1 -1
  34. package/esm/{generic-d8ac6622.js → generic-f765c6f0.js} +1 -1
  35. package/esm/index-32db0990.js +1 -0
  36. package/esm/{index-22ed302f.js → index-894852f9.js} +1 -1
  37. package/esm/{index-554f98ba.js → index-97684837.js} +1 -1
  38. package/esm/{index-080bf7b9.js → index-aba78d94.js} +1 -1
  39. package/esm/index.js +1 -1
  40. package/esm/{multicamv2-52fd51a9.js → multicamv2-455bd82e.js} +1 -1
  41. package/esm/{multicamv2-f174146d.js → multicamv2-723a367d.js} +1 -1
  42. package/esm/{nextEpisodeButton-a6d2c73b.js → nextEpisodeButton-6ceba54e.js} +1 -1
  43. package/esm/{playlist-a412afc9.js → playlist-16d651a2.js} +1 -1
  44. package/esm/{series-becfa7b8.js → series-99ed8498.js} +1 -1
  45. package/esm/{series-v2-1736cc8f.js → series-v2-d9d8653b.js} +1 -1
  46. package/esm/{series-v2-5442a8d9.js → series-v2-ec6c014a.js} +1 -1
  47. package/esm/{skin-8a5bf136.js → skin-0c5cb109.js} +1 -1
  48. package/esm/{skin-076873a1.js → skin-513a9b7d.js} +1 -1
  49. package/esm/{skin-e0e20103.js → skin-5b9c3675.js} +1 -1
  50. package/esm/{skin-1c90159f.js → skin-66c6b120.js} +1 -1
  51. package/esm/{skin-500c2418.js → skin-953812ed.js} +1 -1
  52. package/esm/{skin-4f4fee6c.js → skin-b471f198.js} +1 -1
  53. package/esm/{skin-b8d4c095.js → skin-c182cabd.js} +1 -1
  54. package/esm/{skin-3be46735.js → skin-e63ece28.js} +1 -1
  55. package/esm/{skin-c212b8d7.js → skin-f3c11ee9.js} +1 -1
  56. package/esm/{skin-56f6d601.js → skin-ffe5b1ec.js} +1 -1
  57. package/esm/{videoSelector-c77c3f9e.js → videoSelector-ba26c654.js} +1 -1
  58. package/esm/{videoSelector-45e68ccd.js → videoSelector-fc8de3a6.js} +1 -1
  59. package/esm/{videojs-dash5.es-ea7b0efc.js → videojs-dash5.es-43f0858c.js} +1 -1
  60. package/package.json +1 -1
  61. package/cjs/index-9c7a1bcb.js +0 -1
  62. package/cjs/videoSelector-0747ad7d.js +0 -1
  63. package/esm/index-54e8aa9b.js +0 -1
package/cjs/bundle.css CHANGED
@@ -1,30 +1,27 @@
1
1
 
2
2
 
3
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
3
+
4
+
5
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
4
6
  font-size: 2.2em;
5
7
  line-height: 2.6;
6
8
  }
7
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
8
- background: white;
9
+ .video-js.skin_mini{
10
+ overflow: hidden;
9
11
  }
10
- .video-js.skin_news .vjs-control-bar{
12
+ .video-js.skin_mini .vjs-control-bar{
11
13
  z-index: 1 !important;
12
- height: 5em !important;
14
+ height: 4em !important;
13
15
  background: black !important;
14
16
  }
15
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
16
- display: flex;
17
- align-items: center;
18
- justify-content: center;
19
- }
20
17
 
21
- .video-js.skin_news .vjs-fade>* {
18
+ .video-js.skin_mini .vjs-fade>* {
22
19
  visibility: hidden !important;
23
20
  opacity: 0 !important;
24
21
  transition: visibility 1s, opacity 1s !important;
25
22
  }
26
23
 
27
- .video-js.skin_news .custom-spaced-progress-bar {
24
+ .video-js.skin_mini .custom-spaced-progress-bar {
28
25
  position: absolute;
29
26
  width: 100%;
30
27
  display: flex;
@@ -32,7 +29,7 @@
32
29
  top: -0.5em;
33
30
  }
34
31
 
35
- .video-js.skin_news .vjs-progress-control {
32
+ .video-js.skin_mini .vjs-progress-control {
36
33
  /* left: -6px; */
37
34
  position: relative;
38
35
  width: 100%;
@@ -43,19 +40,19 @@
43
40
 
44
41
 
45
42
 
46
- .video-js.skin_news .vjs-custom-control-spacer {
43
+ .video-js.skin_mini .vjs-custom-control-spacer {
47
44
  display: block;
48
45
  flex: 1 1 auto;
49
46
  }
50
47
 
51
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
48
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
52
49
  margin: 0 0px 0 0px;
53
50
  }
54
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
51
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
55
52
  display: none;
56
53
  }
57
54
 
58
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
55
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
59
56
  font-size: 14px;
60
57
  font-weight: 500;
61
58
  align-self: center;
@@ -64,143 +61,158 @@
64
61
  border-radius: 8px;
65
62
  }
66
63
 
67
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
68
- height: 6px !important;
64
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
65
+ height: 5px !important;
69
66
  }
70
67
 
71
- .video-js.skin_news .vjs-play-progress:before {
72
- font-size: 1.5em;
68
+ .video-js.skin_mini .vjs-play-progress:before {
69
+ font-size: 1.3em;
73
70
  line-height: unset;
74
71
  top: -0.3333333333em;
75
72
  }
76
73
 
77
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
74
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
78
75
  display: none !important;
79
76
  }
80
77
 
81
78
  /* */
82
- .video-js.skin_news .vjs-mouse-display{
79
+ .video-js.skin_mini .vjs-mouse-display{
83
80
  font-size: 1.6666666667em;
84
81
  }
85
82
 
86
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
83
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
87
84
  font-size: 1em !important;
88
85
  }
89
86
 
90
- .video-js.skin_news .vjs-button{
91
- width: 5.3em;
87
+ .video-js.skin_mini .vjs-button{
88
+ width: 3em;
92
89
  display: flex;
93
90
  align-items: center;
94
91
  justify-content: center;
95
92
  }
96
93
 
97
94
 
98
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
95
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
99
96
  .icon-maximize {
100
97
  display: block;
101
98
  height: 32px;
102
99
  }
103
100
 
104
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
101
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
105
102
  line-height: 4;
106
103
  }
107
104
 
108
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
105
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
109
106
  .icon-minimize {
110
107
  display: none;
111
108
  height: 32px;
112
109
  }
113
110
 
114
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
111
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
115
112
  outline: none !important;
116
113
  }
117
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
114
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
118
115
  .vjs-icon-fullscreen-enter:before {
119
116
  /* content: '' !important; */
120
117
  }
121
118
 
122
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
119
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
123
120
  display: flex;
124
121
  justify-content: center;
125
122
  align-items: center;
126
123
  /* transform: rotate(90deg); */
127
124
  }
128
125
 
129
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
126
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
130
127
  display: none;
131
128
  }
132
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
129
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
133
130
  margin-left: -10px;
131
+ display: none;
134
132
  }
135
133
 
136
- .video-js.skin_news .skipbtn:hover{
134
+ .video-js.skin_mini .vjs-loading-spinner {
135
+ position: absolute;
136
+ top: 50%;
137
+ left: 50%;
138
+ transform: translate(-50%, -50%);
139
+ opacity: .85;
140
+ text-align: left;
141
+ border: .2em solid rgba(43, 51, 63, .7);
142
+ box-sizing: border-box;
143
+ background-clip: padding-box;
144
+ width: 3em;
145
+ height: 3em;
146
+ border-radius: 50%;
147
+ visibility: hidden;
148
+ }
149
+
150
+ .video-js.skin_mini .skipbtn:hover{
137
151
  cursor: pointer;
138
152
  }
139
153
 
140
- .video-js.skin_news .rewindbtn:hover{
154
+ .video-js.skin_mini .rewindbtn:hover{
141
155
  cursor: pointer;
142
156
  }
143
157
 
144
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
158
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
145
159
  position: relative;
146
160
  padding-left: 0;
147
161
  }
148
162
 
149
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
150
- display: none !important;
163
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
164
+ width: 40px;
165
+ height: 40px;
166
+ display: flex;
167
+ justify-content: center;
168
+ align-items: center;
169
+ border: none;
170
+ position: absolute;
171
+ top: 0;
172
+ left: 0;
173
+ right: 0;
174
+ bottom: 0;
175
+ margin: auto;
176
+ font-size: 3em;
177
+ line-height: 1.3em;
178
+ transform: none !important;
179
+ border-radius: 1.3em;
151
180
  }
152
181
 
153
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
154
- width: 90px;
155
- height: 90px;
156
- display: flex;
157
- justify-content: center;
158
- align-items: center;
159
- border-radius: 50%;
160
- position: absolute;
161
- top: 0;
162
- left: 0;
163
- right: 0;
164
- bottom: 0;
165
- margin: auto;
166
- font-size: 6em;
167
- line-height: 1.4em;
168
- border: 0.05em solid;
169
- color: inherit;
170
- }
171
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
182
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
172
183
  font-weight: bold;
173
184
  }
174
185
 
175
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
176
- bottom: 2.4em !important;
177
- right: -1em;
186
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
187
+ bottom: 1.1em !important;
188
+ right: 1em;
178
189
  z-index: 1;
190
+ font-size: 10px;
179
191
  }
180
192
 
181
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
193
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
182
194
  width: 24px !important;
183
195
  height: 24px !important;
184
196
  }
185
- .settings-selector-icon>svg{
197
+ .video-js.skin_mini .settings-selector-icon>svg{
186
198
  height: 19px !important;
187
199
  width: 19px !important;
188
200
  }
189
201
 
190
202
 
191
- .video-js.skin_news button.vjs-rewind-button{
203
+ .video-js.skin_mini button.vjs-rewind-button{
192
204
  cursor: pointer;
193
205
  }
194
206
 
195
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
207
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
196
208
  padding-right: 0;
197
209
  }
198
210
 
199
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
211
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
200
212
  padding-left: 0;
201
213
  }
202
214
 
203
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
215
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
204
216
  padding-left: 0;
205
217
  padding-right: 0;
206
218
  display: flex;
@@ -208,46 +220,48 @@
208
220
  width: min-content;
209
221
  }
210
222
 
211
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
223
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
212
224
  display: none
213
225
  }
214
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
226
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
215
227
  display: none
216
228
  }
217
229
 
218
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
219
- display: flex;
220
- align-items: center;
221
- font-weight: 700;
222
- font-size: 12px;
223
- min-width: 1.2em;
230
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
231
+ display: flex;
232
+ align-items: center;
233
+ font-weight: 700;
234
+ font-size: 9px;
235
+ min-width: 0.8em;
236
+ padding-left: 0;
224
237
  }
225
238
 
226
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
239
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
227
240
  display: none;
228
241
  font-size: 11px;
229
242
  justify-content: center;
230
243
  align-items: center;
231
244
  user-select: none;
232
245
  }
233
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
246
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
234
247
  display: none;
235
248
  }
236
249
 
237
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
250
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
238
251
  height: min-content;
239
252
  width: min-content;
240
253
  }
241
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
242
- width: 6em;
254
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
255
+ width: 3em;
256
+ margin-right: 4px;
243
257
  }
244
258
 
245
- .video-js.skin_news .content{
259
+ .video-js.skin_mini .content{
246
260
  bottom: 3.4rem !important;
247
261
  right: -4rem !important;
248
262
  }
249
263
 
250
- .setting-icon > svg{
264
+ .video-js.skin_mini .setting-icon > svg{
251
265
  height:18px !important;
252
266
  }
253
267
 
@@ -261,15 +275,16 @@
261
275
  pointer-events:none
262
276
  }
263
277
 
264
- .video-js.skin_news iframe{
278
+ .video-js.skin_mini iframe{
265
279
  width: 100%;
266
280
  height: 100%;
267
281
  }
268
282
 
269
- .video-js.skin_news .vjs-live-control{
283
+ .video-js.skin_mini .vjs-live-control{
270
284
  align-items: center;
285
+ max-width: 5em;
271
286
  }
272
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
287
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
273
288
  height: 2.2em;
274
289
  display: flex;
275
290
  align-items: center;
@@ -277,284 +292,210 @@
277
292
  width: 4em;
278
293
  justify-content: center;
279
294
  background: red;
280
- margin: 4px 0px 4px 12px;
295
+ margin: 4px 0px 4px 2px;
281
296
  }
282
297
 
283
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
298
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
284
299
  text-shadow: none;
285
300
  }
286
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
301
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
287
302
  display: none;
288
303
  font-size: 12px;
289
304
  }
290
305
 
291
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
292
- height: 2.2em;
306
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
307
+ height: 1.8em;
293
308
  display: inline-flex;
294
309
  align-items: center;
295
- /* font-family: monospace; */
310
+ font-family: monospace;
296
311
  justify-content: center;
297
- border: 2px solid;
298
- margin: 4px 0px 4px 6px;
312
+ border: 1.5px solid;
313
+ margin: 4px 0px 4px 2px;
299
314
  white-space: pre;
300
- padding: 0px 6px;
315
+ padding: 2px 4px;
301
316
  font-size: 1.2em;
302
317
  font-weight: 500;
303
318
  color: rgba(255, 255, 2555, 0.7);
304
-
305
- letter-spacing: -.1px;
306
- line-height: normal;
307
- text-transform: uppercase;
308
- color: #FFFFFF;
309
- opacity: .7;
310
- font-family: "Proxima Nova";
311
- }
312
-
313
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
314
- opacity: 1;
315
319
  }
316
320
 
317
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
321
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
318
322
  content: "NOT LIVE";
319
- }
320
-
321
- .settings-selection.vjs-control.vjs-button{
322
- display: flex !important;
323
- }
324
-
325
- @media(max-width:576px){
326
- .settings-selection.vjs-control.vjs-button{
327
- display: none !important;
328
- }
323
+ word-spacing: -4px;
329
324
  }
330
325
 
331
326
 
332
- @media(max-width:576px){
327
+ @media(max-width:600px){
333
328
  .tvProviderImage{
334
329
  display: none
335
330
  }
336
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
331
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
337
332
  .icon-maximize {
338
333
  height: 30px !important;
339
334
  }
340
335
 
341
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
336
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
342
337
  .icon-minimize {
343
338
  height: 30px !important;
344
339
  }
345
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
346
- width: 4.5em;
340
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
341
+ width: 3.5em;
347
342
  }
348
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
343
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
349
344
  height: min-content;
350
345
  }
351
346
 
352
- .video-js.skin_news button.vjs-slowmo-button{
347
+ .video-js.skin_mini button.vjs-slowmo-button{
353
348
  display: none;
354
349
  }
355
- .video-js.skin_news button.vjs-rewind-button{
350
+ .video-js.skin_mini button.vjs-rewind-button{
356
351
  display: none;
357
352
  }
358
- .video-js.skin_news button.vjs-rewind-button>svg{
353
+ .video-js.skin_mini button.vjs-rewind-button>svg{
359
354
  height: 20px;
360
355
  }
361
- .video-js.skin_news .vjs-button{
362
- width: 4.8em;
356
+ .video-js.skin_mini .vjs-button{
357
+ width: 3em;
363
358
  }
364
- .video-js.skin_news .widget-selection{
359
+ .video-js.skin_mini .widget-selection{
365
360
  display: none;
366
361
  }
367
- .video-js.skin_news .container{
362
+ .video-js.skin_mini .container{
368
363
  display: none !important;
369
364
  }
370
- .video-js.skin_news .vjs-control-bar{
365
+ .video-js.skin_mini .vjs-control-bar{
371
366
  height: 4em !important;
372
367
  }
373
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
368
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
374
369
  font-size: 2.5em;
375
370
  line-height: 1.5;
376
371
  }
377
- .video-js.skin_news .vjs-play-progress:before {
372
+ .video-js.skin_mini .vjs-play-progress:before {
378
373
  font-size: 1.2em;
379
374
  position: absolute;
380
375
  right: -0.5em;
381
376
  z-index: 1;
382
377
  }
383
- .video-js.skin_news button.vjs-skip-button>svg{
378
+ .video-js.skin_mini button.vjs-skip-button>svg{
384
379
  height: 20px;
385
380
  }
386
- .video-js.skin_news button.vjs-big-play-button {
387
- width: 50px !important;
388
- height: 50px !important;
389
- font-size: 2.1rem !important;
390
- }
391
381
 
392
382
  .stream-selector-icon>svg{
393
383
  width: 24px;
394
384
  height: 24px;
395
385
  }
396
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
397
- margin: 0 12px 0 12px;
398
- }
399
- .video-js.skin_news .vjs-seek-to-live-text{
386
+ .video-js.skin_mini .vjs-seek-to-live-text{
400
387
  font-size: 12px;
401
388
  }
402
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
403
- margin: 0 12px 0 12px;
389
+
390
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
391
+ color: white !important;
392
+ font-size: 16px !important;
393
+ background-color: rgba(0,0,0,0.2) !important;
394
+ }
404
395
  }
396
+
397
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
398
+ color: white !important;
399
+ font-size: 16px !important;
400
+ background-color: rgba(0,0,0,0.2) !important;
405
401
  }
406
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
407
- width: 90px;
408
- height: 90px;
409
- display: flex;
410
- justify-content: center;
411
- align-items: center;
412
- border-radius: 50%;
413
- position: absolute;
414
- top: 0;
415
- left: 0;
416
- right: 0;
417
- bottom: 0;
418
- margin: auto;
419
- font-size: 6em;
420
- line-height: 1.4em;
402
+
403
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
404
+ font-size: 18px !important;
421
405
  }
422
406
 
423
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
407
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
408
+ margin-bottom: 1rem !important;
409
+ }
410
+
411
+
412
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
424
413
  display: flex;
425
414
  justify-content: center;
426
415
  align-items: center;
427
416
  height: 100%;
428
417
  transition: width 0.1s;
429
418
  }
419
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
420
+ margin: 2px;
421
+ }
430
422
 
431
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
423
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
432
424
  display: flex;
433
425
  justify-content: center;
434
426
  align-items: center;
435
427
  height: 100%;
436
428
  transition: width 0.1s;
437
429
  }
438
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
439
- display: none !important;
440
- }
441
- .video-js.skin_news .ssai-ad-container{
442
- position: absolute;
443
- bottom: 14px;
430
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
431
+ display: grid;
432
+ font-size: 10px;
433
+ grid-template-columns: 1fr;
434
+ grid-template-rows: 1fr;
435
+ padding: 1px 0px 0 0px;
436
+ margin: 0;
444
437
  }
445
438
 
446
- @media (max-width: 576px) {
447
- .video-js.skin_news .ssai-ad-container{
448
- bottom: 2px;
449
- }
450
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
439
+ @media (max-width: 600px) {
440
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
451
441
  height: 5px !important;
452
442
  }
453
- .video-js.skin_news button.vjs-big-play-button {
454
- width: 50px !important;
455
- height: 50px !important;
456
- font-size: 2.1rem !important;
457
- }
458
443
 
459
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
444
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
460
445
  display: none;
461
446
  }
462
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
463
- bottom: 2.4em !important;
464
- right: -1em;
465
- z-index: 1;
466
- }
467
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
468
- display: none !important;
469
- }
470
-
471
- .video-js.skin_news .vjs-text-track-display-ttml span {
472
- color: white;
473
- font-size: 13px;
474
- background-color: black;
475
- }
476
- }
477
-
478
- .video-js.skin_news .vjs-text-track-display-ttml span {
479
- color: white;
480
- font-size: 16px;
481
- background-color: black;
482
- }
483
-
484
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
485
- margin-bottom: 2rem !important;
486
- }
487
-
488
- .video-js.skin_news .vjs-text-track-display-ttml p {
489
- font-size: 18px !important;
490
- }
491
447
 
492
-
493
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
494
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
495
- font-size: 1.2em !important;
496
- line-height: 1.5em !important;
497
- padding: 0.2em 0.8em !important;
498
448
  }
499
449
 
500
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
450
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
501
451
  content: none !important;
502
452
  fill: none !important;
503
453
  filter: none !important;
504
454
  }
505
455
 
506
456
  /* svg icons opacity and hover effect */
507
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
457
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
508
458
  opacity: 0.7 !important;
509
459
  }
510
460
 
511
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
512
- opacity: 1 !important;
513
- }
514
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
515
- opacity: 0.7 !important;
516
- }
517
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
461
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
518
462
  opacity: 1 !important;
519
463
  }
520
464
 
521
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
465
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
522
466
  color: rgba(255, 255, 2555, 0.7)!important;
523
467
  }
524
468
 
525
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
469
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
526
470
  color: rgba(255, 255, 2555, 1)!important;
527
471
  }
528
472
 
529
473
 
530
-
531
-
532
-
533
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
474
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
534
475
  font-size: 2.2em;
535
476
  line-height: 2.6;
536
477
  }
537
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
538
- background: #fcb700;
478
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
479
+ background: white;
539
480
  }
540
- .video-js.skin_news_live .vjs-control-bar{
481
+ .video-js.skin_news .vjs-control-bar{
541
482
  z-index: 1 !important;
542
483
  height: 5em !important;
543
484
  background: black !important;
544
485
  }
545
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
486
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
546
487
  display: flex;
547
488
  align-items: center;
548
489
  justify-content: center;
549
490
  }
550
491
 
551
- .video-js.skin_news_live .vjs-fade>* {
492
+ .video-js.skin_news .vjs-fade>* {
552
493
  visibility: hidden !important;
553
494
  opacity: 0 !important;
554
495
  transition: visibility 1s, opacity 1s !important;
555
496
  }
556
497
 
557
- .video-js.skin_news_live .custom-spaced-progress-bar {
498
+ .video-js.skin_news .custom-spaced-progress-bar {
558
499
  position: absolute;
559
500
  width: 100%;
560
501
  display: flex;
@@ -562,7 +503,7 @@
562
503
  top: -0.5em;
563
504
  }
564
505
 
565
- .video-js.skin_news_live .vjs-progress-control {
506
+ .video-js.skin_news .vjs-progress-control {
566
507
  /* left: -6px; */
567
508
  position: relative;
568
509
  width: 100%;
@@ -570,25 +511,22 @@
570
511
  transition: height 0.1s, top 0.1s;
571
512
  }
572
513
 
573
- .video-js.skin_news_live .vjs-volume-panel{
574
- min-width: 5.3em;
575
- }
576
514
 
577
515
 
578
516
 
579
- .video-js.skin_news_live .vjs-custom-control-spacer {
580
- /* display: block; */
581
- /* flex: 1 1 auto; */
517
+ .video-js.skin_news .vjs-custom-control-spacer {
518
+ display: block;
519
+ flex: 1 1 auto;
582
520
  }
583
521
 
584
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
522
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
585
523
  margin: 0 0px 0 0px;
586
524
  }
587
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
525
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
588
526
  display: none;
589
527
  }
590
528
 
591
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
529
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
592
530
  font-size: 14px;
593
531
  font-weight: 500;
594
532
  align-self: center;
@@ -597,30 +535,30 @@
597
535
  border-radius: 8px;
598
536
  }
599
537
 
600
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
538
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
601
539
  height: 6px !important;
602
540
  }
603
541
 
604
- .video-js.skin_news_live .vjs-play-progress:before {
542
+ .video-js.skin_news .vjs-play-progress:before {
605
543
  font-size: 1.5em;
606
544
  line-height: unset;
607
545
  top: -0.3333333333em;
608
546
  }
609
547
 
610
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
548
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
611
549
  display: none !important;
612
550
  }
613
551
 
614
552
  /* */
615
- .video-js.skin_news_live .vjs-mouse-display{
553
+ .video-js.skin_news .vjs-mouse-display{
616
554
  font-size: 1.6666666667em;
617
555
  }
618
556
 
619
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
557
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
620
558
  font-size: 1em !important;
621
559
  }
622
560
 
623
- .video-js.skin_news_live .vjs-button{
561
+ .video-js.skin_news .vjs-button{
624
562
  width: 5.3em;
625
563
  display: flex;
626
564
  align-items: center;
@@ -628,71 +566,63 @@
628
566
  }
629
567
 
630
568
 
631
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
569
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
632
570
  .icon-maximize {
633
571
  display: block;
634
572
  height: 32px;
635
573
  }
636
574
 
637
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
575
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
638
576
  line-height: 4;
639
577
  }
640
578
 
641
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
579
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
642
580
  .icon-minimize {
643
581
  display: none;
644
582
  height: 32px;
645
583
  }
646
584
 
647
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
585
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
648
586
  outline: none !important;
649
- /* flex: 1; */
650
- }
651
- .video-js.skin_news_live .vjs-play-toggle-container{
652
- display: flex;
653
- flex: 1;
654
- justify-content: center;
655
587
  }
656
-
657
-
658
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
588
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
659
589
  .vjs-icon-fullscreen-enter:before {
660
590
  /* content: '' !important; */
661
591
  }
662
592
 
663
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
593
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
664
594
  display: flex;
665
595
  justify-content: center;
666
596
  align-items: center;
667
597
  /* transform: rotate(90deg); */
668
598
  }
669
599
 
670
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
600
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
671
601
  display: none;
672
602
  }
673
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
603
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
674
604
  margin-left: -10px;
675
605
  }
676
606
 
677
- .video-js.skin_news_live .skipbtn:hover{
607
+ .video-js.skin_news .skipbtn:hover{
678
608
  cursor: pointer;
679
609
  }
680
610
 
681
- .video-js.skin_news_live .rewindbtn:hover{
611
+ .video-js.skin_news .rewindbtn:hover{
682
612
  cursor: pointer;
683
613
  }
684
614
 
685
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
615
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
686
616
  position: relative;
687
617
  padding-left: 0;
688
618
  }
689
619
 
690
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
620
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
691
621
  display: none !important;
692
622
  }
693
623
 
694
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
695
- /* width: 90px;
624
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
625
+ width: 90px;
696
626
  height: 90px;
697
627
  display: flex;
698
628
  justify-content: center;
@@ -707,20 +637,19 @@
707
637
  font-size: 6em;
708
638
  line-height: 1.4em;
709
639
  border: 0.05em solid;
710
- color: inherit; */
711
- display: none !important;
640
+ color: inherit;
712
641
  }
713
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
642
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
714
643
  font-weight: bold;
715
644
  }
716
645
 
717
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
646
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
718
647
  bottom: 2.4em !important;
719
648
  right: -1em;
720
649
  z-index: 1;
721
650
  }
722
651
 
723
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
652
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
724
653
  width: 24px !important;
725
654
  height: 24px !important;
726
655
  }
@@ -730,34 +659,34 @@
730
659
  }
731
660
 
732
661
 
733
- .video-js.skin_news_live button.vjs-rewind-button{
662
+ .video-js.skin_news button.vjs-rewind-button{
734
663
  cursor: pointer;
735
664
  }
736
665
 
737
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
666
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
738
667
  padding-right: 0;
739
- display: none;
740
668
  }
741
669
 
742
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
670
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
743
671
  padding-left: 0;
744
- display: none;
745
672
  }
746
673
 
747
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
674
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
748
675
  padding-left: 0;
749
676
  padding-right: 0;
750
- display: none;
677
+ display: flex;
678
+ justify-content: center;
679
+ width: min-content;
751
680
  }
752
681
 
753
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
682
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
754
683
  display: none
755
684
  }
756
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
685
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
757
686
  display: none
758
687
  }
759
688
 
760
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
689
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
761
690
  display: flex;
762
691
  align-items: center;
763
692
  font-weight: 700;
@@ -765,26 +694,26 @@
765
694
  min-width: 1.2em;
766
695
  }
767
696
 
768
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
697
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
769
698
  display: none;
770
699
  font-size: 11px;
771
700
  justify-content: center;
772
701
  align-items: center;
773
702
  user-select: none;
774
703
  }
775
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
704
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
776
705
  display: none;
777
706
  }
778
707
 
779
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
708
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
780
709
  height: min-content;
781
710
  width: min-content;
782
711
  }
783
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
712
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
784
713
  width: 6em;
785
714
  }
786
715
 
787
- .video-js.skin_news_live .content{
716
+ .video-js.skin_news .content{
788
717
  bottom: 3.4rem !important;
789
718
  right: -4rem !important;
790
719
  }
@@ -803,16 +732,15 @@
803
732
  pointer-events:none
804
733
  }
805
734
 
806
- .video-js.skin_news_live iframe{
735
+ .video-js.skin_news iframe{
807
736
  width: 100%;
808
737
  height: 100%;
809
738
  }
810
739
 
811
- .video-js.skin_news_live .vjs-live-control{
740
+ .video-js.skin_news .vjs-live-control{
812
741
  align-items: center;
813
- display: none;
814
742
  }
815
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
743
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
816
744
  height: 2.2em;
817
745
  display: flex;
818
746
  align-items: center;
@@ -823,22 +751,43 @@
823
751
  margin: 4px 0px 4px 12px;
824
752
  }
825
753
 
826
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
754
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
827
755
  text-shadow: none;
828
756
  }
757
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
758
+ display: none;
759
+ font-size: 12px;
760
+ }
829
761
 
830
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
831
- display: flex;
762
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
763
+ height: 2.2em;
764
+ display: inline-flex;
765
+ align-items: center;
766
+ /* font-family: monospace; */
832
767
  justify-content: center;
833
- min-width: 5.3em;
834
- pointer-events: none;
835
- user-select: none;
768
+ border: 2px solid;
769
+ margin: 4px 0px 4px 6px;
770
+ white-space: pre;
771
+ padding: 0px 6px;
772
+ font-size: 1.2em;
773
+ font-weight: 500;
774
+ color: rgba(255, 255, 2555, 0.7);
775
+
776
+ letter-spacing: -.1px;
777
+ line-height: normal;
778
+ text-transform: uppercase;
779
+ color: #FFFFFF;
780
+ opacity: .7;
781
+ font-family: "Proxima Nova";
836
782
  }
837
783
 
838
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
839
- color: white;
784
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
785
+ opacity: 1;
840
786
  }
841
787
 
788
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
789
+ content: "NOT LIVE";
790
+ }
842
791
 
843
792
  .settings-selection.vjs-control.vjs-button{
844
793
  display: flex !important;
@@ -855,57 +804,57 @@
855
804
  .tvProviderImage{
856
805
  display: none
857
806
  }
858
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
807
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
859
808
  .icon-maximize {
860
809
  height: 30px !important;
861
810
  }
862
811
 
863
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
812
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
864
813
  .icon-minimize {
865
814
  height: 30px !important;
866
815
  }
867
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
816
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
868
817
  width: 4.5em;
869
818
  }
870
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
819
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
871
820
  height: min-content;
872
821
  }
873
822
 
874
- .video-js.skin_news_live button.vjs-slowmo-button{
823
+ .video-js.skin_news button.vjs-slowmo-button{
875
824
  display: none;
876
825
  }
877
- .video-js.skin_news_live button.vjs-rewind-button{
826
+ .video-js.skin_news button.vjs-rewind-button{
878
827
  display: none;
879
828
  }
880
- .video-js.skin_news_live button.vjs-rewind-button>svg{
829
+ .video-js.skin_news button.vjs-rewind-button>svg{
881
830
  height: 20px;
882
831
  }
883
- .video-js.skin_news_live .vjs-button{
832
+ .video-js.skin_news .vjs-button{
884
833
  width: 4.8em;
885
834
  }
886
- .video-js.skin_news_live .widget-selection{
835
+ .video-js.skin_news .widget-selection{
887
836
  display: none;
888
837
  }
889
- .video-js.skin_news_live .container{
838
+ .video-js.skin_news .container{
890
839
  display: none !important;
891
840
  }
892
- .video-js.skin_news_live .vjs-control-bar{
841
+ .video-js.skin_news .vjs-control-bar{
893
842
  height: 4em !important;
894
843
  }
895
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
844
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
896
845
  font-size: 2.5em;
897
846
  line-height: 1.5;
898
847
  }
899
- .video-js.skin_news_live .vjs-play-progress:before {
848
+ .video-js.skin_news .vjs-play-progress:before {
900
849
  font-size: 1.2em;
901
850
  position: absolute;
902
851
  right: -0.5em;
903
852
  z-index: 1;
904
853
  }
905
- .video-js.skin_news_live button.vjs-skip-button>svg{
854
+ .video-js.skin_news button.vjs-skip-button>svg{
906
855
  height: 20px;
907
856
  }
908
- .video-js.skin_news_live button.vjs-big-play-button {
857
+ .video-js.skin_news button.vjs-big-play-button {
909
858
  width: 50px !important;
910
859
  height: 50px !important;
911
860
  font-size: 2.1rem !important;
@@ -915,17 +864,17 @@
915
864
  width: 24px;
916
865
  height: 24px;
917
866
  }
918
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
867
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
919
868
  margin: 0 12px 0 12px;
920
869
  }
921
- .video-js.skin_news_live .vjs-seek-to-live-text{
870
+ .video-js.skin_news .vjs-seek-to-live-text{
922
871
  font-size: 12px;
923
872
  }
924
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
873
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
925
874
  margin: 0 12px 0 12px;
926
875
  }
927
876
  }
928
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
877
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
929
878
  width: 90px;
930
879
  height: 90px;
931
880
  display: flex;
@@ -942,7 +891,7 @@
942
891
  line-height: 1.4em;
943
892
  }
944
893
 
945
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
894
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
946
895
  display: flex;
947
896
  justify-content: center;
948
897
  align-items: center;
@@ -950,22 +899,29 @@
950
899
  transition: width 0.1s;
951
900
  }
952
901
 
953
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
902
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
954
903
  display: flex;
955
904
  justify-content: center;
956
905
  align-items: center;
957
906
  height: 100%;
958
907
  transition: width 0.1s;
959
908
  }
960
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
909
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
961
910
  display: none !important;
962
911
  }
912
+ .video-js.skin_news .ssai-ad-container{
913
+ position: absolute;
914
+ bottom: 14px;
915
+ }
963
916
 
964
917
  @media (max-width: 576px) {
965
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
918
+ .video-js.skin_news .ssai-ad-container{
919
+ bottom: 2px;
920
+ }
921
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
966
922
  height: 5px !important;
967
923
  }
968
- .video-js.skin_news_live button.vjs-big-play-button {
924
+ .video-js.skin_news button.vjs-big-play-button {
969
925
  width: 50px !important;
970
926
  height: 50px !important;
971
927
  font-size: 2.1rem !important;
@@ -974,59 +930,70 @@
974
930
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
975
931
  display: none;
976
932
  }
977
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
933
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
978
934
  bottom: 2.4em !important;
979
935
  right: -1em;
980
936
  z-index: 1;
981
937
  }
982
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
938
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
983
939
  display: none !important;
984
940
  }
985
941
 
986
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
987
- color: white !important;
988
- font-size: 13px !important;
989
- background-color: black !important;
942
+ .video-js.skin_news .vjs-text-track-display-ttml span {
943
+ color: white;
944
+ font-size: 13px;
945
+ background-color: black;
990
946
  }
991
947
  }
992
948
 
993
- .video-js.skin_news_live .vjs-text-track-display-ttml {
994
- width: 100% !important;
995
- }
996
-
997
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
998
- color: white !important;
999
- font-size: 16px !important;
1000
- background-color: black !important;
949
+ .video-js.skin_news .vjs-text-track-display-ttml span {
950
+ color: white;
951
+ font-size: 16px;
952
+ background-color: black;
1001
953
  }
1002
954
 
1003
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
955
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1004
956
  margin-bottom: 2rem !important;
1005
957
  }
1006
958
 
1007
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
959
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1008
960
  font-size: 18px !important;
1009
961
  }
1010
962
 
1011
963
 
1012
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1013
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
964
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
965
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1014
966
  font-size: 1.2em !important;
1015
967
  line-height: 1.5em !important;
1016
968
  padding: 0.2em 0.8em !important;
1017
969
  }
1018
970
 
1019
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
971
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1020
972
  content: none !important;
1021
973
  fill: none !important;
1022
974
  filter: none !important;
1023
975
  }
1024
976
 
1025
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
977
+ /* svg icons opacity and hover effect */
978
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
979
+ opacity: 0.7 !important;
980
+ }
981
+
982
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
983
+ opacity: 1 !important;
984
+ }
985
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
986
+ opacity: 0.7 !important;
987
+ }
988
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
989
+ opacity: 1 !important;
990
+ }
991
+
992
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1026
993
  color: rgba(255, 255, 2555, 0.7)!important;
1027
994
  }
1028
995
 
1029
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
996
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1030
997
  color: rgba(255, 255, 2555, 1)!important;
1031
998
  }
1032
999
 
@@ -1229,808 +1196,841 @@
1229
1196
  }
1230
1197
 
1231
1198
 
1232
- .video-js.skin_cn_news .vjs-control-bar {
1233
- z-index: 1 !important;
1234
- height: auto !important;
1235
- padding: 0.8em 30px 0.6em;
1236
- background: transparent !important;
1199
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1200
+ font-size: 2.2em;
1201
+ line-height: 2.6;
1202
+ }
1203
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1204
+ background: #fcb700;
1205
+ }
1206
+ .video-js.skin_news_live .vjs-control-bar{
1207
+ z-index: 1 !important;
1208
+ height: 5em !important;
1209
+ background: black !important;
1210
+ }
1211
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1237
1212
  display: flex;
1238
- flex-wrap: wrap;
1239
1213
  align-items: center;
1240
- column-gap: 10px;
1214
+ justify-content: center;
1241
1215
  }
1242
1216
 
1217
+ .video-js.skin_news_live .vjs-fade>* {
1218
+ visibility: hidden !important;
1219
+ opacity: 0 !important;
1220
+ transition: visibility 1s, opacity 1s !important;
1221
+ }
1243
1222
 
1244
- .video-js.skin_cn_news .vjs-control-bar::before {
1245
- content: '';
1223
+ .video-js.skin_news_live .custom-spaced-progress-bar {
1246
1224
  position: absolute;
1247
- left: 0;
1248
- right: 0;
1249
- bottom: 0;
1250
- top: -3em;
1251
- background: linear-gradient(
1252
- to top,
1253
- rgba(0, 0, 0, 0.85) 0%,
1254
- rgba(0, 0, 0, 0.7) 40%,
1255
- rgba(0, 0, 0, 0.55) 70%,
1256
- rgba(0, 0, 0, 0.38) 86%,
1257
- transparent 100%
1258
- );
1259
- pointer-events: none;
1260
- z-index: -1;
1225
+ width: 100%;
1226
+ display: flex;
1227
+ height: 0.5em;
1228
+ top: -0.5em;
1261
1229
  }
1262
1230
 
1263
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1264
- order: -1;
1265
- flex: 0 0 100%;
1266
- width: 80%;
1267
- margin: 0 0 5em;
1231
+ .video-js.skin_news_live .vjs-progress-control {
1232
+ /* left: -6px; */
1268
1233
  position: relative;
1234
+ width: 100%;
1235
+ height: 0.5em;
1236
+ transition: height 0.1s, top 0.1s;
1269
1237
  }
1270
1238
 
1271
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1272
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1273
- width: auto;
1274
- min-width: 0;
1275
- }
1276
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1277
- display: inline-flex;
1278
- align-items: center;
1279
- justify-content: center;
1280
- height: 7em;
1281
- padding: 0 10px;
1282
- color: #fff;
1239
+ .video-js.skin_news_live .vjs-volume-panel{
1240
+ min-width: 5.3em;
1283
1241
  }
1284
1242
 
1285
- .video-js.skin_cn_news .vjs-svg-icon::before {
1286
- content: none !important;
1287
- }
1288
1243
 
1289
1244
 
1290
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1291
- display: inline-flex;
1292
- align-items: center;
1293
- justify-content: center;
1294
- }
1295
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1296
- .video-js.skin_cn_news .vjs-rewind-button svg {
1297
- width: 24px;
1298
- height: 24px;
1299
- display: block;
1245
+ .video-js.skin_news_live .vjs-custom-control-spacer {
1246
+ /* display: block; */
1247
+ /* flex: 1 1 auto; */
1300
1248
  }
1301
1249
 
1250
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1251
+ margin: 0 0px 0 0px;
1252
+ }
1253
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1254
+ display: none;
1255
+ }
1302
1256
 
1303
-
1304
- .video-js.skin_cn_news .vjs-subs-caps-button {
1305
- opacity: 1;
1257
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1258
+ font-size: 14px;
1259
+ font-weight: 500;
1260
+ align-self: center;
1261
+ height: min-content;
1262
+ padding: 5px 2px;
1263
+ border-radius: 8px;
1306
1264
  }
1307
1265
 
1266
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1267
+ height: 6px !important;
1268
+ }
1308
1269
 
1270
+ .video-js.skin_news_live .vjs-play-progress:before {
1271
+ font-size: 1.5em;
1272
+ line-height: unset;
1273
+ top: -0.3333333333em;
1274
+ }
1309
1275
 
1310
- .video-js.skin_cn_news .vjs-volume-panel {
1311
- margin: 0;
1312
- display: inline-flex;
1313
- align-items: center;
1314
- align-self: center;
1315
- height: 2.2em;
1316
- min-width: 7em;
1317
- transition: none;
1276
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1277
+ display: none !important;
1318
1278
  }
1319
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1320
- width: 0;
1321
- height: 100%;
1322
- display: flex;
1323
- align-items: center;
1324
- overflow: hidden;
1325
- opacity: 0;
1326
- transition: width 0.15s ease, opacity 0.15s ease;
1279
+
1280
+ /* */
1281
+ .video-js.skin_news_live .vjs-mouse-display{
1282
+ font-size: 1.6666666667em;
1327
1283
  }
1328
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1329
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1330
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1331
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1332
- width: 5em;
1333
- opacity: 1;
1284
+
1285
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1286
+ font-size: 1em !important;
1334
1287
  }
1335
1288
 
1336
- .video-js.skin_cn_news .vjs-volume-bar {
1337
- width: 4em;
1338
- height: 0.3em;
1339
- margin: 0 0.45em;
1289
+ .video-js.skin_news_live .vjs-button{
1290
+ width: 5.3em;
1291
+ display: flex;
1292
+ align-items: center;
1293
+ justify-content: center;
1340
1294
  }
1341
1295
 
1342
1296
 
1343
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1344
- display: none !important;
1297
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1298
+ .icon-maximize {
1299
+ display: block;
1300
+ height: 32px;
1345
1301
  }
1346
1302
 
1347
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1348
- width: 0 !important;
1303
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1304
+ line-height: 4;
1349
1305
  }
1350
1306
 
1351
-
1352
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1353
- display: block !important;
1354
- flex: 1 1 auto;
1307
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1308
+ .icon-minimize {
1309
+ display: none;
1310
+ height: 32px;
1355
1311
  }
1356
1312
 
1357
-
1358
- .video-js.skin_cn_news .vjs-big-play-button {
1359
- display: none;
1313
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1314
+ outline: none !important;
1315
+ /* flex: 1; */
1360
1316
  }
1361
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1362
- position: relative !important;
1317
+ .video-js.skin_news_live .vjs-play-toggle-container{
1363
1318
  display: flex;
1364
- left: 0;
1365
- top: -1px;
1319
+ flex: 1;
1320
+ justify-content: center;
1366
1321
  }
1367
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1322
+
1323
+
1324
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1325
+ .vjs-icon-fullscreen-enter:before {
1326
+ /* content: '' !important; */
1327
+ }
1328
+
1329
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1368
1330
  display: flex;
1369
1331
  justify-content: center;
1370
1332
  align-items: center;
1371
- position: absolute;
1372
- top: 0;
1373
- left: 0;
1374
- right: 0;
1375
- bottom: 0;
1376
- margin: auto;
1377
- width: 80px;
1378
- height: 80px;
1379
- border: none;
1380
- border-radius: 50%;
1381
- background: rgba(0, 0, 0, 0.55);
1382
- font-size: 5em;
1383
- line-height: 1.3em;
1384
- transform: none !important;
1333
+ /* transform: rotate(90deg); */
1385
1334
  }
1386
1335
 
1336
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1337
+ display: none;
1338
+ }
1339
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1340
+ margin-left: -10px;
1341
+ }
1387
1342
 
1388
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1389
- height: 4px !important;
1390
- margin: 0;
1391
- border-radius: 20px;
1392
- background-color: #393944;
1343
+ .video-js.skin_news_live .skipbtn:hover{
1344
+ cursor: pointer;
1393
1345
  }
1394
1346
 
1395
- .video-js.skin_cn_news .vjs-play-progress {
1396
- background-color: #ffffff;
1397
- border-radius: 20px;
1347
+ .video-js.skin_news_live .rewindbtn:hover{
1348
+ cursor: pointer;
1398
1349
  }
1399
1350
 
1400
- .video-js.skin_cn_news .vjs-load-progress,
1401
- .video-js.skin_cn_news .vjs-load-progress div {
1402
- background: rgba(255, 255, 255, 0.15);
1403
- border-radius: 20px;
1351
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1352
+ position: relative;
1353
+ padding-left: 0;
1404
1354
  }
1405
1355
 
1356
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1357
+ display: none !important;
1358
+ }
1406
1359
 
1407
- .video-js.skin_cn_news .vjs-play-progress:before {
1408
- content: '';
1409
- width: 16px;
1410
- height: 16px;
1411
- border-radius: 50%;
1412
- background: #ffffff;
1413
- border: 2px solid rgba(0, 0, 0, 0.6);
1414
- box-sizing: border-box;
1415
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1416
- top: -6px;
1417
- right: -8px;
1418
- position: absolute;
1360
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1361
+ /* width: 90px;
1362
+ height: 90px;
1363
+ display: flex;
1364
+ justify-content: center;
1365
+ align-items: center;
1366
+ border-radius: 50%;
1367
+ position: absolute;
1368
+ top: 0;
1369
+ left: 0;
1370
+ right: 0;
1371
+ bottom: 0;
1372
+ margin: auto;
1373
+ font-size: 6em;
1374
+ line-height: 1.4em;
1375
+ border: 0.05em solid;
1376
+ color: inherit; */
1377
+ display: none !important;
1419
1378
  }
1420
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1421
- display: none !important;
1379
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1380
+ font-weight: bold;
1422
1381
  }
1423
1382
 
1424
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1425
- background: #ffffff;
1426
- color: #0a0e17;
1427
- font-weight: 700;
1428
- border-radius: 3px;
1383
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1384
+ bottom: 2.4em !important;
1385
+ right: -1em;
1386
+ z-index: 1;
1429
1387
  }
1430
1388
 
1431
- .video-js.skin_cn_news .vjs-live-control {
1432
- display: none !important;
1389
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1390
+ width: 24px !important;
1391
+ height: 24px !important;
1433
1392
  }
1434
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1435
- display: inline-flex;
1436
- align-items: center;
1437
- align-self: center;
1438
- height: 2.2em;
1439
- gap: 5px;
1440
- width: auto;
1441
- padding: 0 10px;
1442
- border: 1px solid rgba(255, 255, 255, 0.45);
1443
- border-radius: 4px;
1393
+ .settings-selector-icon>svg{
1394
+ height: 19px !important;
1395
+ width: 19px !important;
1396
+ }
1397
+
1398
+
1399
+ .video-js.skin_news_live button.vjs-rewind-button{
1444
1400
  cursor: pointer;
1445
1401
  }
1446
1402
 
1447
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1403
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1404
+ padding-right: 0;
1448
1405
  display: none;
1449
1406
  }
1450
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1451
- display: inline-flex;
1452
- align-items: center;
1453
- }
1454
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1455
- content: '';
1456
- display: inline-block;
1457
- width: 8px;
1458
- height: 8px;
1459
- border-radius: 50%;
1460
- background: #ff2d2d; /* red live dot */
1407
+
1408
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1409
+ padding-left: 0;
1410
+ display: none;
1461
1411
  }
1462
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1463
- color: #ffffff;
1464
- font-weight: 700;
1465
- font-size: 12px;
1466
- letter-spacing: 0.03em;
1412
+
1413
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1414
+ padding-left: 0;
1415
+ padding-right: 0;
1416
+ display: none;
1467
1417
  }
1468
1418
 
1469
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1470
- border-color: transparent;
1419
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1420
+ display: none
1471
1421
  }
1472
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1473
- color: #ff2d2d;
1422
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1423
+ display: none
1474
1424
  }
1475
1425
 
1476
- /* ---- time controls ---- */
1477
- .video-js.skin_cn_news .vjs-current-time,
1478
- .video-js.skin_cn_news .vjs-duration,
1479
- .video-js.skin_cn_news .vjs-time-divider {
1480
- display: none !important;
1481
- }
1482
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1483
- display: none;
1426
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1427
+ display: flex;
1484
1428
  align-items: center;
1485
- justify-content: center;
1486
- font-size: 11px;
1487
1429
  font-weight: 700;
1488
- color: #fff;
1489
- padding: 0 6px;
1490
- user-select: none;
1430
+ font-size: 12px;
1431
+ min-width: 1.2em;
1491
1432
  }
1492
1433
 
1493
-
1494
- .video-js.skin_cn_news .vjs-chapter-marker {
1495
- z-index: 2;
1496
- width: var(--vl-chapter-size, 8px);
1497
- height: var(--vl-chapter-size, 8px);
1498
- top: 50%;
1499
- bottom: auto;
1500
- background: var(--vl-chapter-color, #ffffff);
1501
- opacity: var(--vl-chapter-opacity, 1);
1502
- border-radius: 50%;
1503
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1504
- transform: translate(-50%, -50%) scale(1);
1505
- transition: background-color 0.12s ease;
1506
- }
1507
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1508
- background: var(--vl-chapter-hover, #0a5cff);
1509
- }
1510
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1511
- background: var(--vl-chapter-active, #0a5cff);
1434
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1435
+ display: none;
1436
+ font-size: 11px;
1437
+ justify-content: center;
1438
+ align-items: center;
1439
+ user-select: none;
1512
1440
  }
1513
-
1514
-
1515
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1516
- width: 16px;
1517
- height: 16px;
1518
- bottom: 160%;
1519
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1441
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1442
+ display: none;
1520
1443
  }
1521
1444
 
1522
-
1523
- .video-js.skin_cn_news .vjs-chapter-preview {
1524
- background: var(--vl-chapter-tooltip, #0a5cff);
1525
- border-radius: 6px;
1526
- padding: 8px 10px;
1527
- width: max-content;
1528
- max-width: 300px;
1529
- text-align: left;
1530
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1531
- }
1532
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1533
- color: #ffffff;
1534
- font-size: 13px;
1535
- font-weight: 400;
1536
- margin-bottom: 2px;
1537
- }
1538
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1539
- color: #ffffff;
1540
- font-size: 13px;
1541
- font-weight: 400;
1542
- line-height: 1.3;
1543
- white-space: normal;
1544
- text-align: left;
1545
- }
1546
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1547
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1445
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1446
+ height: min-content;
1447
+ width: min-content;
1548
1448
  }
1549
-
1550
- /* ---- responsive ---- */
1551
- @media (max-width: 576px) {
1552
- .video-js.skin_cn_news .vjs-control-bar {
1553
- height: 3.2em !important;
1554
- padding: 0 8px;
1555
- }
1556
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1557
- padding: 0 6px;
1558
- }
1559
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1560
- display: none !important;
1561
- }
1449
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1450
+ width: 6em;
1562
1451
  }
1563
1452
 
1564
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1565
- font-size: 2.2em;
1566
- line-height: 2.6;
1567
- }
1568
- .video-js.skin_mini{
1569
- overflow: hidden;
1570
- }
1571
- .video-js.skin_mini .vjs-control-bar{
1572
- z-index: 1 !important;
1573
- height: 4em !important;
1574
- background: black !important;
1453
+ .video-js.skin_news_live .content{
1454
+ bottom: 3.4rem !important;
1455
+ right: -4rem !important;
1575
1456
  }
1576
1457
 
1577
- .video-js.skin_mini .vjs-fade>* {
1578
- visibility: hidden !important;
1579
- opacity: 0 !important;
1580
- transition: visibility 1s, opacity 1s !important;
1458
+ .setting-icon > svg{
1459
+ height:18px !important;
1581
1460
  }
1582
1461
 
1583
- .video-js.skin_mini .custom-spaced-progress-bar {
1462
+ .output-overlay{
1584
1463
  position: absolute;
1464
+ bottom: 0;
1465
+ height: 100%;
1585
1466
  width: 100%;
1586
- display: flex;
1587
- height: 0.5em;
1588
- top: -0.5em;
1467
+ z-index: 0;
1468
+ border: 0;
1469
+ pointer-events:none
1589
1470
  }
1590
1471
 
1591
- .video-js.skin_mini .vjs-progress-control {
1592
- /* left: -6px; */
1593
- position: relative;
1472
+ .video-js.skin_news_live iframe{
1594
1473
  width: 100%;
1595
- height: 0.5em;
1596
- transition: height 0.1s, top 0.1s;
1597
- }
1598
-
1599
-
1600
-
1601
-
1602
- .video-js.skin_mini .vjs-custom-control-spacer {
1603
- display: block;
1604
- flex: 1 1 auto;
1474
+ height: 100%;
1605
1475
  }
1606
1476
 
1607
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1608
- margin: 0 0px 0 0px;
1609
- }
1610
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1477
+ .video-js.skin_news_live .vjs-live-control{
1478
+ align-items: center;
1611
1479
  display: none;
1612
1480
  }
1613
-
1614
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1615
- font-size: 14px;
1616
- font-weight: 500;
1617
- align-self: center;
1618
- height: min-content;
1619
- padding: 5px 2px;
1620
- border-radius: 8px;
1481
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1482
+ height: 2.2em;
1483
+ display: flex;
1484
+ align-items: center;
1485
+ font-family: monospace;
1486
+ width: 4em;
1487
+ justify-content: center;
1488
+ background: red;
1489
+ margin: 4px 0px 4px 12px;
1621
1490
  }
1622
1491
 
1623
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1624
- height: 5px !important;
1492
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1493
+ text-shadow: none;
1625
1494
  }
1626
1495
 
1627
- .video-js.skin_mini .vjs-play-progress:before {
1628
- font-size: 1.3em;
1629
- line-height: unset;
1630
- top: -0.3333333333em;
1496
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1497
+ display: flex;
1498
+ justify-content: center;
1499
+ min-width: 5.3em;
1500
+ pointer-events: none;
1501
+ user-select: none;
1631
1502
  }
1632
1503
 
1633
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1634
- display: none !important;
1504
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1505
+ color: white;
1635
1506
  }
1636
1507
 
1637
- /* */
1638
- .video-js.skin_mini .vjs-mouse-display{
1639
- font-size: 1.6666666667em;
1640
- }
1641
1508
 
1642
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1643
- font-size: 1em !important;
1509
+ .settings-selection.vjs-control.vjs-button{
1510
+ display: flex !important;
1644
1511
  }
1645
1512
 
1646
- .video-js.skin_mini .vjs-button{
1647
- width: 3em;
1648
- display: flex;
1649
- align-items: center;
1650
- justify-content: center;
1513
+ @media(max-width:576px){
1514
+ .settings-selection.vjs-control.vjs-button{
1515
+ display: none !important;
1516
+ }
1651
1517
  }
1652
1518
 
1653
1519
 
1654
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1655
- .icon-maximize {
1656
- display: block;
1657
- height: 32px;
1658
- }
1520
+ @media(max-width:576px){
1521
+ .tvProviderImage{
1522
+ display: none
1523
+ }
1524
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1525
+ .icon-maximize {
1526
+ height: 30px !important;
1527
+ }
1659
1528
 
1660
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1661
- line-height: 4;
1662
- }
1529
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1530
+ .icon-minimize {
1531
+ height: 30px !important;
1532
+ }
1533
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1534
+ width: 4.5em;
1535
+ }
1536
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1537
+ height: min-content;
1538
+ }
1663
1539
 
1664
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1665
- .icon-minimize {
1540
+ .video-js.skin_news_live button.vjs-slowmo-button{
1666
1541
  display: none;
1667
- height: 32px;
1668
- }
1669
-
1670
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1671
- outline: none !important;
1542
+ }
1543
+ .video-js.skin_news_live button.vjs-rewind-button{
1544
+ display: none;
1545
+ }
1546
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1547
+ height: 20px;
1548
+ }
1549
+ .video-js.skin_news_live .vjs-button{
1550
+ width: 4.8em;
1551
+ }
1552
+ .video-js.skin_news_live .widget-selection{
1553
+ display: none;
1554
+ }
1555
+ .video-js.skin_news_live .container{
1556
+ display: none !important;
1557
+ }
1558
+ .video-js.skin_news_live .vjs-control-bar{
1559
+ height: 4em !important;
1560
+ }
1561
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1562
+ font-size: 2.5em;
1563
+ line-height: 1.5;
1564
+ }
1565
+ .video-js.skin_news_live .vjs-play-progress:before {
1566
+ font-size: 1.2em;
1567
+ position: absolute;
1568
+ right: -0.5em;
1569
+ z-index: 1;
1672
1570
  }
1673
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1674
- .vjs-icon-fullscreen-enter:before {
1675
- /* content: '' !important; */
1571
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1572
+ height: 20px;
1676
1573
  }
1677
-
1678
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1679
- display: flex;
1680
- justify-content: center;
1681
- align-items: center;
1682
- /* transform: rotate(90deg); */
1574
+ .video-js.skin_news_live button.vjs-big-play-button {
1575
+ width: 50px !important;
1576
+ height: 50px !important;
1577
+ font-size: 2.1rem !important;
1683
1578
  }
1684
1579
 
1685
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1686
- display: none;
1580
+ .stream-selector-icon>svg{
1581
+ width: 24px;
1582
+ height: 24px;
1687
1583
  }
1688
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1689
- margin-left: -10px;
1690
- display: none;
1691
- }
1692
-
1693
- .video-js.skin_mini .vjs-loading-spinner {
1694
- position: absolute;
1695
- top: 50%;
1696
- left: 50%;
1697
- transform: translate(-50%, -50%);
1698
- opacity: .85;
1699
- text-align: left;
1700
- border: .2em solid rgba(43, 51, 63, .7);
1701
- box-sizing: border-box;
1702
- background-clip: padding-box;
1703
- width: 3em;
1704
- height: 3em;
1705
- border-radius: 50%;
1706
- visibility: hidden;
1584
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1585
+ margin: 0 12px 0 12px;
1707
1586
  }
1708
-
1709
- .video-js.skin_mini .skipbtn:hover{
1710
- cursor: pointer;
1587
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1588
+ font-size: 12px;
1711
1589
  }
1712
-
1713
- .video-js.skin_mini .rewindbtn:hover{
1714
- cursor: pointer;
1590
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1591
+ margin: 0 12px 0 12px;
1715
1592
  }
1716
-
1717
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1718
- position: relative;
1719
- padding-left: 0;
1720
1593
  }
1721
-
1722
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1723
- width: 40px;
1724
- height: 40px;
1594
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1595
+ width: 90px;
1596
+ height: 90px;
1725
1597
  display: flex;
1726
1598
  justify-content: center;
1727
1599
  align-items: center;
1728
- border: none;
1600
+ border-radius: 50%;
1729
1601
  position: absolute;
1730
1602
  top: 0;
1731
1603
  left: 0;
1732
1604
  right: 0;
1733
1605
  bottom: 0;
1734
1606
  margin: auto;
1735
- font-size: 3em;
1736
- line-height: 1.3em;
1737
- transform: none !important;
1738
- border-radius: 1.3em;
1607
+ font-size: 6em;
1608
+ line-height: 1.4em;
1739
1609
  }
1740
1610
 
1741
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1742
- font-weight: bold;
1611
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1612
+ display: flex;
1613
+ justify-content: center;
1614
+ align-items: center;
1615
+ height: 100%;
1616
+ transition: width 0.1s;
1743
1617
  }
1744
1618
 
1745
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1746
- bottom: 1.1em !important;
1747
- right: 1em;
1748
- z-index: 1;
1749
- font-size: 10px;
1619
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1620
+ display: flex;
1621
+ justify-content: center;
1622
+ align-items: center;
1623
+ height: 100%;
1624
+ transition: width 0.1s;
1625
+ }
1626
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1627
+ display: none !important;
1750
1628
  }
1751
1629
 
1752
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1753
- width: 24px !important;
1754
- height: 24px !important;
1630
+ @media (max-width: 576px) {
1631
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1632
+ height: 5px !important;
1633
+ }
1634
+ .video-js.skin_news_live button.vjs-big-play-button {
1635
+ width: 50px !important;
1636
+ height: 50px !important;
1637
+ font-size: 2.1rem !important;
1638
+ }
1639
+
1640
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1641
+ display: none;
1642
+ }
1643
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1644
+ bottom: 2.4em !important;
1645
+ right: -1em;
1646
+ z-index: 1;
1755
1647
  }
1756
- .video-js.skin_mini .settings-selector-icon>svg{
1757
- height: 19px !important;
1758
- width: 19px !important;
1648
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1649
+ display: none !important;
1650
+ }
1651
+
1652
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1653
+ color: white !important;
1654
+ font-size: 13px !important;
1655
+ background-color: black !important;
1656
+ }
1759
1657
  }
1760
1658
 
1659
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1660
+ width: 100% !important;
1661
+ }
1761
1662
 
1762
- .video-js.skin_mini button.vjs-rewind-button{
1763
- cursor: pointer;
1663
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1664
+ color: white !important;
1665
+ font-size: 16px !important;
1666
+ background-color: black !important;
1764
1667
  }
1765
1668
 
1766
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1767
- padding-right: 0;
1669
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1670
+ margin-bottom: 2rem !important;
1768
1671
  }
1769
1672
 
1770
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1771
- padding-left: 0;
1673
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
1674
+ font-size: 18px !important;
1772
1675
  }
1773
1676
 
1774
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1775
- padding-left: 0;
1776
- padding-right: 0;
1777
- display: flex;
1778
- justify-content: center;
1779
- width: min-content;
1677
+
1678
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1679
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1680
+ font-size: 1.2em !important;
1681
+ line-height: 1.5em !important;
1682
+ padding: 0.2em 0.8em !important;
1780
1683
  }
1781
1684
 
1782
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1783
- display: none
1685
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1686
+ content: none !important;
1687
+ fill: none !important;
1688
+ filter: none !important;
1784
1689
  }
1785
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1786
- display: none
1690
+
1691
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1692
+ color: rgba(255, 255, 2555, 0.7)!important;
1787
1693
  }
1788
1694
 
1789
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1790
- display: flex;
1791
- align-items: center;
1792
- font-weight: 700;
1793
- font-size: 9px;
1794
- min-width: 0.8em;
1795
- padding-left: 0;
1695
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1696
+ color: rgba(255, 255, 2555, 1)!important;
1796
1697
  }
1797
1698
 
1798
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1799
- display: none;
1800
- font-size: 11px;
1801
- justify-content: center;
1699
+
1700
+
1701
+
1702
+
1703
+ .video-js.skin_cn_news .vjs-control-bar {
1704
+ z-index: 1 !important;
1705
+ height: auto !important;
1706
+ padding: 0.8em 30px 0.6em;
1707
+ background: transparent !important;
1708
+ display: flex;
1709
+ flex-wrap: wrap;
1802
1710
  align-items: center;
1803
- user-select: none;
1804
- }
1805
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1806
- display: none;
1711
+ column-gap: 10px;
1807
1712
  }
1808
1713
 
1809
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1810
- height: min-content;
1811
- width: min-content;
1714
+
1715
+ .video-js.skin_cn_news .vjs-control-bar::before {
1716
+ content: '';
1717
+ position: absolute;
1718
+ left: 0;
1719
+ right: 0;
1720
+ bottom: 0;
1721
+ top: -3em;
1722
+ background: linear-gradient(
1723
+ to top,
1724
+ rgba(0, 0, 0, 0.85) 0%,
1725
+ rgba(0, 0, 0, 0.7) 40%,
1726
+ rgba(0, 0, 0, 0.55) 70%,
1727
+ rgba(0, 0, 0, 0.38) 86%,
1728
+ transparent 100%
1729
+ );
1730
+ pointer-events: none;
1731
+ z-index: -1;
1812
1732
  }
1813
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1814
- width: 3em;
1815
- margin-right: 4px;
1733
+
1734
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1735
+ order: -1;
1736
+ flex: 0 0 100%;
1737
+ width: 80%;
1738
+ margin: 0 0 5em;
1739
+ position: relative;
1816
1740
  }
1817
1741
 
1818
- .video-js.skin_mini .content{
1819
- bottom: 3.4rem !important;
1820
- right: -4rem !important;
1742
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1743
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1744
+ width: auto;
1745
+ min-width: 0;
1746
+ }
1747
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1748
+ display: inline-flex;
1749
+ align-items: center;
1750
+ justify-content: center;
1751
+ height: 7em;
1752
+ padding: 0 10px;
1753
+ color: #fff;
1821
1754
  }
1822
1755
 
1823
- .video-js.skin_mini .setting-icon > svg{
1824
- height:18px !important;
1756
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1757
+ content: none !important;
1825
1758
  }
1826
1759
 
1827
- .output-overlay{
1828
- position: absolute;
1829
- bottom: 0;
1830
- height: 100%;
1831
- width: 100%;
1832
- z-index: 0;
1833
- border: 0;
1834
- pointer-events:none
1760
+
1761
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1762
+ display: inline-flex;
1763
+ align-items: center;
1764
+ justify-content: center;
1765
+ }
1766
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1767
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1768
+ width: 24px;
1769
+ height: 24px;
1770
+ display: block;
1835
1771
  }
1836
1772
 
1837
- .video-js.skin_mini iframe{
1838
- width: 100%;
1839
- height: 100%;
1773
+
1774
+
1775
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1776
+ opacity: 1;
1840
1777
  }
1841
1778
 
1842
- .video-js.skin_mini .vjs-live-control{
1779
+
1780
+
1781
+ .video-js.skin_cn_news .vjs-volume-panel {
1782
+ margin: 0;
1783
+ display: inline-flex;
1843
1784
  align-items: center;
1844
- max-width: 5em;
1845
- }
1846
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1785
+ align-self: center;
1847
1786
  height: 2.2em;
1787
+ min-width: 7em;
1788
+ transition: none;
1789
+ }
1790
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1791
+ width: 0;
1792
+ height: 100%;
1848
1793
  display: flex;
1849
1794
  align-items: center;
1850
- font-family: monospace;
1795
+ overflow: hidden;
1796
+ opacity: 0;
1797
+ transition: width 0.15s ease, opacity 0.15s ease;
1798
+ }
1799
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1800
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1801
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1802
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1803
+ width: 5em;
1804
+ opacity: 1;
1805
+ }
1806
+
1807
+ .video-js.skin_cn_news .vjs-volume-bar {
1851
1808
  width: 4em;
1852
- justify-content: center;
1853
- background: red;
1854
- margin: 4px 0px 4px 2px;
1809
+ height: 0.3em;
1810
+ margin: 0 0.45em;
1855
1811
  }
1856
1812
 
1857
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1858
- text-shadow: none;
1813
+
1814
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1815
+ display: none !important;
1859
1816
  }
1860
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1861
- display: none;
1862
- font-size: 12px;
1817
+
1818
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1819
+ width: 0 !important;
1863
1820
  }
1864
1821
 
1865
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1866
- height: 1.8em;
1867
- display: inline-flex;
1868
- align-items: center;
1869
- font-family: monospace;
1822
+
1823
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1824
+ display: block !important;
1825
+ flex: 1 1 auto;
1826
+ }
1827
+
1828
+
1829
+ .video-js.skin_cn_news .vjs-big-play-button {
1830
+ display: none;
1831
+ }
1832
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1833
+ position: relative !important;
1834
+ display: flex;
1835
+ left: 0;
1836
+ top: -1px;
1837
+ }
1838
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1839
+ display: flex;
1870
1840
  justify-content: center;
1871
- border: 1.5px solid;
1872
- margin: 4px 0px 4px 2px;
1873
- white-space: pre;
1874
- padding: 2px 4px;
1875
- font-size: 1.2em;
1876
- font-weight: 500;
1877
- color: rgba(255, 255, 2555, 0.7);
1841
+ align-items: center;
1842
+ position: absolute;
1843
+ top: 0;
1844
+ left: 0;
1845
+ right: 0;
1846
+ bottom: 0;
1847
+ margin: auto;
1848
+ width: 80px;
1849
+ height: 80px;
1850
+ border: none;
1851
+ border-radius: 50%;
1852
+ background: rgba(0, 0, 0, 0.55);
1853
+ font-size: 5em;
1854
+ line-height: 1.3em;
1855
+ transform: none !important;
1878
1856
  }
1879
1857
 
1880
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1881
- content: "NOT LIVE";
1882
- word-spacing: -4px;
1858
+
1859
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1860
+ height: 4px !important;
1861
+ margin: 0;
1862
+ border-radius: 20px;
1863
+ background-color: #393944;
1883
1864
  }
1884
1865
 
1866
+ .video-js.skin_cn_news .vjs-play-progress {
1867
+ background-color: #ffffff;
1868
+ border-radius: 20px;
1869
+ }
1885
1870
 
1886
- @media(max-width:600px){
1887
- .tvProviderImage{
1888
- display: none
1889
- }
1890
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1891
- .icon-maximize {
1892
- height: 30px !important;
1893
- }
1871
+ .video-js.skin_cn_news .vjs-load-progress,
1872
+ .video-js.skin_cn_news .vjs-load-progress div {
1873
+ background: rgba(255, 255, 255, 0.15);
1874
+ border-radius: 20px;
1875
+ }
1894
1876
 
1895
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1896
- .icon-minimize {
1897
- height: 30px !important;
1898
- }
1899
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1900
- width: 3.5em;
1901
- }
1902
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1903
- height: min-content;
1904
- }
1905
1877
 
1906
- .video-js.skin_mini button.vjs-slowmo-button{
1907
- display: none;
1908
- }
1909
- .video-js.skin_mini button.vjs-rewind-button{
1910
- display: none;
1911
- }
1912
- .video-js.skin_mini button.vjs-rewind-button>svg{
1913
- height: 20px;
1914
- }
1915
- .video-js.skin_mini .vjs-button{
1916
- width: 3em;
1917
- }
1918
- .video-js.skin_mini .widget-selection{
1919
- display: none;
1920
- }
1921
- .video-js.skin_mini .container{
1922
- display: none !important;
1923
- }
1924
- .video-js.skin_mini .vjs-control-bar{
1925
- height: 4em !important;
1926
- }
1927
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1928
- font-size: 2.5em;
1929
- line-height: 1.5;
1930
- }
1931
- .video-js.skin_mini .vjs-play-progress:before {
1932
- font-size: 1.2em;
1933
- position: absolute;
1934
- right: -0.5em;
1935
- z-index: 1;
1878
+ .video-js.skin_cn_news .vjs-play-progress:before {
1879
+ content: '';
1880
+ width: 16px;
1881
+ height: 16px;
1882
+ border-radius: 50%;
1883
+ background: #ffffff;
1884
+ border: 2px solid rgba(0, 0, 0, 0.6);
1885
+ box-sizing: border-box;
1886
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1887
+ top: -6px;
1888
+ right: -8px;
1889
+ position: absolute;
1936
1890
  }
1937
- .video-js.skin_mini button.vjs-skip-button>svg{
1938
- height: 20px;
1891
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1892
+ display: none !important;
1939
1893
  }
1940
1894
 
1941
- .stream-selector-icon>svg{
1942
- width: 24px;
1943
- height: 24px;
1895
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1896
+ background: #ffffff;
1897
+ color: #0a0e17;
1898
+ font-weight: 700;
1899
+ border-radius: 3px;
1900
+ }
1901
+
1902
+ .video-js.skin_cn_news .vjs-live-control {
1903
+ display: none !important;
1904
+ }
1905
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1906
+ display: inline-flex;
1907
+ align-items: center;
1908
+ align-self: center;
1909
+ height: 2.2em;
1910
+ gap: 5px;
1911
+ width: auto;
1912
+ padding: 0 10px;
1913
+ border: 1px solid rgba(255, 255, 255, 0.45);
1914
+ border-radius: 4px;
1915
+ cursor: pointer;
1916
+ }
1917
+
1918
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1919
+ display: none;
1920
+ }
1921
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1922
+ display: inline-flex;
1923
+ align-items: center;
1924
+ }
1925
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1926
+ content: '';
1927
+ display: inline-block;
1928
+ width: 8px;
1929
+ height: 8px;
1930
+ border-radius: 50%;
1931
+ background: #ff2d2d; /* red live dot */
1944
1932
  }
1945
- .video-js.skin_mini .vjs-seek-to-live-text{
1933
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1934
+ color: #ffffff;
1935
+ font-weight: 700;
1946
1936
  font-size: 12px;
1937
+ letter-spacing: 0.03em;
1947
1938
  }
1948
1939
 
1949
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1950
- color: white !important;
1951
- font-size: 16px !important;
1952
- background-color: rgba(0,0,0,0.2) !important;
1953
- }
1940
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1941
+ border-color: transparent;
1954
1942
  }
1955
-
1956
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1957
- color: white !important;
1958
- font-size: 16px !important;
1959
- background-color: rgba(0,0,0,0.2) !important;
1943
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1944
+ color: #ff2d2d;
1960
1945
  }
1961
1946
 
1962
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1963
- font-size: 18px !important;
1947
+ /* ---- time controls ---- */
1948
+ .video-js.skin_cn_news .vjs-current-time,
1949
+ .video-js.skin_cn_news .vjs-duration,
1950
+ .video-js.skin_cn_news .vjs-time-divider {
1951
+ display: none !important;
1964
1952
  }
1965
-
1966
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1967
- margin-bottom: 1rem !important;
1953
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1954
+ display: none;
1955
+ align-items: center;
1956
+ justify-content: center;
1957
+ font-size: 11px;
1958
+ font-weight: 700;
1959
+ color: #fff;
1960
+ padding: 0 6px;
1961
+ user-select: none;
1968
1962
  }
1969
1963
 
1970
1964
 
1971
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1972
- display: flex;
1973
- justify-content: center;
1974
- align-items: center;
1975
- height: 100%;
1976
- transition: width 0.1s;
1977
- }
1978
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1979
- margin: 2px;
1965
+ .video-js.skin_cn_news .vjs-chapter-marker {
1966
+ z-index: 2;
1967
+ width: var(--vl-chapter-size, 8px);
1968
+ height: var(--vl-chapter-size, 8px);
1969
+ top: 50%;
1970
+ bottom: auto;
1971
+ background: var(--vl-chapter-color, #ffffff);
1972
+ opacity: var(--vl-chapter-opacity, 1);
1973
+ border-radius: 50%;
1974
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1975
+ transform: translate(-50%, -50%) scale(1);
1976
+ transition: background-color 0.12s ease;
1980
1977
  }
1981
-
1982
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1983
- display: flex;
1984
- justify-content: center;
1985
- align-items: center;
1986
- height: 100%;
1987
- transition: width 0.1s;
1978
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1979
+ background: var(--vl-chapter-hover, #0a5cff);
1988
1980
  }
1989
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1990
- display: grid;
1991
- font-size: 10px;
1992
- grid-template-columns: 1fr;
1993
- grid-template-rows: 1fr;
1994
- padding: 1px 0px 0 0px;
1995
- margin: 0;
1981
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1982
+ background: var(--vl-chapter-active, #0a5cff);
1996
1983
  }
1997
1984
 
1998
- @media (max-width: 600px) {
1999
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
2000
- height: 5px !important;
2001
- }
2002
-
2003
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2004
- display: none;
2005
- }
2006
1985
 
1986
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1987
+ width: 16px;
1988
+ height: 16px;
1989
+ bottom: 160%;
1990
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
2007
1991
  }
2008
1992
 
2009
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2010
- content: none !important;
2011
- fill: none !important;
2012
- filter: none !important;
2013
- }
2014
1993
 
2015
- /* svg icons opacity and hover effect */
2016
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2017
- opacity: 0.7 !important;
1994
+ .video-js.skin_cn_news .vjs-chapter-preview {
1995
+ background: var(--vl-chapter-tooltip, #0a5cff);
1996
+ border-radius: 6px;
1997
+ padding: 8px 10px;
1998
+ width: max-content;
1999
+ max-width: 300px;
2000
+ text-align: left;
2001
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2018
2002
  }
2019
-
2020
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2021
- opacity: 1 !important;
2003
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2004
+ color: #ffffff;
2005
+ font-size: 13px;
2006
+ font-weight: 400;
2007
+ margin-bottom: 2px;
2022
2008
  }
2023
-
2024
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2025
- color: rgba(255, 255, 2555, 0.7)!important;
2009
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2010
+ color: #ffffff;
2011
+ font-size: 13px;
2012
+ font-weight: 400;
2013
+ line-height: 1.3;
2014
+ white-space: normal;
2015
+ text-align: left;
2026
2016
  }
2027
-
2028
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2029
- color: rgba(255, 255, 2555, 1)!important;
2017
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2018
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2030
2019
  }
2031
2020
 
2032
-
2033
-
2021
+ /* ---- responsive ---- */
2022
+ @media (max-width: 576px) {
2023
+ .video-js.skin_cn_news .vjs-control-bar {
2024
+ height: 3.2em !important;
2025
+ padding: 0 8px;
2026
+ }
2027
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2028
+ padding: 0 6px;
2029
+ }
2030
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2031
+ display: none !important;
2032
+ }
2033
+ }
2034
2034
 
2035
2035
  /* CSS for videojs-dvr-seekbar */
2036
2036
 
@@ -2293,7 +2293,6 @@
2293
2293
 
2294
2294
 
2295
2295
 
2296
-
2297
2296
  .vjs-custom-big-mute.vjs-control{
2298
2297
  position: absolute;
2299
2298
  align-items: center;
@@ -2343,6 +2342,7 @@
2343
2342
  }
2344
2343
 
2345
2344
 
2345
+
2346
2346
  /* nextep — up-next card (centered in player, scales with player size) */
2347
2347
  .video-js:has(.next-ep-preview),
2348
2348
  .video-js:has(.next-ep-preview-player-thumb) {
@@ -2625,6 +2625,38 @@
2625
2625
  z-index: 30 !important;
2626
2626
  }
2627
2627
 
2628
+ /* a wrapper element that tracks the mouse vertically */
2629
+ .vjs-thumbnail-holder {
2630
+ position: absolute;
2631
+ left: -1000px;
2632
+ }
2633
+
2634
+ /* the thumbnail image itself */
2635
+ .vjs-thumbnail {
2636
+ position: absolute;
2637
+ left: 0;
2638
+ bottom: 1.3em;
2639
+ opacity: 0;
2640
+ transition: opacity .2s ease;
2641
+ -webkit-transition: opacity .2s ease;
2642
+ -moz-transition: opacity .2s ease;
2643
+ -mz-transition: opacity .2s ease;
2644
+ }
2645
+
2646
+ /* fade in the thumbnail when hovering over the progress bar */
2647
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2648
+ .vjs-progress-control:hover .vjs-thumbnail,
2649
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2650
+ .vjs-progress-control:active .vjs-thumbnail {
2651
+ opacity: 1;
2652
+ }
2653
+
2654
+ /* ... but hide the thumbnail when hovering directly over it */
2655
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2656
+ .vjs-progress-control:active .vjs-thumbnail:active {
2657
+ opacity: 0;
2658
+ }
2659
+
2628
2660
  .video-js.vjs-quality-menu {
2629
2661
  display: block;
2630
2662
  }
@@ -2695,38 +2727,6 @@
2695
2727
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2696
2728
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2697
2729
  }
2698
- /* a wrapper element that tracks the mouse vertically */
2699
- .vjs-thumbnail-holder {
2700
- position: absolute;
2701
- left: -1000px;
2702
- }
2703
-
2704
- /* the thumbnail image itself */
2705
- .vjs-thumbnail {
2706
- position: absolute;
2707
- left: 0;
2708
- bottom: 1.3em;
2709
- opacity: 0;
2710
- transition: opacity .2s ease;
2711
- -webkit-transition: opacity .2s ease;
2712
- -moz-transition: opacity .2s ease;
2713
- -mz-transition: opacity .2s ease;
2714
- }
2715
-
2716
- /* fade in the thumbnail when hovering over the progress bar */
2717
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2718
- .vjs-progress-control:hover .vjs-thumbnail,
2719
- .vjs-progress-control.fake-active .vjs-thumbnail,
2720
- .vjs-progress-control:active .vjs-thumbnail {
2721
- opacity: 1;
2722
- }
2723
-
2724
- /* ... but hide the thumbnail when hovering directly over it */
2725
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2726
- .vjs-progress-control:active .vjs-thumbnail:active {
2727
- opacity: 0;
2728
- }
2729
-
2730
2730
  .vjs-poster {
2731
2731
  display: inline-block;
2732
2732
  vertical-align: middle;
@@ -2753,9 +2753,115 @@
2753
2753
  .video-js .vjs-loading-spinner{
2754
2754
  margin: 0 !important;
2755
2755
  }
2756
- .vjs-text-track-display-ttml{
2757
- inset: -30px 7px -40px 0.222222px !important;
2758
- margin: unset !important;
2756
+
2757
+ .video-js .vjs-text-track-display,
2758
+ .video-js .vjs-text-track-display-ttml {
2759
+ top: 0 !important;
2760
+ left: 0 !important;
2761
+ right: 0 !important;
2762
+ bottom: 0 !important;
2763
+ margin: 0 !important;
2764
+ transform: translateY(calc(-1 * var(--vlp-caption-bottom, 4em))) !important;
2765
+ transition: transform 0.2s ease;
2766
+ }
2767
+ .video-js.skin_vlone { --vlp-caption-bottom: 4em; }
2768
+ .video-js.skin_mini { --vlp-caption-bottom: 4.2em; }
2769
+ .video-js.skin_news,
2770
+ .video-js.skin_news_live { --vlp-caption-bottom: 5.2em; }
2771
+ .video-js.skin_defaultv2 { --vlp-caption-bottom: 6.2em; }
2772
+
2773
+ .video-js.vjs-controls-disabled .vjs-text-track-display,
2774
+ .video-js.vjs-controls-disabled .vjs-text-track-display-ttml,
2775
+ .video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display,
2776
+ .video-js.vjs-user-inactive.vjs-playing .vjs-text-track-display-ttml {
2777
+ transform: translateY(0) !important;
2778
+ }
2779
+
2780
+ .video-js .vjs-text-track-settings select {
2781
+ box-sizing: border-box;
2782
+ padding-right: 1.4em;
2783
+ }
2784
+
2785
+ .video-js .vjs-text-track-settings fieldset span > select {
2786
+ max-width: none;
2787
+ }
2788
+
2789
+ .vjs-layout-small .vjs-text-track-settings.vjs-modal-dialog,
2790
+ .vjs-layout-x-small .vjs-text-track-settings.vjs-modal-dialog,
2791
+ .vjs-layout-tiny .vjs-text-track-settings.vjs-modal-dialog {
2792
+ height: 100%;
2793
+ }
2794
+
2795
+ .vjs-layout-small .vjs-text-track-settings .vjs-modal-dialog-content,
2796
+ .vjs-layout-x-small .vjs-text-track-settings .vjs-modal-dialog-content,
2797
+ .vjs-layout-tiny .vjs-text-track-settings .vjs-modal-dialog-content {
2798
+ display: flex !important;
2799
+ flex-direction: column;
2800
+ padding: 10px 12px 0;
2801
+ font-size: 1em;
2802
+ line-height: 1.3;
2803
+ }
2804
+
2805
+ .vjs-layout-small .vjs-text-track-settings fieldset,
2806
+ .vjs-layout-x-small .vjs-text-track-settings fieldset,
2807
+ .vjs-layout-tiny .vjs-text-track-settings fieldset {
2808
+ margin: 0 0 8px;
2809
+ padding: 0;
2810
+ }
2811
+
2812
+ .vjs-layout-small .vjs-text-track-settings legend,
2813
+ .vjs-layout-x-small .vjs-text-track-settings legend,
2814
+ .vjs-layout-tiny .vjs-text-track-settings legend {
2815
+ font-size: 1em;
2816
+ margin-bottom: 3px;
2817
+ }
2818
+
2819
+ /* Stack each label + select on its own full-width row. */
2820
+ .vjs-layout-small .vjs-text-track-settings fieldset span,
2821
+ .vjs-layout-x-small .vjs-text-track-settings fieldset span,
2822
+ .vjs-layout-tiny .vjs-text-track-settings fieldset span {
2823
+ display: block;
2824
+ padding: 0;
2825
+ }
2826
+
2827
+ .vjs-layout-small .vjs-text-track-settings .vjs-label,
2828
+ .vjs-layout-x-small .vjs-text-track-settings .vjs-label,
2829
+ .vjs-layout-tiny .vjs-text-track-settings .vjs-label {
2830
+ display: block;
2831
+ margin: 0 0 2px;
2832
+ font-size: 0.85em;
2833
+ opacity: 0.85;
2834
+ }
2835
+
2836
+ .vjs-layout-small .vjs-text-track-settings select,
2837
+ .vjs-layout-x-small .vjs-text-track-settings select,
2838
+ .vjs-layout-tiny .vjs-text-track-settings select {
2839
+ width: 100%;
2840
+ max-width: 100%;
2841
+ box-sizing: border-box;
2842
+ margin: 0 0 8px;
2843
+ padding: 6px 1.6em 6px 8px;
2844
+ }
2845
+
2846
+ /* Keep Reset/Done visible while the options scroll. */
2847
+ .vjs-layout-small .vjs-text-track-settings .vjs-track-settings-controls,
2848
+ .vjs-layout-x-small .vjs-text-track-settings .vjs-track-settings-controls,
2849
+ .vjs-layout-tiny .vjs-text-track-settings .vjs-track-settings-controls {
2850
+ position: sticky;
2851
+ bottom: 0;
2852
+ display: flex;
2853
+ gap: 8px;
2854
+ margin: auto 0 0;
2855
+ padding: 8px 0;
2856
+ background: rgba(0, 0, 0, 0.85);
2857
+ }
2858
+
2859
+ .vjs-layout-small .vjs-text-track-settings .vjs-track-settings-controls button,
2860
+ .vjs-layout-x-small .vjs-text-track-settings .vjs-track-settings-controls button,
2861
+ .vjs-layout-tiny .vjs-text-track-settings .vjs-track-settings-controls button {
2862
+ flex: 1;
2863
+ margin: 0;
2864
+ padding: 8px 10px;
2759
2865
  }
2760
2866
 
2761
2867