@viewlift/player-backup 2.0.320-backup → 2.0.322-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 (69) hide show
  1. package/cjs/{autoNextVideo-ca715a41.js → autoNextVideo-e243e37b.js} +1 -1
  2. package/cjs/bundle.css +1180 -1173
  3. package/cjs/{features-e920c4e9.js → features-db5508ee.js} +1 -1
  4. package/cjs/generic-54cf8a68.js +1 -0
  5. package/cjs/{index-b577b357.js → index-01027798.js} +1 -1
  6. package/cjs/{index-affd9caa.js → index-7872810d.js} +1 -1
  7. package/cjs/{index-898ba288.js → index-9b471ea5.js} +1 -1
  8. package/cjs/index.js +1 -1
  9. package/cjs/{multicamv2-17d752cc.js → multicamv2-75d62bc6.js} +1 -1
  10. package/cjs/{multicamv2-65808cf7.js → multicamv2-eb1ae109.js} +1 -1
  11. package/cjs/{nextEpisodeButton-2f04e004.js → nextEpisodeButton-a0a60ba4.js} +1 -1
  12. package/cjs/{playlist-58e572c0.js → playlist-3ecdee1e.js} +1 -1
  13. package/cjs/{series-c58a6c6f.js → series-ea8c865c.js} +1 -1
  14. package/cjs/{series-v2-457385b1.js → series-v2-3268a9e4.js} +1 -1
  15. package/cjs/{series-v2-762ade64.js → series-v2-9dd40100.js} +1 -1
  16. package/cjs/{settings-icon-0642c8ef.js → settings-icon-8bb0d3f0.js} +1 -1
  17. package/cjs/{skin-e3f248c6.js → skin-183b653f.js} +1 -1
  18. package/cjs/{skin-b881b80d.js → skin-2e66860e.js} +1 -1
  19. package/cjs/{skin-6a6fec08.js → skin-3d504b6f.js} +1 -1
  20. package/cjs/{skin-36659174.js → skin-49c25f7b.js} +1 -1
  21. package/cjs/{skin-7aee85e0.js → skin-671692b8.js} +1 -1
  22. package/cjs/{skin-416dc669.js → skin-723fa423.js} +1 -1
  23. package/cjs/{skin-16cc2c73.js → skin-9aa305cd.js} +1 -1
  24. package/cjs/skin-b5f248db.js +1 -0
  25. package/cjs/{skin-df6c8b5b.js → skin-b8d3d8eb.js} +1 -1
  26. package/cjs/{skin-1413893e.js → skin-ede3604c.js} +1 -1
  27. package/cjs/{videoSelector-44900c10.js → videoSelector-698da66d.js} +1 -1
  28. package/cjs/{videoSelector-177c5d6d.js → videoSelector-ee9b1382.js} +1 -1
  29. package/esm/{autoNextVideo-070b47e9.js → autoNextVideo-b094b4eb.js} +1 -1
  30. package/esm/bundle.css +1180 -1173
  31. package/esm/{caption-settings-8dfcb482.js → caption-settings-567b8533.js} +1 -1
  32. package/esm/{captions-75f20905.js → captions-15915fce.js} +1 -1
  33. package/esm/components/chapters/bootstrap.d.ts +2 -0
  34. package/esm/components/chapters/index.d.ts +3 -2
  35. package/esm/{features-142fb2a3.js → features-d1c0969b.js} +1 -1
  36. package/esm/generic-279952e4.js +1 -0
  37. package/esm/{index-4c4d82a4.js → index-76ed817b.js} +1 -1
  38. package/esm/{index-68d17b76.js → index-7814cd08.js} +1 -1
  39. package/esm/{index-ec92c082.js → index-85c4eeac.js} +1 -1
  40. package/esm/{index-a7d88a02.js → index-9064019b.js} +1 -1
  41. package/esm/index.js +1 -1
  42. package/esm/{multicamv2-1a919151.js → multicamv2-68192e76.js} +1 -1
  43. package/esm/{multicamv2-dc4c3ca7.js → multicamv2-bdfc13c0.js} +1 -1
  44. package/esm/{nextEpisodeButton-1bfe9778.js → nextEpisodeButton-a1b670a6.js} +1 -1
  45. package/esm/{playlist-53382f9d.js → playlist-cab0eaa2.js} +1 -1
  46. package/esm/{series-55f25ac9.js → series-ffaee63d.js} +1 -1
  47. package/esm/{series-v2-89bd16a9.js → series-v2-5717bfa3.js} +1 -1
  48. package/esm/series-v2-e27f4583.js +1 -0
  49. package/esm/{skin-c3ab4896.js → skin-020af4ff.js} +1 -1
  50. package/esm/{skin-c05ea037.js → skin-120caa60.js} +1 -1
  51. package/esm/{skin-2e1e2e39.js → skin-2c35d22d.js} +1 -1
  52. package/esm/{skin-ac169314.js → skin-2d147bae.js} +1 -1
  53. package/esm/{skin-3ac892c2.js → skin-3c5e5bca.js} +1 -1
  54. package/esm/{skin-e7a16490.js → skin-80480af1.js} +1 -1
  55. package/esm/{skin-f7727d96.js → skin-85e53acf.js} +1 -1
  56. package/esm/skin-961379a6.js +1 -0
  57. package/esm/{skin-7a0f7892.js → skin-c27a730c.js} +1 -1
  58. package/esm/{skin-35bf023d.js → skin-f685cb99.js} +1 -1
  59. package/esm/{videoSelector-bf83edc6.js → videoSelector-89ff2577.js} +1 -1
  60. package/esm/videoSelector-a3f01f77.js +1 -0
  61. package/package.json +1 -1
  62. package/cjs/generic-608c48d5.js +0 -1
  63. package/cjs/index-bcf78aa5.js +0 -1
  64. package/cjs/skin-0bba8c8a.js +0 -1
  65. package/esm/generic-4ccca0df.js +0 -1
  66. package/esm/index-d710db2e.js +0 -1
  67. package/esm/series-v2-c3ca0844.js +0 -1
  68. package/esm/skin-f19837f3.js +0 -1
  69. package/esm/videoSelector-b4a19b1c.js +0 -1
package/cjs/bundle.css CHANGED
@@ -1,534 +1,398 @@
1
1
 
2
2
 
3
3
 
4
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
5
- font-size: 2.2em;
6
- line-height: 2.6;
7
- }
8
- .video-js.skin_mini{
9
- overflow: hidden;
10
- }
11
- .video-js.skin_mini .vjs-control-bar{
12
- z-index: 1 !important;
13
- height: 4em !important;
14
- background: black !important;
15
- }
16
-
17
- .video-js.skin_mini .vjs-fade>* {
18
- visibility: hidden !important;
19
- opacity: 0 !important;
20
- transition: visibility 1s, opacity 1s !important;
21
- }
22
-
23
- .video-js.skin_mini .custom-spaced-progress-bar {
24
- position: absolute;
25
- width: 100%;
26
- display: flex;
27
- height: 0.5em;
28
- top: -0.5em;
29
- }
30
-
31
- .video-js.skin_mini .vjs-progress-control {
32
- /* left: -6px; */
33
- position: relative;
34
- width: 100%;
35
- height: 0.5em;
36
- transition: height 0.1s, top 0.1s;
37
- }
38
4
 
39
5
 
40
6
 
41
7
 
42
- .video-js.skin_mini .vjs-custom-control-spacer {
43
- display: block;
44
- flex: 1 1 auto;
8
+ .video-js.skin_cn_news .vjs-control-bar {
9
+ z-index: 1 !important;
10
+ height: auto !important;
11
+ padding: 0.8em 30px 0.6em;
12
+ background: transparent !important;
13
+ display: flex;
14
+ flex-wrap: wrap;
15
+ align-items: center;
16
+ column-gap: 10px;
45
17
  }
46
18
 
47
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
48
- margin: 0 0px 0 0px;
49
- }
50
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
51
- display: none;
52
- }
53
19
 
54
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
55
- font-size: 14px;
56
- font-weight: 500;
57
- align-self: center;
58
- height: min-content;
59
- padding: 5px 2px;
60
- border-radius: 8px;
20
+ .video-js.skin_cn_news .vjs-control-bar::before {
21
+ content: '';
22
+ position: absolute;
23
+ left: 0;
24
+ right: 0;
25
+ bottom: 0;
26
+ top: -3em;
27
+ background: linear-gradient(
28
+ to top,
29
+ rgba(0, 0, 0, 0.85) 0%,
30
+ rgba(0, 0, 0, 0.7) 40%,
31
+ rgba(0, 0, 0, 0.55) 70%,
32
+ rgba(0, 0, 0, 0.38) 86%,
33
+ transparent 100%
34
+ );
35
+ pointer-events: none;
36
+ z-index: -1;
61
37
  }
62
38
 
63
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
64
- height: 5px !important;
39
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
40
+ order: -1;
41
+ flex: 0 0 100%;
42
+ width: 80%;
43
+ margin: 0 0 5em;
44
+ position: relative;
65
45
  }
66
46
 
67
- .video-js.skin_mini .vjs-play-progress:before {
68
- font-size: 1.3em;
69
- line-height: unset;
70
- top: -0.3333333333em;
47
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
48
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
49
+ width: auto;
50
+ min-width: 0;
71
51
  }
72
-
73
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
74
- display: none !important;
52
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
53
+ display: inline-flex;
54
+ align-items: center;
55
+ justify-content: center;
56
+ height: 7em;
57
+ padding: 0 10px;
58
+ color: #fff;
75
59
  }
76
60
 
77
- /* */
78
- .video-js.skin_mini .vjs-mouse-display{
79
- font-size: 1.6666666667em;
61
+ .video-js.skin_cn_news .vjs-svg-icon::before {
62
+ content: none !important;
80
63
  }
81
64
 
82
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
83
- font-size: 1em !important;
84
- }
85
65
 
86
- .video-js.skin_mini .vjs-button{
87
- width: 3em;
88
- display: flex;
66
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
67
+ display: inline-flex;
89
68
  align-items: center;
90
69
  justify-content: center;
91
70
  }
71
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
72
+ .video-js.skin_cn_news .vjs-rewind-button svg {
73
+ width: 24px;
74
+ height: 24px;
75
+ display: block;
76
+ }
92
77
 
93
78
 
94
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
95
- .icon-maximize {
96
- display: block;
97
- height: 32px;
98
- }
99
79
 
100
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
101
- line-height: 4;
80
+ .video-js.skin_cn_news .vjs-subs-caps-button {
81
+ opacity: 1;
102
82
  }
103
83
 
104
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
105
- .icon-minimize {
106
- display: none;
107
- height: 32px;
108
- }
109
84
 
110
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
111
- outline: none !important;
112
- }
113
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
114
- .vjs-icon-fullscreen-enter:before {
115
- /* content: '' !important; */
116
- }
117
85
 
118
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
119
- display: flex;
120
- justify-content: center;
86
+ .video-js.skin_cn_news .vjs-volume-panel {
87
+ margin: 0;
88
+ display: inline-flex;
121
89
  align-items: center;
122
- /* transform: rotate(90deg); */
90
+ align-self: center;
91
+ height: 2.2em;
92
+ min-width: 7em;
93
+ transition: none;
123
94
  }
124
-
125
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
126
- display: none;
95
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
96
+ width: 0;
97
+ height: 100%;
98
+ display: flex;
99
+ align-items: center;
100
+ overflow: hidden;
101
+ opacity: 0;
102
+ transition: width 0.15s ease, opacity 0.15s ease;
127
103
  }
128
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
129
- margin-left: -10px;
130
- display: none;
104
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
105
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
106
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
107
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
108
+ width: 5em;
109
+ opacity: 1;
131
110
  }
132
111
 
133
- .video-js.skin_mini .vjs-loading-spinner {
134
- position: absolute;
135
- top: 50%;
136
- left: 50%;
137
- transform: translate(-50%, -50%);
138
- opacity: .85;
139
- text-align: left;
140
- border: .2em solid rgba(43, 51, 63, .7);
141
- box-sizing: border-box;
142
- background-clip: padding-box;
143
- width: 3em;
144
- height: 3em;
145
- border-radius: 50%;
146
- visibility: hidden;
112
+ .video-js.skin_cn_news .vjs-volume-bar {
113
+ width: 4em;
114
+ height: 0.3em;
115
+ margin: 0 0.45em;
147
116
  }
148
117
 
149
- .video-js.skin_mini .skipbtn:hover{
150
- cursor: pointer;
118
+
119
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
120
+ display: none !important;
151
121
  }
152
122
 
153
- .video-js.skin_mini .rewindbtn:hover{
154
- cursor: pointer;
123
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
124
+ width: 0 !important;
155
125
  }
156
126
 
157
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
158
- position: relative;
159
- padding-left: 0;
127
+
128
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
129
+ display: block !important;
130
+ flex: 1 1 auto;
160
131
  }
161
132
 
162
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
163
- width: 40px;
164
- height: 40px;
133
+
134
+ .video-js.skin_cn_news .vjs-big-play-button {
135
+ display: none;
136
+ }
137
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
138
+ position: relative !important;
139
+ display: flex;
140
+ left: 0;
141
+ top: -1px;
142
+ }
143
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
165
144
  display: flex;
166
145
  justify-content: center;
167
146
  align-items: center;
168
- border: none;
169
147
  position: absolute;
170
148
  top: 0;
171
149
  left: 0;
172
150
  right: 0;
173
151
  bottom: 0;
174
152
  margin: auto;
175
- font-size: 3em;
153
+ width: 80px;
154
+ height: 80px;
155
+ border: none;
156
+ border-radius: 50%;
157
+ background: rgba(0, 0, 0, 0.55);
158
+ font-size: 5em;
176
159
  line-height: 1.3em;
177
160
  transform: none !important;
178
- border-radius: 1.3em;
179
161
  }
180
162
 
181
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
182
- font-weight: bold;
183
- }
184
163
 
185
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
186
- bottom: 1.1em !important;
187
- right: 1em;
188
- z-index: 1;
189
- font-size: 10px;
164
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
165
+ height: 4px !important;
166
+ margin: 0;
167
+ border-radius: 20px;
168
+ background-color: #393944;
190
169
  }
191
170
 
192
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
193
- width: 24px !important;
194
- height: 24px !important;
195
- }
196
- .video-js.skin_mini .settings-selector-icon>svg{
197
- height: 19px !important;
198
- width: 19px !important;
171
+ .video-js.skin_cn_news .vjs-play-progress {
172
+ background-color: #ffffff;
173
+ border-radius: 20px;
199
174
  }
200
175
 
201
-
202
- .video-js.skin_mini button.vjs-rewind-button{
203
- cursor: pointer;
176
+ .video-js.skin_cn_news .vjs-load-progress,
177
+ .video-js.skin_cn_news .vjs-load-progress div {
178
+ background: rgba(255, 255, 255, 0.15);
179
+ border-radius: 20px;
204
180
  }
205
181
 
206
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
207
- padding-right: 0;
182
+
183
+ .video-js.skin_cn_news .vjs-play-progress:before {
184
+ content: '';
185
+ width: 16px;
186
+ height: 16px;
187
+ border-radius: 50%;
188
+ background: #ffffff;
189
+ border: 2px solid rgba(0, 0, 0, 0.6);
190
+ box-sizing: border-box;
191
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
192
+ top: -6px;
193
+ right: -8px;
194
+ position: absolute;
195
+ }
196
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
197
+ display: none !important;
208
198
  }
209
199
 
210
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
211
- padding-left: 0;
200
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
201
+ background: #ffffff;
202
+ color: #0a0e17;
203
+ font-weight: 700;
204
+ border-radius: 3px;
212
205
  }
213
206
 
214
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
215
- padding-left: 0;
216
- padding-right: 0;
217
- display: flex;
218
- justify-content: center;
219
- width: min-content;
207
+ .video-js.skin_cn_news .vjs-live-control {
208
+ display: none !important;
209
+ }
210
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
211
+ display: inline-flex;
212
+ align-items: center;
213
+ align-self: center;
214
+ height: 2.2em;
215
+ gap: 5px;
216
+ width: auto;
217
+ padding: 0 10px;
218
+ border: 1px solid rgba(255, 255, 255, 0.45);
219
+ border-radius: 4px;
220
+ cursor: pointer;
220
221
  }
221
222
 
222
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
223
- display: none
223
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
224
+ display: none;
224
225
  }
225
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
226
- display: none
226
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
227
+ display: inline-flex;
228
+ align-items: center;
229
+ }
230
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
231
+ content: '';
232
+ display: inline-block;
233
+ width: 8px;
234
+ height: 8px;
235
+ border-radius: 50%;
236
+ background: #ff2d2d; /* red live dot */
237
+ }
238
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
239
+ color: #ffffff;
240
+ font-weight: 700;
241
+ font-size: 12px;
242
+ letter-spacing: 0.03em;
227
243
  }
228
244
 
229
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
230
- display: flex;
231
- align-items: center;
232
- font-weight: 700;
233
- font-size: 9px;
234
- min-width: 0.8em;
235
- padding-left: 0;
245
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
246
+ border-color: transparent;
247
+ }
248
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
249
+ color: #ff2d2d;
236
250
  }
237
251
 
238
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
239
- display: none;
240
- font-size: 11px;
241
- justify-content: center;
252
+ /* ---- time controls ---- */
253
+ .video-js.skin_cn_news .vjs-current-time,
254
+ .video-js.skin_cn_news .vjs-duration,
255
+ .video-js.skin_cn_news .vjs-time-divider {
256
+ display: none !important;
257
+ }
258
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
259
+ display: none;
242
260
  align-items: center;
261
+ justify-content: center;
262
+ font-size: 11px;
263
+ font-weight: 700;
264
+ color: #fff;
265
+ padding: 0 6px;
243
266
  user-select: none;
244
267
  }
245
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
246
- display: none;
247
- }
248
268
 
249
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
250
- height: min-content;
251
- width: min-content;
269
+
270
+ .video-js.skin_cn_news .vjs-chapter-marker {
271
+ z-index: 2;
272
+ width: var(--vl-chapter-size, 8px);
273
+ height: var(--vl-chapter-size, 8px);
274
+ top: 50%;
275
+ bottom: auto;
276
+ background: var(--vl-chapter-color, #ffffff);
277
+ opacity: var(--vl-chapter-opacity, 1);
278
+ border-radius: 50%;
279
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
280
+ transform: translate(-50%, -50%) scale(1);
281
+ transition: background-color 0.12s ease;
252
282
  }
253
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
254
- width: 3em;
255
- margin-right: 4px;
283
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
284
+ background: var(--vl-chapter-hover, #0a5cff);
256
285
  }
257
-
258
- .video-js.skin_mini .content{
259
- bottom: 3.4rem !important;
260
- right: -4rem !important;
286
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
287
+ background: var(--vl-chapter-active, #0a5cff);
261
288
  }
262
289
 
263
- .video-js.skin_mini .setting-icon > svg{
264
- height:18px !important;
290
+
291
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
292
+ width: 16px;
293
+ height: 16px;
294
+ bottom: 160%;
295
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
265
296
  }
266
297
 
267
- .output-overlay{
268
- position: absolute;
269
- bottom: 0;
270
- height: 100%;
271
- width: 100%;
272
- z-index: 0;
273
- border: 0;
274
- pointer-events:none
298
+
299
+ .video-js.skin_cn_news .vjs-chapter-preview {
300
+ background: var(--vl-chapter-tooltip, #0a5cff);
301
+ border-radius: 6px;
302
+ padding: 8px 10px;
303
+ width: max-content;
304
+ max-width: 300px;
305
+ text-align: left;
306
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
307
+ }
308
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
309
+ color: #ffffff;
310
+ font-size: 13px;
311
+ font-weight: 400;
312
+ margin-bottom: 2px;
313
+ }
314
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
315
+ color: #ffffff;
316
+ font-size: 13px;
317
+ font-weight: 400;
318
+ line-height: 1.3;
319
+ white-space: normal;
320
+ text-align: left;
321
+ }
322
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
323
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
275
324
  }
276
325
 
277
- .video-js.skin_mini iframe{
278
- width: 100%;
279
- height: 100%;
326
+ /* ---- responsive ---- */
327
+ @media (max-width: 576px) {
328
+ .video-js.skin_cn_news .vjs-control-bar {
329
+ height: 3.2em !important;
330
+ padding: 0 8px;
331
+ }
332
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
333
+ padding: 0 6px;
334
+ }
335
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
336
+ display: none !important;
337
+ }
280
338
  }
281
339
 
282
- .video-js.skin_mini .vjs-live-control{
283
- align-items: center;
284
- max-width: 5em;
340
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
341
+ font-size: 2.2em;
342
+ line-height: 2.6;
285
343
  }
286
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
287
- height: 2.2em;
344
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
345
+ background: white;
346
+ }
347
+ .video-js.skin_news .vjs-control-bar{
348
+ z-index: 1 !important;
349
+ height: 5em !important;
350
+ background: black !important;
351
+ }
352
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
288
353
  display: flex;
289
354
  align-items: center;
290
- font-family: monospace;
291
- width: 4em;
292
355
  justify-content: center;
293
- background: red;
294
- margin: 4px 0px 4px 2px;
295
356
  }
296
357
 
297
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
298
- text-shadow: none;
299
- }
300
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
301
- display: none;
302
- font-size: 12px;
358
+ .video-js.skin_news .vjs-fade>* {
359
+ visibility: hidden !important;
360
+ opacity: 0 !important;
361
+ transition: visibility 1s, opacity 1s !important;
303
362
  }
304
363
 
305
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
306
- height: 1.8em;
307
- display: inline-flex;
308
- align-items: center;
309
- font-family: monospace;
310
- justify-content: center;
311
- border: 1.5px solid;
312
- margin: 4px 0px 4px 2px;
313
- white-space: pre;
314
- padding: 2px 4px;
315
- font-size: 1.2em;
316
- font-weight: 500;
317
- color: rgba(255, 255, 2555, 0.7);
364
+ .video-js.skin_news .custom-spaced-progress-bar {
365
+ position: absolute;
366
+ width: 100%;
367
+ display: flex;
368
+ height: 0.5em;
369
+ top: -0.5em;
318
370
  }
319
371
 
320
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
321
- content: "NOT LIVE";
322
- word-spacing: -4px;
372
+ .video-js.skin_news .vjs-progress-control {
373
+ /* left: -6px; */
374
+ position: relative;
375
+ width: 100%;
376
+ height: 0.5em;
377
+ transition: height 0.1s, top 0.1s;
323
378
  }
324
379
 
325
380
 
326
- @media(max-width:600px){
327
- .tvProviderImage{
328
- display: none
329
- }
330
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
331
- .icon-maximize {
332
- height: 30px !important;
333
- }
334
381
 
335
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
336
- .icon-minimize {
337
- height: 30px !important;
338
- }
339
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
340
- width: 3.5em;
341
- }
342
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
343
- height: min-content;
344
- }
345
-
346
- .video-js.skin_mini button.vjs-slowmo-button{
347
- display: none;
348
- }
349
- .video-js.skin_mini button.vjs-rewind-button{
350
- display: none;
351
- }
352
- .video-js.skin_mini button.vjs-rewind-button>svg{
353
- height: 20px;
354
- }
355
- .video-js.skin_mini .vjs-button{
356
- width: 3em;
357
- }
358
- .video-js.skin_mini .widget-selection{
359
- display: none;
360
- }
361
- .video-js.skin_mini .container{
362
- display: none !important;
363
- }
364
- .video-js.skin_mini .vjs-control-bar{
365
- height: 4em !important;
366
- }
367
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
368
- font-size: 2.5em;
369
- line-height: 1.5;
370
- }
371
- .video-js.skin_mini .vjs-play-progress:before {
372
- font-size: 1.2em;
373
- position: absolute;
374
- right: -0.5em;
375
- z-index: 1;
376
- }
377
- .video-js.skin_mini button.vjs-skip-button>svg{
378
- height: 20px;
379
- }
380
-
381
- .stream-selector-icon>svg{
382
- width: 24px;
383
- height: 24px;
384
- }
385
- .video-js.skin_mini .vjs-seek-to-live-text{
386
- font-size: 12px;
387
- }
388
-
389
- .video-js.skin_mini .vjs-text-track-display-ttml span {
390
- color: white !important;
391
- font-size: 16px !important;
392
- background-color: rgba(0,0,0,0.2) !important;
393
- }
394
- }
395
-
396
- .video-js.skin_mini .vjs-text-track-display-ttml span {
397
- color: white !important;
398
- font-size: 16px !important;
399
- background-color: rgba(0,0,0,0.2) !important;
400
- }
401
-
402
- .video-js.skin_mini .vjs-text-track-display-ttml p {
403
- font-size: 18px !important;
404
- }
405
-
406
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
407
- margin-bottom: 1rem !important;
408
- }
409
-
410
-
411
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
412
- display: flex;
413
- justify-content: center;
414
- align-items: center;
415
- height: 100%;
416
- transition: width 0.1s;
417
- }
418
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
419
- margin: 2px;
420
- }
421
-
422
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
423
- display: flex;
424
- justify-content: center;
425
- align-items: center;
426
- height: 100%;
427
- transition: width 0.1s;
428
- }
429
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
430
- display: grid;
431
- font-size: 10px;
432
- grid-template-columns: 1fr;
433
- grid-template-rows: 1fr;
434
- padding: 1px 0px 0 0px;
435
- margin: 0;
436
- }
437
-
438
- @media (max-width: 600px) {
439
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
440
- height: 5px !important;
441
- }
442
-
443
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
444
- display: none;
445
- }
446
-
447
- }
448
-
449
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
450
- content: none !important;
451
- fill: none !important;
452
- filter: none !important;
453
- }
454
-
455
- /* svg icons opacity and hover effect */
456
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
457
- opacity: 0.7 !important;
458
- }
459
-
460
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
461
- opacity: 1 !important;
462
- }
463
-
464
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
465
- color: rgba(255, 255, 2555, 0.7)!important;
466
- }
467
-
468
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
469
- color: rgba(255, 255, 2555, 1)!important;
470
- }
471
-
472
-
473
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
474
- font-size: 2.2em;
475
- line-height: 2.6;
476
- }
477
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
478
- background: #fcb700;
479
- }
480
- .video-js.skin_news_live .vjs-control-bar{
481
- z-index: 1 !important;
482
- height: 5em !important;
483
- background: black !important;
484
- }
485
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
486
- display: flex;
487
- align-items: center;
488
- justify-content: center;
489
- }
490
-
491
- .video-js.skin_news_live .vjs-fade>* {
492
- visibility: hidden !important;
493
- opacity: 0 !important;
494
- transition: visibility 1s, opacity 1s !important;
495
- }
496
382
 
497
- .video-js.skin_news_live .custom-spaced-progress-bar {
498
- position: absolute;
499
- width: 100%;
500
- display: flex;
501
- height: 0.5em;
502
- top: -0.5em;
503
- }
504
-
505
- .video-js.skin_news_live .vjs-progress-control {
506
- /* left: -6px; */
507
- position: relative;
508
- width: 100%;
509
- height: 0.5em;
510
- transition: height 0.1s, top 0.1s;
511
- }
512
-
513
- .video-js.skin_news_live .vjs-volume-panel{
514
- min-width: 5.3em;
515
- }
516
-
517
-
518
-
519
- .video-js.skin_news_live .vjs-custom-control-spacer {
520
- /* display: block; */
521
- /* flex: 1 1 auto; */
383
+ .video-js.skin_news .vjs-custom-control-spacer {
384
+ display: block;
385
+ flex: 1 1 auto;
522
386
  }
523
387
 
524
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
388
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
525
389
  margin: 0 0px 0 0px;
526
390
  }
527
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
391
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
528
392
  display: none;
529
393
  }
530
394
 
531
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
395
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
532
396
  font-size: 14px;
533
397
  font-weight: 500;
534
398
  align-self: center;
@@ -537,30 +401,30 @@
537
401
  border-radius: 8px;
538
402
  }
539
403
 
540
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
404
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
541
405
  height: 6px !important;
542
406
  }
543
407
 
544
- .video-js.skin_news_live .vjs-play-progress:before {
408
+ .video-js.skin_news .vjs-play-progress:before {
545
409
  font-size: 1.5em;
546
410
  line-height: unset;
547
411
  top: -0.3333333333em;
548
412
  }
549
413
 
550
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
414
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
551
415
  display: none !important;
552
416
  }
553
417
 
554
418
  /* */
555
- .video-js.skin_news_live .vjs-mouse-display{
419
+ .video-js.skin_news .vjs-mouse-display{
556
420
  font-size: 1.6666666667em;
557
421
  }
558
422
 
559
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
423
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
560
424
  font-size: 1em !important;
561
425
  }
562
426
 
563
- .video-js.skin_news_live .vjs-button{
427
+ .video-js.skin_news .vjs-button{
564
428
  width: 5.3em;
565
429
  display: flex;
566
430
  align-items: center;
@@ -568,71 +432,63 @@
568
432
  }
569
433
 
570
434
 
571
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
435
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
572
436
  .icon-maximize {
573
437
  display: block;
574
438
  height: 32px;
575
439
  }
576
440
 
577
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
441
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
578
442
  line-height: 4;
579
443
  }
580
444
 
581
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
445
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
582
446
  .icon-minimize {
583
447
  display: none;
584
448
  height: 32px;
585
449
  }
586
450
 
587
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
451
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
588
452
  outline: none !important;
589
- /* flex: 1; */
590
- }
591
- .video-js.skin_news_live .vjs-play-toggle-container{
592
- display: flex;
593
- flex: 1;
594
- justify-content: center;
595
453
  }
596
-
597
-
598
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
454
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
599
455
  .vjs-icon-fullscreen-enter:before {
600
456
  /* content: '' !important; */
601
457
  }
602
458
 
603
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
459
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
604
460
  display: flex;
605
461
  justify-content: center;
606
462
  align-items: center;
607
463
  /* transform: rotate(90deg); */
608
464
  }
609
465
 
610
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
466
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
611
467
  display: none;
612
468
  }
613
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
469
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
614
470
  margin-left: -10px;
615
471
  }
616
472
 
617
- .video-js.skin_news_live .skipbtn:hover{
473
+ .video-js.skin_news .skipbtn:hover{
618
474
  cursor: pointer;
619
475
  }
620
476
 
621
- .video-js.skin_news_live .rewindbtn:hover{
477
+ .video-js.skin_news .rewindbtn:hover{
622
478
  cursor: pointer;
623
479
  }
624
480
 
625
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
481
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
626
482
  position: relative;
627
483
  padding-left: 0;
628
484
  }
629
485
 
630
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
486
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
631
487
  display: none !important;
632
488
  }
633
489
 
634
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
635
- /* width: 90px;
490
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
491
+ width: 90px;
636
492
  height: 90px;
637
493
  display: flex;
638
494
  justify-content: center;
@@ -647,20 +503,19 @@
647
503
  font-size: 6em;
648
504
  line-height: 1.4em;
649
505
  border: 0.05em solid;
650
- color: inherit; */
651
- display: none !important;
506
+ color: inherit;
652
507
  }
653
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
508
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
654
509
  font-weight: bold;
655
510
  }
656
511
 
657
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
512
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
658
513
  bottom: 2.4em !important;
659
514
  right: -1em;
660
515
  z-index: 1;
661
516
  }
662
517
 
663
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
518
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
664
519
  width: 24px !important;
665
520
  height: 24px !important;
666
521
  }
@@ -670,34 +525,34 @@
670
525
  }
671
526
 
672
527
 
673
- .video-js.skin_news_live button.vjs-rewind-button{
528
+ .video-js.skin_news button.vjs-rewind-button{
674
529
  cursor: pointer;
675
530
  }
676
531
 
677
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
532
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
678
533
  padding-right: 0;
679
- display: none;
680
534
  }
681
535
 
682
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
536
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
683
537
  padding-left: 0;
684
- display: none;
685
538
  }
686
539
 
687
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
540
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
688
541
  padding-left: 0;
689
542
  padding-right: 0;
690
- display: none;
543
+ display: flex;
544
+ justify-content: center;
545
+ width: min-content;
691
546
  }
692
547
 
693
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
548
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
694
549
  display: none
695
550
  }
696
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
551
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
697
552
  display: none
698
553
  }
699
554
 
700
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
555
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
701
556
  display: flex;
702
557
  align-items: center;
703
558
  font-weight: 700;
@@ -705,26 +560,26 @@
705
560
  min-width: 1.2em;
706
561
  }
707
562
 
708
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
563
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
709
564
  display: none;
710
565
  font-size: 11px;
711
566
  justify-content: center;
712
567
  align-items: center;
713
568
  user-select: none;
714
569
  }
715
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
570
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
716
571
  display: none;
717
572
  }
718
573
 
719
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
574
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
720
575
  height: min-content;
721
576
  width: min-content;
722
577
  }
723
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
578
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
724
579
  width: 6em;
725
580
  }
726
581
 
727
- .video-js.skin_news_live .content{
582
+ .video-js.skin_news .content{
728
583
  bottom: 3.4rem !important;
729
584
  right: -4rem !important;
730
585
  }
@@ -743,16 +598,15 @@
743
598
  pointer-events:none
744
599
  }
745
600
 
746
- .video-js.skin_news_live iframe{
601
+ .video-js.skin_news iframe{
747
602
  width: 100%;
748
603
  height: 100%;
749
604
  }
750
605
 
751
- .video-js.skin_news_live .vjs-live-control{
606
+ .video-js.skin_news .vjs-live-control{
752
607
  align-items: center;
753
- display: none;
754
608
  }
755
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
609
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
756
610
  height: 2.2em;
757
611
  display: flex;
758
612
  align-items: center;
@@ -763,22 +617,43 @@
763
617
  margin: 4px 0px 4px 12px;
764
618
  }
765
619
 
766
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
620
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
767
621
  text-shadow: none;
768
622
  }
623
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
624
+ display: none;
625
+ font-size: 12px;
626
+ }
769
627
 
770
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
771
- display: flex;
628
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
629
+ height: 2.2em;
630
+ display: inline-flex;
631
+ align-items: center;
632
+ /* font-family: monospace; */
772
633
  justify-content: center;
773
- min-width: 5.3em;
774
- pointer-events: none;
775
- user-select: none;
634
+ border: 2px solid;
635
+ margin: 4px 0px 4px 6px;
636
+ white-space: pre;
637
+ padding: 0px 6px;
638
+ font-size: 1.2em;
639
+ font-weight: 500;
640
+ color: rgba(255, 255, 2555, 0.7);
641
+
642
+ letter-spacing: -.1px;
643
+ line-height: normal;
644
+ text-transform: uppercase;
645
+ color: #FFFFFF;
646
+ opacity: .7;
647
+ font-family: "Proxima Nova";
776
648
  }
777
649
 
778
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
779
- color: white;
650
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
651
+ opacity: 1;
780
652
  }
781
653
 
654
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
655
+ content: "NOT LIVE";
656
+ }
782
657
 
783
658
  .settings-selection.vjs-control.vjs-button{
784
659
  display: flex !important;
@@ -795,57 +670,57 @@
795
670
  .tvProviderImage{
796
671
  display: none
797
672
  }
798
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
673
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
799
674
  .icon-maximize {
800
675
  height: 30px !important;
801
676
  }
802
677
 
803
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
678
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
804
679
  .icon-minimize {
805
680
  height: 30px !important;
806
681
  }
807
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
682
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
808
683
  width: 4.5em;
809
684
  }
810
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
685
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
811
686
  height: min-content;
812
687
  }
813
688
 
814
- .video-js.skin_news_live button.vjs-slowmo-button{
689
+ .video-js.skin_news button.vjs-slowmo-button{
815
690
  display: none;
816
691
  }
817
- .video-js.skin_news_live button.vjs-rewind-button{
692
+ .video-js.skin_news button.vjs-rewind-button{
818
693
  display: none;
819
694
  }
820
- .video-js.skin_news_live button.vjs-rewind-button>svg{
695
+ .video-js.skin_news button.vjs-rewind-button>svg{
821
696
  height: 20px;
822
697
  }
823
- .video-js.skin_news_live .vjs-button{
698
+ .video-js.skin_news .vjs-button{
824
699
  width: 4.8em;
825
700
  }
826
- .video-js.skin_news_live .widget-selection{
701
+ .video-js.skin_news .widget-selection{
827
702
  display: none;
828
703
  }
829
- .video-js.skin_news_live .container{
704
+ .video-js.skin_news .container{
830
705
  display: none !important;
831
706
  }
832
- .video-js.skin_news_live .vjs-control-bar{
707
+ .video-js.skin_news .vjs-control-bar{
833
708
  height: 4em !important;
834
709
  }
835
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
710
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
836
711
  font-size: 2.5em;
837
712
  line-height: 1.5;
838
713
  }
839
- .video-js.skin_news_live .vjs-play-progress:before {
714
+ .video-js.skin_news .vjs-play-progress:before {
840
715
  font-size: 1.2em;
841
716
  position: absolute;
842
717
  right: -0.5em;
843
718
  z-index: 1;
844
719
  }
845
- .video-js.skin_news_live button.vjs-skip-button>svg{
720
+ .video-js.skin_news button.vjs-skip-button>svg{
846
721
  height: 20px;
847
722
  }
848
- .video-js.skin_news_live button.vjs-big-play-button {
723
+ .video-js.skin_news button.vjs-big-play-button {
849
724
  width: 50px !important;
850
725
  height: 50px !important;
851
726
  font-size: 2.1rem !important;
@@ -855,17 +730,17 @@
855
730
  width: 24px;
856
731
  height: 24px;
857
732
  }
858
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
733
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
859
734
  margin: 0 12px 0 12px;
860
735
  }
861
- .video-js.skin_news_live .vjs-seek-to-live-text{
736
+ .video-js.skin_news .vjs-seek-to-live-text{
862
737
  font-size: 12px;
863
738
  }
864
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
739
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
865
740
  margin: 0 12px 0 12px;
866
741
  }
867
742
  }
868
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
743
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
869
744
  width: 90px;
870
745
  height: 90px;
871
746
  display: flex;
@@ -882,7 +757,7 @@
882
757
  line-height: 1.4em;
883
758
  }
884
759
 
885
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
760
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
886
761
  display: flex;
887
762
  justify-content: center;
888
763
  align-items: center;
@@ -890,22 +765,29 @@
890
765
  transition: width 0.1s;
891
766
  }
892
767
 
893
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
768
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
894
769
  display: flex;
895
770
  justify-content: center;
896
771
  align-items: center;
897
772
  height: 100%;
898
773
  transition: width 0.1s;
899
774
  }
900
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
775
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
901
776
  display: none !important;
902
777
  }
778
+ .video-js.skin_news .ssai-ad-container{
779
+ position: absolute;
780
+ bottom: 14px;
781
+ }
903
782
 
904
783
  @media (max-width: 576px) {
905
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
784
+ .video-js.skin_news .ssai-ad-container{
785
+ bottom: 2px;
786
+ }
787
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
906
788
  height: 5px !important;
907
789
  }
908
- .video-js.skin_news_live button.vjs-big-play-button {
790
+ .video-js.skin_news button.vjs-big-play-button {
909
791
  width: 50px !important;
910
792
  height: 50px !important;
911
793
  font-size: 2.1rem !important;
@@ -914,317 +796,134 @@
914
796
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
915
797
  display: none;
916
798
  }
917
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
799
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
918
800
  bottom: 2.4em !important;
919
801
  right: -1em;
920
802
  z-index: 1;
921
803
  }
922
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
804
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
923
805
  display: none !important;
924
806
  }
925
807
 
926
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
927
- color: white !important;
928
- font-size: 13px !important;
929
- background-color: black !important;
808
+ .video-js.skin_news .vjs-text-track-display-ttml span {
809
+ color: white;
810
+ font-size: 13px;
811
+ background-color: black;
930
812
  }
931
813
  }
932
814
 
933
- .video-js.skin_news_live .vjs-text-track-display-ttml {
934
- width: 100% !important;
935
- }
936
-
937
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
938
- color: white !important;
939
- font-size: 16px !important;
940
- background-color: black !important;
815
+ .video-js.skin_news .vjs-text-track-display-ttml span {
816
+ color: white;
817
+ font-size: 16px;
818
+ background-color: black;
941
819
  }
942
820
 
943
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
821
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
944
822
  margin-bottom: 2rem !important;
945
823
  }
946
824
 
947
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
825
+ .video-js.skin_news .vjs-text-track-display-ttml p {
948
826
  font-size: 18px !important;
949
827
  }
950
828
 
951
829
 
952
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
953
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
830
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
831
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
954
832
  font-size: 1.2em !important;
955
833
  line-height: 1.5em !important;
956
834
  padding: 0.2em 0.8em !important;
957
835
  }
958
836
 
959
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
837
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
960
838
  content: none !important;
961
839
  fill: none !important;
962
840
  filter: none !important;
963
841
  }
964
842
 
965
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
966
- color: rgba(255, 255, 2555, 0.7)!important;
843
+ /* svg icons opacity and hover effect */
844
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
845
+ opacity: 0.7 !important;
967
846
  }
968
847
 
969
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
970
- color: rgba(255, 255, 2555, 1)!important;
848
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
849
+ opacity: 1 !important;
971
850
  }
972
-
973
-
974
-
975
-
976
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
977
- height: 0.7em;
978
- position: absolute;
979
- top: -0.7em;
980
- width: 100%;
851
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
852
+ opacity: 0.7 !important;
853
+ }
854
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
855
+ opacity: 1 !important;
981
856
  }
982
857
 
983
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
984
- height: 100%;
858
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
859
+ color: rgba(255, 255, 2555, 0.7)!important;
985
860
  }
986
861
 
987
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
988
- line-height: 2.5;
862
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
863
+ color: rgba(255, 255, 2555, 1)!important;
989
864
  }
990
865
 
991
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
992
- height: 19px;
993
- width: 19px;
994
- cursor: pointer;
866
+
867
+
868
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
869
+ font-size: 2.2em;
870
+ line-height: 2.6;
995
871
  }
996
- .video-js.skin_vlone .vjs-control {
997
- user-select: none;
872
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
873
+ background: #fcb700;
998
874
  }
999
- .video-js.skin_vlone .vjs-custom-control-spacer{
1000
- user-select: none;
875
+ .video-js.skin_news_live .vjs-control-bar{
876
+ z-index: 1 !important;
877
+ height: 5em !important;
878
+ background: black !important;
1001
879
  }
1002
-
1003
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
1004
- height: 19px;
1005
- width: 19px;
1006
- cursor: pointer;
880
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
881
+ display: flex;
882
+ align-items: center;
883
+ justify-content: center;
1007
884
  }
1008
885
 
1009
- .video-js.skin_vlone .vjs-play-progress:before {
1010
- display: none !important;
886
+ .video-js.skin_news_live .vjs-fade>* {
887
+ visibility: hidden !important;
888
+ opacity: 0 !important;
889
+ transition: visibility 1s, opacity 1s !important;
1011
890
  }
1012
891
 
1013
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
1014
- margin: 0 !important;
1015
-
892
+ .video-js.skin_news_live .custom-spaced-progress-bar {
893
+ position: absolute;
894
+ width: 100%;
895
+ display: flex;
896
+ height: 0.5em;
897
+ top: -0.5em;
1016
898
  }
1017
899
 
1018
-
1019
- .video-js.skin_vlone .vjs-custom-control-spacer {
1020
- display: block;
1021
- flex: 1 1 auto;
900
+ .video-js.skin_news_live .vjs-progress-control {
901
+ /* left: -6px; */
902
+ position: relative;
903
+ width: 100%;
904
+ height: 0.5em;
905
+ transition: height 0.1s, top 0.1s;
1022
906
  }
1023
907
 
1024
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
1025
- z-index: 1;
908
+ .video-js.skin_news_live .vjs-volume-panel{
909
+ min-width: 5.3em;
1026
910
  }
1027
911
 
1028
912
 
1029
- .video-js.skin_vlone .vjs-control-bar {
1030
- height: 40px;
1031
- }
1032
913
 
1033
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
1034
- .vjs-button>.vjs-icon-placeholder:before {
1035
- position: relative !important;
1036
- }
1037
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
1038
- display: flex;
1039
- left: 0px;
1040
- top: -1px;
1041
- }
1042
-
1043
- .vjs-button>.vjs-icon-placeholder:before {
1044
- font-size: 2em !important;
1045
- }
1046
-
1047
- .video-js.skin_vlone .vjs-control {
1048
- width: 4.3em;
1049
- }
1050
-
1051
- .vjs-menu-button-popup .vjs-menu {
1052
- bottom: 10px !important;
1053
- }
1054
-
1055
-
1056
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
1057
- height: 1.3em;
1058
- position: absolute;
1059
- top: -1.3em;
1060
- transition: height 0.3s, top 0.3s;
1061
- }
1062
-
1063
-
1064
- .video-js.skin_vlone.vjs-live .vjs-time-control{
1065
- display: none !important;
1066
- }
1067
-
1068
- .video-js.skin_vlone .vjs-time-control {
1069
- display: block;
1070
- }
1071
- .video-js.skin_vlone .vjs-remaining-time {
1072
- display: none;
1073
- }
1074
-
1075
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
1076
- line-height: 3.5em;
1077
- font-size: 1.1em;
1078
- min-width: 4em;
1079
- }
1080
-
1081
- .video-js.skin_vlone .vjs-time-divider > div{
1082
- display: flex;
1083
- justify-content: center;
1084
- }
1085
-
1086
- .video-js.skin_vlone .vjs-live-control{
1087
- align-items: center;
1088
- }
1089
- .video-js.skin_vlone .vjs-live-display{
1090
- height: 2.2em;
1091
- display: flex;
1092
- align-items: center;
1093
- font-family: monospace;
1094
- width: 4em;
1095
- justify-content: center;
1096
- background: red;
1097
- margin: 4px 0px 4px 12px;
1098
- }
1099
- .video-js.skin_vlone .vjs-live-display:hover{
1100
- cursor: pointer;
1101
- }
1102
-
1103
- .video-js.skin_vlone .vjs-time-control {
1104
- line-height: 3.5em !important;
1105
- font-size: 1.1em !important;
1106
- width: min-content !important;
1107
- min-width: 1.5em;
1108
- padding: 0 !important;
1109
- user-select: none;
1110
- }
1111
-
1112
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
1113
- margin-left: 16px !important;
1114
- }
1115
-
1116
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1117
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1118
- font-size: 1.2em !important;
1119
- line-height: 1.5em !important;
1120
- padding: 0.2em 0.8em !important;
1121
- }
1122
-
1123
-
1124
- /* Big play */
1125
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
1126
- width: 80px;
1127
- height: 80px;
1128
- display: flex;
1129
- justify-content: center;
1130
- align-items: center;
1131
- border: none;
1132
- position: absolute;
1133
- top: 0;
1134
- left: 0;
1135
- right: 0;
1136
- bottom: 0;
1137
- margin: auto;
1138
- font-size: 5em;
1139
- line-height: 1.3em;
1140
- transform: none !important;
1141
- border-radius: 1.3em;
1142
- }
1143
- .video-js.skin_vlone .ssai-ad-container{
1144
- position: absolute;
1145
- bottom: 4px;
1146
- }
1147
-
1148
- @media(max-width:600px){
1149
- .video-js.skin_vlone button.vjs-big-play-button {
1150
- width: 50px !important;
1151
- height: 50px !important;
1152
- font-size: 2.1rem !important;
1153
- }
1154
-
1155
- .video-js.skin_vlone .ssai-ad-container {
1156
- position: absolute;
1157
- bottom: 2px;
1158
- }
1159
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
1160
- display: none;
1161
- }
1162
-
1163
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
1164
- /* display: none; */
914
+ .video-js.skin_news_live .vjs-custom-control-spacer {
915
+ /* display: block; */
916
+ /* flex: 1 1 auto; */
1165
917
  }
1166
918
 
1167
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
1168
- /* display: none; */
1169
- }
1170
- }
1171
-
1172
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1173
- font-size: 2.2em;
1174
- line-height: 2.6;
1175
- }
1176
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1177
- background: white;
1178
- }
1179
- .video-js.skin_news .vjs-control-bar{
1180
- z-index: 1 !important;
1181
- height: 5em !important;
1182
- background: black !important;
1183
- }
1184
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1185
- display: flex;
1186
- align-items: center;
1187
- justify-content: center;
1188
- }
1189
-
1190
- .video-js.skin_news .vjs-fade>* {
1191
- visibility: hidden !important;
1192
- opacity: 0 !important;
1193
- transition: visibility 1s, opacity 1s !important;
1194
- }
1195
-
1196
- .video-js.skin_news .custom-spaced-progress-bar {
1197
- position: absolute;
1198
- width: 100%;
1199
- display: flex;
1200
- height: 0.5em;
1201
- top: -0.5em;
1202
- }
1203
-
1204
- .video-js.skin_news .vjs-progress-control {
1205
- /* left: -6px; */
1206
- position: relative;
1207
- width: 100%;
1208
- height: 0.5em;
1209
- transition: height 0.1s, top 0.1s;
1210
- }
1211
-
1212
-
1213
-
1214
-
1215
- .video-js.skin_news .vjs-custom-control-spacer {
1216
- display: block;
1217
- flex: 1 1 auto;
1218
- }
1219
-
1220
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
919
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1221
920
  margin: 0 0px 0 0px;
1222
921
  }
1223
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
922
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1224
923
  display: none;
1225
924
  }
1226
925
 
1227
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
926
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1228
927
  font-size: 14px;
1229
928
  font-weight: 500;
1230
929
  align-self: center;
@@ -1233,30 +932,30 @@
1233
932
  border-radius: 8px;
1234
933
  }
1235
934
 
1236
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
935
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1237
936
  height: 6px !important;
1238
937
  }
1239
938
 
1240
- .video-js.skin_news .vjs-play-progress:before {
939
+ .video-js.skin_news_live .vjs-play-progress:before {
1241
940
  font-size: 1.5em;
1242
941
  line-height: unset;
1243
942
  top: -0.3333333333em;
1244
943
  }
1245
944
 
1246
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
945
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1247
946
  display: none !important;
1248
947
  }
1249
948
 
1250
949
  /* */
1251
- .video-js.skin_news .vjs-mouse-display{
950
+ .video-js.skin_news_live .vjs-mouse-display{
1252
951
  font-size: 1.6666666667em;
1253
952
  }
1254
953
 
1255
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
954
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1256
955
  font-size: 1em !important;
1257
956
  }
1258
957
 
1259
- .video-js.skin_news .vjs-button{
958
+ .video-js.skin_news_live .vjs-button{
1260
959
  width: 5.3em;
1261
960
  display: flex;
1262
961
  align-items: center;
@@ -1264,63 +963,71 @@
1264
963
  }
1265
964
 
1266
965
 
1267
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
966
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1268
967
  .icon-maximize {
1269
968
  display: block;
1270
969
  height: 32px;
1271
970
  }
1272
971
 
1273
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
972
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1274
973
  line-height: 4;
1275
974
  }
1276
975
 
1277
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
976
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1278
977
  .icon-minimize {
1279
978
  display: none;
1280
979
  height: 32px;
1281
980
  }
1282
981
 
1283
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
982
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1284
983
  outline: none !important;
984
+ /* flex: 1; */
1285
985
  }
1286
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
986
+ .video-js.skin_news_live .vjs-play-toggle-container{
987
+ display: flex;
988
+ flex: 1;
989
+ justify-content: center;
990
+ }
991
+
992
+
993
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1287
994
  .vjs-icon-fullscreen-enter:before {
1288
995
  /* content: '' !important; */
1289
996
  }
1290
997
 
1291
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
998
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1292
999
  display: flex;
1293
1000
  justify-content: center;
1294
1001
  align-items: center;
1295
1002
  /* transform: rotate(90deg); */
1296
1003
  }
1297
1004
 
1298
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1005
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1299
1006
  display: none;
1300
1007
  }
1301
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1008
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1302
1009
  margin-left: -10px;
1303
1010
  }
1304
1011
 
1305
- .video-js.skin_news .skipbtn:hover{
1012
+ .video-js.skin_news_live .skipbtn:hover{
1306
1013
  cursor: pointer;
1307
1014
  }
1308
1015
 
1309
- .video-js.skin_news .rewindbtn:hover{
1016
+ .video-js.skin_news_live .rewindbtn:hover{
1310
1017
  cursor: pointer;
1311
1018
  }
1312
1019
 
1313
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1020
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1314
1021
  position: relative;
1315
1022
  padding-left: 0;
1316
1023
  }
1317
1024
 
1318
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1025
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1319
1026
  display: none !important;
1320
1027
  }
1321
1028
 
1322
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1323
- width: 90px;
1029
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1030
+ /* width: 90px;
1324
1031
  height: 90px;
1325
1032
  display: flex;
1326
1033
  justify-content: center;
@@ -1335,19 +1042,20 @@
1335
1042
  font-size: 6em;
1336
1043
  line-height: 1.4em;
1337
1044
  border: 0.05em solid;
1338
- color: inherit;
1045
+ color: inherit; */
1046
+ display: none !important;
1339
1047
  }
1340
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1048
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1341
1049
  font-weight: bold;
1342
1050
  }
1343
1051
 
1344
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1052
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1345
1053
  bottom: 2.4em !important;
1346
1054
  right: -1em;
1347
1055
  z-index: 1;
1348
1056
  }
1349
1057
 
1350
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1058
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1351
1059
  width: 24px !important;
1352
1060
  height: 24px !important;
1353
1061
  }
@@ -1357,34 +1065,34 @@
1357
1065
  }
1358
1066
 
1359
1067
 
1360
- .video-js.skin_news button.vjs-rewind-button{
1068
+ .video-js.skin_news_live button.vjs-rewind-button{
1361
1069
  cursor: pointer;
1362
1070
  }
1363
1071
 
1364
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1072
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1365
1073
  padding-right: 0;
1074
+ display: none;
1366
1075
  }
1367
1076
 
1368
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1077
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1369
1078
  padding-left: 0;
1079
+ display: none;
1370
1080
  }
1371
1081
 
1372
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1082
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1373
1083
  padding-left: 0;
1374
1084
  padding-right: 0;
1375
- display: flex;
1376
- justify-content: center;
1377
- width: min-content;
1085
+ display: none;
1378
1086
  }
1379
1087
 
1380
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1088
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1381
1089
  display: none
1382
1090
  }
1383
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1091
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1384
1092
  display: none
1385
1093
  }
1386
1094
 
1387
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
1095
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1388
1096
  display: flex;
1389
1097
  align-items: center;
1390
1098
  font-weight: 700;
@@ -1392,26 +1100,26 @@
1392
1100
  min-width: 1.2em;
1393
1101
  }
1394
1102
 
1395
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1103
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1396
1104
  display: none;
1397
1105
  font-size: 11px;
1398
1106
  justify-content: center;
1399
1107
  align-items: center;
1400
1108
  user-select: none;
1401
1109
  }
1402
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1110
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1403
1111
  display: none;
1404
1112
  }
1405
1113
 
1406
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1114
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1407
1115
  height: min-content;
1408
1116
  width: min-content;
1409
1117
  }
1410
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1118
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1411
1119
  width: 6em;
1412
1120
  }
1413
1121
 
1414
- .video-js.skin_news .content{
1122
+ .video-js.skin_news_live .content{
1415
1123
  bottom: 3.4rem !important;
1416
1124
  right: -4rem !important;
1417
1125
  }
@@ -1430,15 +1138,16 @@
1430
1138
  pointer-events:none
1431
1139
  }
1432
1140
 
1433
- .video-js.skin_news iframe{
1141
+ .video-js.skin_news_live iframe{
1434
1142
  width: 100%;
1435
1143
  height: 100%;
1436
1144
  }
1437
1145
 
1438
- .video-js.skin_news .vjs-live-control{
1146
+ .video-js.skin_news_live .vjs-live-control{
1439
1147
  align-items: center;
1148
+ display: none;
1440
1149
  }
1441
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1150
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1442
1151
  height: 2.2em;
1443
1152
  display: flex;
1444
1153
  align-items: center;
@@ -1449,43 +1158,22 @@
1449
1158
  margin: 4px 0px 4px 12px;
1450
1159
  }
1451
1160
 
1452
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1161
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1453
1162
  text-shadow: none;
1454
1163
  }
1455
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1456
- display: none;
1457
- font-size: 12px;
1458
- }
1459
1164
 
1460
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1461
- height: 2.2em;
1462
- display: inline-flex;
1463
- align-items: center;
1464
- /* font-family: monospace; */
1165
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1166
+ display: flex;
1465
1167
  justify-content: center;
1466
- border: 2px solid;
1467
- margin: 4px 0px 4px 6px;
1468
- white-space: pre;
1469
- padding: 0px 6px;
1470
- font-size: 1.2em;
1471
- font-weight: 500;
1472
- color: rgba(255, 255, 2555, 0.7);
1473
-
1474
- letter-spacing: -.1px;
1475
- line-height: normal;
1476
- text-transform: uppercase;
1477
- color: #FFFFFF;
1478
- opacity: .7;
1479
- font-family: "Proxima Nova";
1168
+ min-width: 5.3em;
1169
+ pointer-events: none;
1170
+ user-select: none;
1480
1171
  }
1481
1172
 
1482
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1483
- opacity: 1;
1173
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1174
+ color: white;
1484
1175
  }
1485
1176
 
1486
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1487
- content: "NOT LIVE";
1488
- }
1489
1177
 
1490
1178
  .settings-selection.vjs-control.vjs-button{
1491
1179
  display: flex !important;
@@ -1502,57 +1190,57 @@
1502
1190
  .tvProviderImage{
1503
1191
  display: none
1504
1192
  }
1505
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1193
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1506
1194
  .icon-maximize {
1507
1195
  height: 30px !important;
1508
1196
  }
1509
1197
 
1510
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1198
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1511
1199
  .icon-minimize {
1512
1200
  height: 30px !important;
1513
1201
  }
1514
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1202
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1515
1203
  width: 4.5em;
1516
1204
  }
1517
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1205
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1518
1206
  height: min-content;
1519
1207
  }
1520
1208
 
1521
- .video-js.skin_news button.vjs-slowmo-button{
1209
+ .video-js.skin_news_live button.vjs-slowmo-button{
1522
1210
  display: none;
1523
1211
  }
1524
- .video-js.skin_news button.vjs-rewind-button{
1212
+ .video-js.skin_news_live button.vjs-rewind-button{
1525
1213
  display: none;
1526
1214
  }
1527
- .video-js.skin_news button.vjs-rewind-button>svg{
1215
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
1528
1216
  height: 20px;
1529
1217
  }
1530
- .video-js.skin_news .vjs-button{
1218
+ .video-js.skin_news_live .vjs-button{
1531
1219
  width: 4.8em;
1532
1220
  }
1533
- .video-js.skin_news .widget-selection{
1221
+ .video-js.skin_news_live .widget-selection{
1534
1222
  display: none;
1535
1223
  }
1536
- .video-js.skin_news .container{
1224
+ .video-js.skin_news_live .container{
1537
1225
  display: none !important;
1538
1226
  }
1539
- .video-js.skin_news .vjs-control-bar{
1227
+ .video-js.skin_news_live .vjs-control-bar{
1540
1228
  height: 4em !important;
1541
1229
  }
1542
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1230
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1543
1231
  font-size: 2.5em;
1544
1232
  line-height: 1.5;
1545
1233
  }
1546
- .video-js.skin_news .vjs-play-progress:before {
1234
+ .video-js.skin_news_live .vjs-play-progress:before {
1547
1235
  font-size: 1.2em;
1548
1236
  position: absolute;
1549
1237
  right: -0.5em;
1550
1238
  z-index: 1;
1551
1239
  }
1552
- .video-js.skin_news button.vjs-skip-button>svg{
1240
+ .video-js.skin_news_live button.vjs-skip-button>svg{
1553
1241
  height: 20px;
1554
1242
  }
1555
- .video-js.skin_news button.vjs-big-play-button {
1243
+ .video-js.skin_news_live button.vjs-big-play-button {
1556
1244
  width: 50px !important;
1557
1245
  height: 50px !important;
1558
1246
  font-size: 2.1rem !important;
@@ -1562,17 +1250,17 @@
1562
1250
  width: 24px;
1563
1251
  height: 24px;
1564
1252
  }
1565
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1253
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1566
1254
  margin: 0 12px 0 12px;
1567
1255
  }
1568
- .video-js.skin_news .vjs-seek-to-live-text{
1256
+ .video-js.skin_news_live .vjs-seek-to-live-text{
1569
1257
  font-size: 12px;
1570
1258
  }
1571
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1259
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1572
1260
  margin: 0 12px 0 12px;
1573
1261
  }
1574
1262
  }
1575
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1263
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1576
1264
  width: 90px;
1577
1265
  height: 90px;
1578
1266
  display: flex;
@@ -1589,7 +1277,7 @@
1589
1277
  line-height: 1.4em;
1590
1278
  }
1591
1279
 
1592
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1280
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1593
1281
  display: flex;
1594
1282
  justify-content: center;
1595
1283
  align-items: center;
@@ -1597,29 +1285,22 @@
1597
1285
  transition: width 0.1s;
1598
1286
  }
1599
1287
 
1600
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1288
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1601
1289
  display: flex;
1602
1290
  justify-content: center;
1603
1291
  align-items: center;
1604
1292
  height: 100%;
1605
1293
  transition: width 0.1s;
1606
1294
  }
1607
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1295
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1608
1296
  display: none !important;
1609
1297
  }
1610
- .video-js.skin_news .ssai-ad-container{
1611
- position: absolute;
1612
- bottom: 14px;
1613
- }
1614
1298
 
1615
1299
  @media (max-width: 576px) {
1616
- .video-js.skin_news .ssai-ad-container{
1617
- bottom: 2px;
1618
- }
1619
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1300
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1620
1301
  height: 5px !important;
1621
1302
  }
1622
- .video-js.skin_news button.vjs-big-play-button {
1303
+ .video-js.skin_news_live button.vjs-big-play-button {
1623
1304
  width: 50px !important;
1624
1305
  height: 50px !important;
1625
1306
  font-size: 2.1rem !important;
@@ -1628,408 +1309,727 @@
1628
1309
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1629
1310
  display: none;
1630
1311
  }
1631
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1312
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1632
1313
  bottom: 2.4em !important;
1633
1314
  right: -1em;
1634
1315
  z-index: 1;
1635
1316
  }
1636
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1317
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1637
1318
  display: none !important;
1638
1319
  }
1639
1320
 
1640
- .video-js.skin_news .vjs-text-track-display-ttml span {
1641
- color: white;
1642
- font-size: 13px;
1643
- background-color: black;
1321
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1322
+ color: white !important;
1323
+ font-size: 13px !important;
1324
+ background-color: black !important;
1644
1325
  }
1645
1326
  }
1646
1327
 
1647
- .video-js.skin_news .vjs-text-track-display-ttml span {
1648
- color: white;
1649
- font-size: 16px;
1650
- background-color: black;
1328
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
1329
+ width: 100% !important;
1651
1330
  }
1652
1331
 
1653
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1332
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
1333
+ color: white !important;
1334
+ font-size: 16px !important;
1335
+ background-color: black !important;
1336
+ }
1337
+
1338
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1654
1339
  margin-bottom: 2rem !important;
1655
1340
  }
1656
1341
 
1657
- .video-js.skin_news .vjs-text-track-display-ttml p {
1342
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
1658
1343
  font-size: 18px !important;
1659
1344
  }
1660
1345
 
1661
1346
 
1662
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1663
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1347
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1348
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1664
1349
  font-size: 1.2em !important;
1665
1350
  line-height: 1.5em !important;
1666
1351
  padding: 0.2em 0.8em !important;
1667
1352
  }
1668
1353
 
1669
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1354
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1670
1355
  content: none !important;
1671
1356
  fill: none !important;
1672
1357
  filter: none !important;
1673
1358
  }
1674
1359
 
1675
- /* svg icons opacity and hover effect */
1676
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1677
- opacity: 0.7 !important;
1678
- }
1679
-
1680
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1681
- opacity: 1 !important;
1682
- }
1683
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1684
- opacity: 0.7 !important;
1685
- }
1686
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1687
- opacity: 1 !important;
1688
- }
1689
-
1690
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1360
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1691
1361
  color: rgba(255, 255, 2555, 0.7)!important;
1692
1362
  }
1693
1363
 
1694
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1364
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1695
1365
  color: rgba(255, 255, 2555, 1)!important;
1696
1366
  }
1697
1367
 
1698
1368
 
1699
1369
 
1700
-
1701
- .video-js.skin_cn_news .vjs-control-bar {
1702
- z-index: 1 !important;
1703
- height: auto !important;
1704
- padding: 0.8em 30px 0.6em;
1705
- background: transparent !important;
1706
- display: flex;
1707
- flex-wrap: wrap;
1708
- align-items: center;
1709
- column-gap: 10px;
1370
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
1371
+ height: 0.7em;
1372
+ position: absolute;
1373
+ top: -0.7em;
1374
+ width: 100%;
1710
1375
  }
1711
1376
 
1712
-
1713
- .video-js.skin_cn_news .vjs-control-bar::before {
1714
- content: '';
1715
- position: absolute;
1716
- left: 0;
1717
- right: 0;
1718
- bottom: 0;
1719
- top: -3em;
1720
- background: linear-gradient(
1721
- to top,
1722
- rgba(0, 0, 0, 0.85) 0%,
1723
- rgba(0, 0, 0, 0.7) 40%,
1724
- rgba(0, 0, 0, 0.55) 70%,
1725
- rgba(0, 0, 0, 0.38) 86%,
1726
- transparent 100%
1727
- );
1728
- pointer-events: none;
1729
- z-index: -1;
1377
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
1378
+ height: 100%;
1730
1379
  }
1731
1380
 
1732
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1733
- order: -1;
1734
- flex: 0 0 100%;
1735
- width: 80%;
1736
- margin: 0 0 5em;
1737
- position: relative;
1381
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
1382
+ line-height: 2.5;
1738
1383
  }
1739
1384
 
1740
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1741
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1742
- width: auto;
1743
- min-width: 0;
1385
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
1386
+ height: 19px;
1387
+ width: 19px;
1388
+ cursor: pointer;
1744
1389
  }
1745
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1746
- display: inline-flex;
1747
- align-items: center;
1748
- justify-content: center;
1749
- height: 7em;
1750
- padding: 0 10px;
1751
- color: #fff;
1390
+ .video-js.skin_vlone .vjs-control {
1391
+ user-select: none;
1752
1392
  }
1753
-
1754
- .video-js.skin_cn_news .vjs-svg-icon::before {
1755
- content: none !important;
1393
+ .video-js.skin_vlone .vjs-custom-control-spacer{
1394
+ user-select: none;
1756
1395
  }
1757
1396
 
1758
-
1759
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1760
- display: inline-flex;
1761
- align-items: center;
1762
- justify-content: center;
1397
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
1398
+ height: 19px;
1399
+ width: 19px;
1400
+ cursor: pointer;
1763
1401
  }
1764
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1765
- .video-js.skin_cn_news .vjs-rewind-button svg {
1766
- width: 24px;
1767
- height: 24px;
1768
- display: block;
1402
+
1403
+ .video-js.skin_vlone .vjs-play-progress:before {
1404
+ display: none !important;
1769
1405
  }
1770
1406
 
1407
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
1408
+ margin: 0 !important;
1771
1409
 
1410
+ }
1772
1411
 
1773
- .video-js.skin_cn_news .vjs-subs-caps-button {
1774
- opacity: 1;
1412
+
1413
+ .video-js.skin_vlone .vjs-custom-control-spacer {
1414
+ display: block;
1415
+ flex: 1 1 auto;
1416
+ }
1417
+
1418
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
1419
+ z-index: 1;
1420
+ }
1421
+
1422
+
1423
+ .video-js.skin_vlone .vjs-control-bar {
1424
+ height: 40px;
1425
+ }
1426
+
1427
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
1428
+ .vjs-button>.vjs-icon-placeholder:before {
1429
+ position: relative !important;
1430
+ }
1431
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
1432
+ display: flex;
1433
+ left: 0px;
1434
+ top: -1px;
1435
+ }
1436
+
1437
+ .vjs-button>.vjs-icon-placeholder:before {
1438
+ font-size: 2em !important;
1439
+ }
1440
+
1441
+ .video-js.skin_vlone .vjs-control {
1442
+ width: 4.3em;
1443
+ }
1444
+
1445
+ .vjs-menu-button-popup .vjs-menu {
1446
+ bottom: 10px !important;
1447
+ }
1448
+
1449
+
1450
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
1451
+ height: 1.3em;
1452
+ position: absolute;
1453
+ top: -1.3em;
1454
+ transition: height 0.3s, top 0.3s;
1455
+ }
1456
+
1457
+
1458
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
1459
+ display: none !important;
1460
+ }
1461
+
1462
+ .video-js.skin_vlone .vjs-time-control {
1463
+ display: block;
1464
+ }
1465
+ .video-js.skin_vlone .vjs-remaining-time {
1466
+ display: none;
1467
+ }
1468
+
1469
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
1470
+ line-height: 3.5em;
1471
+ font-size: 1.1em;
1472
+ min-width: 4em;
1473
+ }
1474
+
1475
+ .video-js.skin_vlone .vjs-time-divider > div{
1476
+ display: flex;
1477
+ justify-content: center;
1478
+ }
1479
+
1480
+ .video-js.skin_vlone .vjs-live-control{
1481
+ align-items: center;
1482
+ }
1483
+ .video-js.skin_vlone .vjs-live-display{
1484
+ height: 2.2em;
1485
+ display: flex;
1486
+ align-items: center;
1487
+ font-family: monospace;
1488
+ width: 4em;
1489
+ justify-content: center;
1490
+ background: red;
1491
+ margin: 4px 0px 4px 12px;
1492
+ }
1493
+ .video-js.skin_vlone .vjs-live-display:hover{
1494
+ cursor: pointer;
1495
+ }
1496
+
1497
+ .video-js.skin_vlone .vjs-time-control {
1498
+ line-height: 3.5em !important;
1499
+ font-size: 1.1em !important;
1500
+ width: min-content !important;
1501
+ min-width: 1.5em;
1502
+ padding: 0 !important;
1503
+ user-select: none;
1504
+ }
1505
+
1506
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
1507
+ margin-left: 16px !important;
1508
+ }
1509
+
1510
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1511
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1512
+ font-size: 1.2em !important;
1513
+ line-height: 1.5em !important;
1514
+ padding: 0.2em 0.8em !important;
1515
+ }
1516
+
1517
+
1518
+ /* Big play */
1519
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
1520
+ width: 80px;
1521
+ height: 80px;
1522
+ display: flex;
1523
+ justify-content: center;
1524
+ align-items: center;
1525
+ border: none;
1526
+ position: absolute;
1527
+ top: 0;
1528
+ left: 0;
1529
+ right: 0;
1530
+ bottom: 0;
1531
+ margin: auto;
1532
+ font-size: 5em;
1533
+ line-height: 1.3em;
1534
+ transform: none !important;
1535
+ border-radius: 1.3em;
1536
+ }
1537
+ .video-js.skin_vlone .ssai-ad-container{
1538
+ position: absolute;
1539
+ bottom: 4px;
1540
+ }
1541
+
1542
+ @media(max-width:600px){
1543
+ .video-js.skin_vlone button.vjs-big-play-button {
1544
+ width: 50px !important;
1545
+ height: 50px !important;
1546
+ font-size: 2.1rem !important;
1547
+ }
1548
+
1549
+ .video-js.skin_vlone .ssai-ad-container {
1550
+ position: absolute;
1551
+ bottom: 2px;
1552
+ }
1553
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
1554
+ display: none;
1555
+ }
1556
+
1557
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
1558
+ /* display: none; */
1559
+ }
1560
+
1561
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
1562
+ /* display: none; */
1563
+ }
1564
+ }
1565
+
1566
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1567
+ font-size: 2.2em;
1568
+ line-height: 2.6;
1569
+ }
1570
+ .video-js.skin_mini{
1571
+ overflow: hidden;
1572
+ }
1573
+ .video-js.skin_mini .vjs-control-bar{
1574
+ z-index: 1 !important;
1575
+ height: 4em !important;
1576
+ background: black !important;
1577
+ }
1578
+
1579
+ .video-js.skin_mini .vjs-fade>* {
1580
+ visibility: hidden !important;
1581
+ opacity: 0 !important;
1582
+ transition: visibility 1s, opacity 1s !important;
1583
+ }
1584
+
1585
+ .video-js.skin_mini .custom-spaced-progress-bar {
1586
+ position: absolute;
1587
+ width: 100%;
1588
+ display: flex;
1589
+ height: 0.5em;
1590
+ top: -0.5em;
1591
+ }
1592
+
1593
+ .video-js.skin_mini .vjs-progress-control {
1594
+ /* left: -6px; */
1595
+ position: relative;
1596
+ width: 100%;
1597
+ height: 0.5em;
1598
+ transition: height 0.1s, top 0.1s;
1599
+ }
1600
+
1601
+
1602
+
1603
+
1604
+ .video-js.skin_mini .vjs-custom-control-spacer {
1605
+ display: block;
1606
+ flex: 1 1 auto;
1607
+ }
1608
+
1609
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1610
+ margin: 0 0px 0 0px;
1611
+ }
1612
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1613
+ display: none;
1614
+ }
1615
+
1616
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1617
+ font-size: 14px;
1618
+ font-weight: 500;
1619
+ align-self: center;
1620
+ height: min-content;
1621
+ padding: 5px 2px;
1622
+ border-radius: 8px;
1623
+ }
1624
+
1625
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1626
+ height: 5px !important;
1627
+ }
1628
+
1629
+ .video-js.skin_mini .vjs-play-progress:before {
1630
+ font-size: 1.3em;
1631
+ line-height: unset;
1632
+ top: -0.3333333333em;
1633
+ }
1634
+
1635
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1636
+ display: none !important;
1637
+ }
1638
+
1639
+ /* */
1640
+ .video-js.skin_mini .vjs-mouse-display{
1641
+ font-size: 1.6666666667em;
1642
+ }
1643
+
1644
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1645
+ font-size: 1em !important;
1646
+ }
1647
+
1648
+ .video-js.skin_mini .vjs-button{
1649
+ width: 3em;
1650
+ display: flex;
1651
+ align-items: center;
1652
+ justify-content: center;
1653
+ }
1654
+
1655
+
1656
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1657
+ .icon-maximize {
1658
+ display: block;
1659
+ height: 32px;
1660
+ }
1661
+
1662
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1663
+ line-height: 4;
1664
+ }
1665
+
1666
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1667
+ .icon-minimize {
1668
+ display: none;
1669
+ height: 32px;
1670
+ }
1671
+
1672
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1673
+ outline: none !important;
1674
+ }
1675
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1676
+ .vjs-icon-fullscreen-enter:before {
1677
+ /* content: '' !important; */
1678
+ }
1679
+
1680
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1681
+ display: flex;
1682
+ justify-content: center;
1683
+ align-items: center;
1684
+ /* transform: rotate(90deg); */
1685
+ }
1686
+
1687
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1688
+ display: none;
1689
+ }
1690
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1691
+ margin-left: -10px;
1692
+ display: none;
1693
+ }
1694
+
1695
+ .video-js.skin_mini .vjs-loading-spinner {
1696
+ position: absolute;
1697
+ top: 50%;
1698
+ left: 50%;
1699
+ transform: translate(-50%, -50%);
1700
+ opacity: .85;
1701
+ text-align: left;
1702
+ border: .2em solid rgba(43, 51, 63, .7);
1703
+ box-sizing: border-box;
1704
+ background-clip: padding-box;
1705
+ width: 3em;
1706
+ height: 3em;
1707
+ border-radius: 50%;
1708
+ visibility: hidden;
1775
1709
  }
1776
1710
 
1711
+ .video-js.skin_mini .skipbtn:hover{
1712
+ cursor: pointer;
1713
+ }
1777
1714
 
1715
+ .video-js.skin_mini .rewindbtn:hover{
1716
+ cursor: pointer;
1717
+ }
1778
1718
 
1779
- .video-js.skin_cn_news .vjs-volume-panel {
1780
- margin: 0;
1781
- display: inline-flex;
1782
- align-items: center;
1783
- align-self: center;
1784
- height: 2.2em;
1785
- min-width: 7em;
1786
- transition: none;
1719
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1720
+ position: relative;
1721
+ padding-left: 0;
1787
1722
  }
1788
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1789
- width: 0;
1790
- height: 100%;
1723
+
1724
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1725
+ width: 40px;
1726
+ height: 40px;
1791
1727
  display: flex;
1728
+ justify-content: center;
1792
1729
  align-items: center;
1793
- overflow: hidden;
1794
- opacity: 0;
1795
- transition: width 0.15s ease, opacity 0.15s ease;
1796
- }
1797
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1798
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1799
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1800
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1801
- width: 5em;
1802
- opacity: 1;
1730
+ border: none;
1731
+ position: absolute;
1732
+ top: 0;
1733
+ left: 0;
1734
+ right: 0;
1735
+ bottom: 0;
1736
+ margin: auto;
1737
+ font-size: 3em;
1738
+ line-height: 1.3em;
1739
+ transform: none !important;
1740
+ border-radius: 1.3em;
1803
1741
  }
1804
1742
 
1805
- .video-js.skin_cn_news .vjs-volume-bar {
1806
- width: 4em;
1807
- height: 0.3em;
1808
- margin: 0 0.45em;
1743
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1744
+ font-weight: bold;
1809
1745
  }
1810
1746
 
1811
-
1812
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1813
- display: none !important;
1747
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1748
+ bottom: 1.1em !important;
1749
+ right: 1em;
1750
+ z-index: 1;
1751
+ font-size: 10px;
1814
1752
  }
1815
1753
 
1816
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1817
- width: 0 !important;
1754
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1755
+ width: 24px !important;
1756
+ height: 24px !important;
1757
+ }
1758
+ .video-js.skin_mini .settings-selector-icon>svg{
1759
+ height: 19px !important;
1760
+ width: 19px !important;
1818
1761
  }
1819
1762
 
1820
1763
 
1821
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1822
- display: block !important;
1823
- flex: 1 1 auto;
1764
+ .video-js.skin_mini button.vjs-rewind-button{
1765
+ cursor: pointer;
1824
1766
  }
1825
1767
 
1768
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1769
+ padding-right: 0;
1770
+ }
1826
1771
 
1827
- .video-js.skin_cn_news .vjs-big-play-button {
1828
- display: none;
1772
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1773
+ padding-left: 0;
1829
1774
  }
1830
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1831
- position: relative !important;
1775
+
1776
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1777
+ padding-left: 0;
1778
+ padding-right: 0;
1832
1779
  display: flex;
1833
- left: 0;
1834
- top: -1px;
1780
+ justify-content: center;
1781
+ width: min-content;
1835
1782
  }
1836
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1837
- display: flex;
1783
+
1784
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1785
+ display: none
1786
+ }
1787
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1788
+ display: none
1789
+ }
1790
+
1791
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1792
+ display: flex;
1793
+ align-items: center;
1794
+ font-weight: 700;
1795
+ font-size: 9px;
1796
+ min-width: 0.8em;
1797
+ padding-left: 0;
1798
+ }
1799
+
1800
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1801
+ display: none;
1802
+ font-size: 11px;
1838
1803
  justify-content: center;
1839
1804
  align-items: center;
1805
+ user-select: none;
1806
+ }
1807
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1808
+ display: none;
1809
+ }
1810
+
1811
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1812
+ height: min-content;
1813
+ width: min-content;
1814
+ }
1815
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1816
+ width: 3em;
1817
+ margin-right: 4px;
1818
+ }
1819
+
1820
+ .video-js.skin_mini .content{
1821
+ bottom: 3.4rem !important;
1822
+ right: -4rem !important;
1823
+ }
1824
+
1825
+ .video-js.skin_mini .setting-icon > svg{
1826
+ height:18px !important;
1827
+ }
1828
+
1829
+ .output-overlay{
1840
1830
  position: absolute;
1841
- top: 0;
1842
- left: 0;
1843
- right: 0;
1844
1831
  bottom: 0;
1845
- margin: auto;
1846
- width: 80px;
1847
- height: 80px;
1848
- border: none;
1849
- border-radius: 50%;
1850
- background: rgba(0, 0, 0, 0.55);
1851
- font-size: 5em;
1852
- line-height: 1.3em;
1853
- transform: none !important;
1832
+ height: 100%;
1833
+ width: 100%;
1834
+ z-index: 0;
1835
+ border: 0;
1836
+ pointer-events:none
1837
+ }
1838
+
1839
+ .video-js.skin_mini iframe{
1840
+ width: 100%;
1841
+ height: 100%;
1854
1842
  }
1855
1843
 
1844
+ .video-js.skin_mini .vjs-live-control{
1845
+ align-items: center;
1846
+ max-width: 5em;
1847
+ }
1848
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1849
+ height: 2.2em;
1850
+ display: flex;
1851
+ align-items: center;
1852
+ font-family: monospace;
1853
+ width: 4em;
1854
+ justify-content: center;
1855
+ background: red;
1856
+ margin: 4px 0px 4px 2px;
1857
+ }
1856
1858
 
1857
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1858
- height: 4px !important;
1859
- margin: 0;
1860
- border-radius: 20px;
1861
- background-color: #393944;
1859
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1860
+ text-shadow: none;
1861
+ }
1862
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1863
+ display: none;
1864
+ font-size: 12px;
1862
1865
  }
1863
1866
 
1864
- .video-js.skin_cn_news .vjs-play-progress {
1865
- background-color: #ffffff;
1866
- border-radius: 20px;
1867
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1868
+ height: 1.8em;
1869
+ display: inline-flex;
1870
+ align-items: center;
1871
+ font-family: monospace;
1872
+ justify-content: center;
1873
+ border: 1.5px solid;
1874
+ margin: 4px 0px 4px 2px;
1875
+ white-space: pre;
1876
+ padding: 2px 4px;
1877
+ font-size: 1.2em;
1878
+ font-weight: 500;
1879
+ color: rgba(255, 255, 2555, 0.7);
1880
+ }
1881
+
1882
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1883
+ content: "NOT LIVE";
1884
+ word-spacing: -4px;
1885
+ }
1886
+
1887
+
1888
+ @media(max-width:600px){
1889
+ .tvProviderImage{
1890
+ display: none
1891
+ }
1892
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1893
+ .icon-maximize {
1894
+ height: 30px !important;
1895
+ }
1896
+
1897
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1898
+ .icon-minimize {
1899
+ height: 30px !important;
1900
+ }
1901
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1902
+ width: 3.5em;
1903
+ }
1904
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1905
+ height: min-content;
1906
+ }
1907
+
1908
+ .video-js.skin_mini button.vjs-slowmo-button{
1909
+ display: none;
1910
+ }
1911
+ .video-js.skin_mini button.vjs-rewind-button{
1912
+ display: none;
1913
+ }
1914
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1915
+ height: 20px;
1916
+ }
1917
+ .video-js.skin_mini .vjs-button{
1918
+ width: 3em;
1919
+ }
1920
+ .video-js.skin_mini .widget-selection{
1921
+ display: none;
1922
+ }
1923
+ .video-js.skin_mini .container{
1924
+ display: none !important;
1925
+ }
1926
+ .video-js.skin_mini .vjs-control-bar{
1927
+ height: 4em !important;
1928
+ }
1929
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1930
+ font-size: 2.5em;
1931
+ line-height: 1.5;
1932
+ }
1933
+ .video-js.skin_mini .vjs-play-progress:before {
1934
+ font-size: 1.2em;
1935
+ position: absolute;
1936
+ right: -0.5em;
1937
+ z-index: 1;
1867
1938
  }
1868
-
1869
- .video-js.skin_cn_news .vjs-load-progress,
1870
- .video-js.skin_cn_news .vjs-load-progress div {
1871
- background: rgba(255, 255, 255, 0.15);
1872
- border-radius: 20px;
1939
+ .video-js.skin_mini button.vjs-skip-button>svg{
1940
+ height: 20px;
1873
1941
  }
1874
1942
 
1875
-
1876
- .video-js.skin_cn_news .vjs-play-progress:before {
1877
- content: '';
1878
- width: 16px;
1879
- height: 16px;
1880
- border-radius: 50%;
1881
- background: #ffffff;
1882
- border: 2px solid rgba(0, 0, 0, 0.6);
1883
- box-sizing: border-box;
1884
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1885
- top: -6px;
1886
- right: -8px;
1887
- position: absolute;
1943
+ .stream-selector-icon>svg{
1944
+ width: 24px;
1945
+ height: 24px;
1888
1946
  }
1889
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1890
- display: none !important;
1947
+ .video-js.skin_mini .vjs-seek-to-live-text{
1948
+ font-size: 12px;
1891
1949
  }
1892
1950
 
1893
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1894
- background: #ffffff;
1895
- color: #0a0e17;
1896
- font-weight: 700;
1897
- border-radius: 3px;
1951
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1952
+ color: white !important;
1953
+ font-size: 16px !important;
1954
+ background-color: rgba(0,0,0,0.2) !important;
1955
+ }
1898
1956
  }
1899
1957
 
1900
- .video-js.skin_cn_news .vjs-live-control {
1901
- display: none !important;
1958
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1959
+ color: white !important;
1960
+ font-size: 16px !important;
1961
+ background-color: rgba(0,0,0,0.2) !important;
1902
1962
  }
1903
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1904
- display: inline-flex;
1905
- align-items: center;
1906
- align-self: center;
1907
- height: 2.2em;
1908
- gap: 5px;
1909
- width: auto;
1910
- padding: 0 10px;
1911
- border: 1px solid rgba(255, 255, 255, 0.45);
1912
- border-radius: 4px;
1913
- cursor: pointer;
1963
+
1964
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1965
+ font-size: 18px !important;
1914
1966
  }
1915
1967
 
1916
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1917
- display: none;
1968
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1969
+ margin-bottom: 1rem !important;
1918
1970
  }
1919
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1920
- display: inline-flex;
1971
+
1972
+
1973
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1974
+ display: flex;
1975
+ justify-content: center;
1921
1976
  align-items: center;
1977
+ height: 100%;
1978
+ transition: width 0.1s;
1922
1979
  }
1923
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1924
- content: '';
1925
- display: inline-block;
1926
- width: 8px;
1927
- height: 8px;
1928
- border-radius: 50%;
1929
- background: #ff2d2d; /* red live dot */
1930
- }
1931
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1932
- color: #ffffff;
1933
- font-weight: 700;
1934
- font-size: 12px;
1935
- letter-spacing: 0.03em;
1980
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1981
+ margin: 2px;
1936
1982
  }
1937
1983
 
1938
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1939
- border-color: transparent;
1984
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1985
+ display: flex;
1986
+ justify-content: center;
1987
+ align-items: center;
1988
+ height: 100%;
1989
+ transition: width 0.1s;
1940
1990
  }
1941
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1942
- color: #ff2d2d;
1991
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1992
+ display: grid;
1993
+ font-size: 10px;
1994
+ grid-template-columns: 1fr;
1995
+ grid-template-rows: 1fr;
1996
+ padding: 1px 0px 0 0px;
1997
+ margin: 0;
1943
1998
  }
1944
1999
 
1945
- /* ---- time controls ---- */
1946
- .video-js.skin_cn_news .vjs-current-time,
1947
- .video-js.skin_cn_news .vjs-duration,
1948
- .video-js.skin_cn_news .vjs-time-divider {
1949
- display: none !important;
1950
- }
1951
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1952
- display: none;
1953
- align-items: center;
1954
- justify-content: center;
1955
- font-size: 11px;
1956
- font-weight: 700;
1957
- color: #fff;
1958
- padding: 0 6px;
1959
- user-select: none;
1960
- }
2000
+ @media (max-width: 600px) {
2001
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
2002
+ height: 5px !important;
2003
+ }
1961
2004
 
2005
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2006
+ display: none;
2007
+ }
1962
2008
 
1963
- .video-js.skin_cn_news .vjs-chapter-marker {
1964
- z-index: 2;
1965
- width: var(--vl-chapter-size, 8px);
1966
- height: var(--vl-chapter-size, 8px);
1967
- top: 50%;
1968
- bottom: auto;
1969
- background: var(--vl-chapter-color, #ffffff);
1970
- opacity: var(--vl-chapter-opacity, 1);
1971
- border-radius: 50%;
1972
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1973
- transform: translate(-50%, -50%) scale(1);
1974
- transition: background-color 0.12s ease;
1975
- }
1976
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1977
- background: var(--vl-chapter-hover, #0a5cff);
1978
- }
1979
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1980
- background: var(--vl-chapter-active, #0a5cff);
1981
2009
  }
1982
2010
 
1983
-
1984
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1985
- width: 16px;
1986
- height: 16px;
1987
- bottom: 160%;
1988
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
2011
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2012
+ content: none !important;
2013
+ fill: none !important;
2014
+ filter: none !important;
1989
2015
  }
1990
2016
 
1991
-
1992
- .video-js.skin_cn_news .vjs-chapter-preview {
1993
- background: var(--vl-chapter-tooltip, #0a5cff);
1994
- border-radius: 6px;
1995
- padding: 8px 10px;
1996
- width: max-content;
1997
- max-width: 300px;
1998
- text-align: left;
1999
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2000
- }
2001
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2002
- color: #ffffff;
2003
- font-size: 13px;
2004
- font-weight: 400;
2005
- margin-bottom: 2px;
2006
- }
2007
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2008
- color: #ffffff;
2009
- font-size: 13px;
2010
- font-weight: 400;
2011
- line-height: 1.3;
2012
- white-space: normal;
2013
- text-align: left;
2017
+ /* svg icons opacity and hover effect */
2018
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2019
+ opacity: 0.7 !important;
2014
2020
  }
2015
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2016
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2021
+
2022
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2023
+ opacity: 1 !important;
2017
2024
  }
2018
2025
 
2019
- /* ---- responsive ---- */
2020
- @media (max-width: 576px) {
2021
- .video-js.skin_cn_news .vjs-control-bar {
2022
- height: 3.2em !important;
2023
- padding: 0 8px;
2024
- }
2025
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2026
- padding: 0 6px;
2027
- }
2028
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2029
- display: none !important;
2030
- }
2026
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2027
+ color: rgba(255, 255, 2555, 0.7)!important;
2031
2028
  }
2032
2029
 
2030
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2031
+ color: rgba(255, 255, 2555, 1)!important;
2032
+ }
2033
2033
 
2034
2034
 
2035
2035
  /* CSS for videojs-dvr-seekbar */
@@ -2213,6 +2213,8 @@
2213
2213
 
2214
2214
 
2215
2215
 
2216
+
2217
+
2216
2218
  .video-js .multicamera-parent.default{
2217
2219
  height: 345px;
2218
2220
  position: absolute;
@@ -2293,7 +2295,6 @@
2293
2295
 
2294
2296
 
2295
2297
 
2296
-
2297
2298
  .vjs-custom-big-mute.vjs-control{
2298
2299
  position: absolute;
2299
2300
  align-items: center;
@@ -2342,7 +2343,6 @@
2342
2343
  width: 22px;
2343
2344
  }
2344
2345
 
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) {
@@ -3395,27 +3395,6 @@
3395
3395
  }
3396
3396
 
3397
3397
  /* Airplay end */
3398
-
3399
- div:has(> .error-container){
3400
- position: relative;
3401
- }
3402
-
3403
- .error-container{
3404
- position: absolute;
3405
- top: 0px;
3406
- width: 100%;
3407
- height: 100%;
3408
- display: flex;
3409
- flex-direction: column;
3410
- justify-content: center;
3411
- color: White;
3412
- align-items: center;
3413
- text-transform: uppercase;
3414
- }
3415
-
3416
- .error-timer-message{
3417
- margin-left: 5px;
3418
- }
3419
3398
  /* Chapter markers on the seek bar.
3420
3399
  * Uses a dedicated class (NOT .vjs-seekbar-marker) so chapter markers and SSAI
3421
3400
  * ad markers coexist without clobbering each other's clear-and-rerender. */
@@ -3425,7 +3404,8 @@ div:has(> .error-container){
3425
3404
  bottom: 0;
3426
3405
  top: 0;
3427
3406
  width: 2px;
3428
- background-color: red;
3407
+ background-color: var(--vl-chapter-color, #fff);
3408
+ opacity: var(--vl-chapter-opacity, 1);
3429
3409
  transform: translateX(-50%);
3430
3410
  pointer-events: auto; /* clickable (ad markers use none) */
3431
3411
  cursor: pointer;
@@ -3435,7 +3415,12 @@ div:has(> .error-container){
3435
3415
  justify-content: center;
3436
3416
  }
3437
3417
 
3418
+ .vjs-chapter-marker:hover {
3419
+ background-color: var(--vl-chapter-hover, #ccc);
3420
+ }
3421
+
3438
3422
  .vjs-chapter-marker.vjs-chapter-marker--active {
3423
+ background-color: var(--vl-chapter-active, #0a5cff);
3439
3424
  z-index: 3;
3440
3425
  }
3441
3426
 
@@ -3465,7 +3450,7 @@ div:has(> .error-container){
3465
3450
  bottom: 100%;
3466
3451
  margin-bottom: 12px;
3467
3452
  transform: translateX(-50%);
3468
- background: rgba(0, 0, 0, 0.85);
3453
+ background: var(--vl-chapter-tooltip, rgba(0, 0, 0, 0.85));
3469
3454
  color: #fff;
3470
3455
  border-radius: 4px;
3471
3456
  padding: 6px 8px;
@@ -3503,7 +3488,7 @@ div:has(> .error-container){
3503
3488
  height: 0;
3504
3489
  border-left: 6px solid transparent;
3505
3490
  border-right: 6px solid transparent;
3506
- border-top: 6px solid #000;
3491
+ border-top: 6px solid var(--vl-chapter-tooltip, #000);
3507
3492
  }
3508
3493
 
3509
3494
  /* Time line (negative-from-live for DVR, plain timestamp for VOD) above the label.
@@ -3513,3 +3498,25 @@ div:has(> .error-container){
3513
3498
  text-align: left;
3514
3499
  margin-bottom: 4px;
3515
3500
  }
3501
+
3502
+
3503
+ div:has(> .error-container){
3504
+ position: relative;
3505
+ }
3506
+
3507
+ .error-container{
3508
+ position: absolute;
3509
+ top: 0px;
3510
+ width: 100%;
3511
+ height: 100%;
3512
+ display: flex;
3513
+ flex-direction: column;
3514
+ justify-content: center;
3515
+ color: White;
3516
+ align-items: center;
3517
+ text-transform: uppercase;
3518
+ }
3519
+
3520
+ .error-timer-message{
3521
+ margin-left: 5px;
3522
+ }