@viewlift/player-backup 2.0.283-backup → 2.0.285-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 (104) hide show
  1. package/cjs/autoNextVideo-6cab8d20.js +1 -0
  2. package/cjs/bundle.css +819 -606
  3. package/cjs/{caption-settings-544fd444.js → caption-settings-058ad013.js} +1 -1
  4. package/cjs/{captions-80f6eb66.js → captions-d98c49d6.js} +1 -1
  5. package/cjs/{features-90760526.js → features-d42cd8c1.js} +1 -1
  6. package/cjs/generic-9239e4ef.js +1 -0
  7. package/cjs/{index-0cb8083b.js → index-50e69a99.js} +1 -1
  8. package/cjs/{index-ee7aefc5.js → index-5daec8dc.js} +1 -1
  9. package/cjs/index-add7cff5.js +1 -0
  10. package/cjs/index.js +1 -1
  11. package/cjs/{multicamv2-7a2f60f1.js → multicamv2-1af47226.js} +1 -1
  12. package/cjs/{multicamv2-ee93bf7c.js → multicamv2-b1a591f5.js} +1 -1
  13. package/cjs/{nextEpisodeButton-9b032064.js → nextEpisodeButton-f6da5f9e.js} +1 -1
  14. package/cjs/playlist-25247b47.js +1 -0
  15. package/cjs/relatedVideosManager-88017db2.js +1 -0
  16. package/cjs/{renditions-d28715a3.js → renditions-6554142b.js} +1 -1
  17. package/cjs/{resolution-948774b8.js → resolution-4c007d14.js} +1 -1
  18. package/cjs/{series-31cb5b5e.js → series-c6abeb2a.js} +1 -1
  19. package/cjs/series-v2-370da4d6.js +1 -0
  20. package/cjs/series-v2-a347f3f7.js +1 -0
  21. package/cjs/{settings-icon-7a7e7810.js → settings-icon-0dcc3788.js} +1 -1
  22. package/cjs/{skin-a54370b0.js → skin-0a5108bb.js} +1 -1
  23. package/cjs/skin-47343a57.js +1 -0
  24. package/cjs/skin-56d77491.js +1 -0
  25. package/cjs/skin-71dbfc33.js +1 -0
  26. package/cjs/skin-89ad761c.js +1 -0
  27. package/cjs/{skin-a7446a3b.js → skin-a904ce92.js} +1 -1
  28. package/cjs/skin-cebece82.js +1 -0
  29. package/cjs/{skin-b151359d.js → skin-dfd8c833.js} +1 -1
  30. package/cjs/{skin-c97f0eea.js → skin-e0cf4554.js} +1 -1
  31. package/cjs/{skin-a193390e.js → skin-f3a5fe3d.js} +1 -1
  32. package/cjs/util-9e6f986e.js +1 -0
  33. package/cjs/videoSelector-24f40272.js +1 -0
  34. package/cjs/videoSelector-f49496de.js +1 -0
  35. package/esm/autoNextVideo-be06e737.js +1 -0
  36. package/esm/bundle.css +819 -606
  37. package/esm/{caption-settings-106547c2.js → caption-settings-a9b6581e.js} +1 -1
  38. package/esm/{captions-2b4caf69.js → captions-9659ee8f.js} +1 -1
  39. package/esm/components/auto-next-video/autoNextVideo.d.ts +1 -0
  40. package/esm/components/video-selector/videoSelector.d.ts +4 -0
  41. package/esm/components/video-selector_TEMP/videoSelector.d.ts +4 -0
  42. package/esm/{features-abc1af35.js → features-4a5d71b3.js} +1 -1
  43. package/esm/generic-5fc25fa4.js +1 -0
  44. package/esm/helpers/skin.d.ts +1 -1
  45. package/esm/{icons-699e8cf0.js → icons-262bef63.js} +1 -1
  46. package/esm/{index-7f9c8eec.js → index-b62e0f74.js} +1 -1
  47. package/esm/{index-209acda5.js → index-c9e6b4b1.js} +1 -1
  48. package/esm/index-d83589e3.js +1 -0
  49. package/esm/index.d.ts +6 -0
  50. package/esm/index.js +1 -1
  51. package/esm/{multicamv2-febf5390.js → multicamv2-85a146f1.js} +1 -1
  52. package/esm/{multicamv2-587a5bc1.js → multicamv2-a74f52dc.js} +1 -1
  53. package/esm/{nextEpisodeButton-9cb4a256.js → nextEpisodeButton-4d4f981f.js} +1 -1
  54. package/esm/playlist-de8dcaf0.js +1 -0
  55. package/esm/relatedVideosManager-33634c11.js +1 -0
  56. package/esm/{renditions-19f0b3a9.js → renditions-4eddc06a.js} +1 -1
  57. package/esm/{resolution-56c85eaf.js → resolution-5926bb20.js} +1 -1
  58. package/esm/{series-26c7f982.js → series-a6e346df.js} +1 -1
  59. package/esm/series-v2-58f8f89a.js +1 -0
  60. package/esm/series-v2-8e6a3475.js +1 -0
  61. package/esm/{settings-icon-0de53818.js → settings-icon-c4e124b8.js} +1 -1
  62. package/esm/{skin-96f7cd4c.js → skin-07c5b42b.js} +1 -1
  63. package/esm/{skin-1331a0e5.js → skin-132a3fbe.js} +1 -1
  64. package/esm/{skin-49365d5b.js → skin-30c770e0.js} +1 -1
  65. package/esm/{skin-c1f9b537.js → skin-5fd8f1a1.js} +1 -1
  66. package/esm/skin-80a68255.js +1 -0
  67. package/esm/skin-876554ba.js +1 -0
  68. package/esm/skin-900c1bca.js +1 -0
  69. package/esm/skin-97dd73c4.js +1 -0
  70. package/{cjs/skin-24348af6.js → esm/skin-ae76c8c8.js} +1 -1
  71. package/esm/skin-e2592aa4.js +1 -0
  72. package/esm/util-8d51abc3.js +1 -0
  73. package/esm/utilities/relatedVideosManager.d.ts +11 -0
  74. package/esm/videoSelector-11ca5611.js +1 -0
  75. package/esm/videoSelector-38875a2f.js +1 -0
  76. package/package.json +1 -1
  77. package/cjs/autoNextVideo-fe71c875.js +0 -1
  78. package/cjs/generic-b0efda72.js +0 -1
  79. package/cjs/index-3bdc6d4e.js +0 -1
  80. package/cjs/index-8c9f1a67.js +0 -1
  81. package/cjs/playlist-c9565f07.js +0 -1
  82. package/cjs/series-v2-66bb2be2.js +0 -1
  83. package/cjs/series-v2-e74b725b.js +0 -1
  84. package/cjs/skin-3dd98a5f.js +0 -1
  85. package/cjs/skin-667cd458.js +0 -1
  86. package/cjs/skin-90c61d0a.js +0 -1
  87. package/cjs/skin-cfd6c675.js +0 -1
  88. package/cjs/videoSelector-3f4ee7e2.js +0 -1
  89. package/cjs/videoSelector-c824876b.js +0 -1
  90. package/esm/autoNextVideo-efd28455.js +0 -1
  91. package/esm/generic-bd7427c4.js +0 -1
  92. package/esm/index-95713239.js +0 -1
  93. package/esm/index-c3dfd0f5.js +0 -1
  94. package/esm/playlist-92500990.js +0 -1
  95. package/esm/series-v2-5993fd16.js +0 -1
  96. package/esm/series-v2-c71b9a69.js +0 -1
  97. package/esm/skin-1b825a55.js +0 -1
  98. package/esm/skin-1c513653.js +0 -1
  99. package/esm/skin-4f84b841.js +0 -1
  100. package/esm/skin-5419c4aa.js +0 -1
  101. package/esm/skin-b0ba54c4.js +0 -1
  102. package/esm/skin-f6e1b28e.js +0 -1
  103. package/esm/videoSelector-aef83393.js +0 -1
  104. package/esm/videoSelector-f9366913.js +0 -1
package/esm/bundle.css CHANGED
@@ -1,31 +1,33 @@
1
1
 
2
2
 
3
3
 
4
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
4
+
5
+
6
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
5
7
  font-size: 2.2em;
6
8
  line-height: 2.6;
7
9
  }
8
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
9
- background: white;
10
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
11
+ background: #fcb700;
10
12
  }
11
- .video-js.skin_news .vjs-control-bar{
13
+ .video-js.skin_news_live .vjs-control-bar{
12
14
  z-index: 1 !important;
13
15
  height: 5em !important;
14
16
  background: black !important;
15
17
  }
16
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
18
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
17
19
  display: flex;
18
20
  align-items: center;
19
21
  justify-content: center;
20
22
  }
21
23
 
22
- .video-js.skin_news .vjs-fade>* {
24
+ .video-js.skin_news_live .vjs-fade>* {
23
25
  visibility: hidden !important;
24
26
  opacity: 0 !important;
25
27
  transition: visibility 1s, opacity 1s !important;
26
28
  }
27
29
 
28
- .video-js.skin_news .custom-spaced-progress-bar {
30
+ .video-js.skin_news_live .custom-spaced-progress-bar {
29
31
  position: absolute;
30
32
  width: 100%;
31
33
  display: flex;
@@ -33,7 +35,7 @@
33
35
  top: -0.5em;
34
36
  }
35
37
 
36
- .video-js.skin_news .vjs-progress-control {
38
+ .video-js.skin_news_live .vjs-progress-control {
37
39
  /* left: -6px; */
38
40
  position: relative;
39
41
  width: 100%;
@@ -41,22 +43,25 @@
41
43
  transition: height 0.1s, top 0.1s;
42
44
  }
43
45
 
46
+ .video-js.skin_news_live .vjs-volume-panel{
47
+ min-width: 5.3em;
48
+ }
44
49
 
45
50
 
46
51
 
47
- .video-js.skin_news .vjs-custom-control-spacer {
48
- display: block;
49
- flex: 1 1 auto;
52
+ .video-js.skin_news_live .vjs-custom-control-spacer {
53
+ /* display: block; */
54
+ /* flex: 1 1 auto; */
50
55
  }
51
56
 
52
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
57
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
53
58
  margin: 0 0px 0 0px;
54
59
  }
55
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
60
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
56
61
  display: none;
57
62
  }
58
63
 
59
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
64
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
60
65
  font-size: 14px;
61
66
  font-weight: 500;
62
67
  align-self: center;
@@ -65,30 +70,30 @@
65
70
  border-radius: 8px;
66
71
  }
67
72
 
68
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
73
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
69
74
  height: 6px !important;
70
75
  }
71
76
 
72
- .video-js.skin_news .vjs-play-progress:before {
77
+ .video-js.skin_news_live .vjs-play-progress:before {
73
78
  font-size: 1.5em;
74
79
  line-height: unset;
75
80
  top: -0.3333333333em;
76
81
  }
77
82
 
78
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
83
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
79
84
  display: none !important;
80
85
  }
81
86
 
82
87
  /* */
83
- .video-js.skin_news .vjs-mouse-display{
88
+ .video-js.skin_news_live .vjs-mouse-display{
84
89
  font-size: 1.6666666667em;
85
90
  }
86
91
 
87
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
92
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
88
93
  font-size: 1em !important;
89
94
  }
90
95
 
91
- .video-js.skin_news .vjs-button{
96
+ .video-js.skin_news_live .vjs-button{
92
97
  width: 5.3em;
93
98
  display: flex;
94
99
  align-items: center;
@@ -96,63 +101,71 @@
96
101
  }
97
102
 
98
103
 
99
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
104
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
100
105
  .icon-maximize {
101
106
  display: block;
102
107
  height: 32px;
103
108
  }
104
109
 
105
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
110
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
106
111
  line-height: 4;
107
112
  }
108
113
 
109
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
114
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
110
115
  .icon-minimize {
111
116
  display: none;
112
117
  height: 32px;
113
118
  }
114
119
 
115
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
120
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
116
121
  outline: none !important;
122
+ /* flex: 1; */
117
123
  }
118
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
124
+ .video-js.skin_news_live .vjs-play-toggle-container{
125
+ display: flex;
126
+ flex: 1;
127
+ justify-content: center;
128
+ }
129
+
130
+
131
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
119
132
  .vjs-icon-fullscreen-enter:before {
120
133
  /* content: '' !important; */
121
134
  }
122
135
 
123
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
136
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
124
137
  display: flex;
125
138
  justify-content: center;
126
139
  align-items: center;
127
140
  /* transform: rotate(90deg); */
128
141
  }
129
142
 
130
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
143
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
131
144
  display: none;
132
145
  }
133
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
146
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
134
147
  margin-left: -10px;
135
148
  }
136
149
 
137
- .video-js.skin_news .skipbtn:hover{
150
+ .video-js.skin_news_live .skipbtn:hover{
138
151
  cursor: pointer;
139
152
  }
140
153
 
141
- .video-js.skin_news .rewindbtn:hover{
154
+ .video-js.skin_news_live .rewindbtn:hover{
142
155
  cursor: pointer;
143
156
  }
144
157
 
145
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
158
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
146
159
  position: relative;
147
160
  padding-left: 0;
148
161
  }
149
162
 
150
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
163
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
151
164
  display: none !important;
152
165
  }
153
166
 
154
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
155
- width: 90px;
167
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
168
+ /* width: 90px;
156
169
  height: 90px;
157
170
  display: flex;
158
171
  justify-content: center;
@@ -167,19 +180,20 @@
167
180
  font-size: 6em;
168
181
  line-height: 1.4em;
169
182
  border: 0.05em solid;
170
- color: inherit;
183
+ color: inherit; */
184
+ display: none !important;
171
185
  }
172
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
186
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
173
187
  font-weight: bold;
174
188
  }
175
189
 
176
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
190
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
177
191
  bottom: 2.4em !important;
178
192
  right: -1em;
179
193
  z-index: 1;
180
194
  }
181
195
 
182
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
196
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
183
197
  width: 24px !important;
184
198
  height: 24px !important;
185
199
  }
@@ -189,34 +203,34 @@
189
203
  }
190
204
 
191
205
 
192
- .video-js.skin_news button.vjs-rewind-button{
206
+ .video-js.skin_news_live button.vjs-rewind-button{
193
207
  cursor: pointer;
194
208
  }
195
209
 
196
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
210
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
197
211
  padding-right: 0;
212
+ display: none;
198
213
  }
199
214
 
200
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
215
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
201
216
  padding-left: 0;
217
+ display: none;
202
218
  }
203
219
 
204
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
220
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
205
221
  padding-left: 0;
206
222
  padding-right: 0;
207
- display: flex;
208
- justify-content: center;
209
- width: min-content;
223
+ display: none;
210
224
  }
211
225
 
212
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
226
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
213
227
  display: none
214
228
  }
215
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
229
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
216
230
  display: none
217
231
  }
218
232
 
219
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
233
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
220
234
  display: flex;
221
235
  align-items: center;
222
236
  font-weight: 700;
@@ -224,26 +238,26 @@
224
238
  min-width: 1.2em;
225
239
  }
226
240
 
227
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
241
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
228
242
  display: none;
229
243
  font-size: 11px;
230
244
  justify-content: center;
231
245
  align-items: center;
232
246
  user-select: none;
233
247
  }
234
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
248
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
235
249
  display: none;
236
250
  }
237
251
 
238
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
252
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
239
253
  height: min-content;
240
254
  width: min-content;
241
255
  }
242
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
256
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
243
257
  width: 6em;
244
258
  }
245
259
 
246
- .video-js.skin_news .content{
260
+ .video-js.skin_news_live .content{
247
261
  bottom: 3.4rem !important;
248
262
  right: -4rem !important;
249
263
  }
@@ -262,15 +276,16 @@
262
276
  pointer-events:none
263
277
  }
264
278
 
265
- .video-js.skin_news iframe{
279
+ .video-js.skin_news_live iframe{
266
280
  width: 100%;
267
281
  height: 100%;
268
282
  }
269
283
 
270
- .video-js.skin_news .vjs-live-control{
284
+ .video-js.skin_news_live .vjs-live-control{
271
285
  align-items: center;
286
+ display: none;
272
287
  }
273
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
288
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
274
289
  height: 2.2em;
275
290
  display: flex;
276
291
  align-items: center;
@@ -281,43 +296,22 @@
281
296
  margin: 4px 0px 4px 12px;
282
297
  }
283
298
 
284
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
299
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
285
300
  text-shadow: none;
286
301
  }
287
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
288
- display: none;
289
- font-size: 12px;
290
- }
291
302
 
292
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
293
- height: 2.2em;
294
- display: inline-flex;
295
- align-items: center;
296
- /* font-family: monospace; */
303
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
304
+ display: flex;
297
305
  justify-content: center;
298
- border: 2px solid;
299
- margin: 4px 0px 4px 6px;
300
- white-space: pre;
301
- padding: 0px 6px;
302
- font-size: 1.2em;
303
- font-weight: 500;
304
- color: rgba(255, 255, 2555, 0.7);
305
-
306
- letter-spacing: -.1px;
307
- line-height: normal;
308
- text-transform: uppercase;
309
- color: #FFFFFF;
310
- opacity: .7;
311
- font-family: "Proxima Nova";
306
+ min-width: 5.3em;
307
+ pointer-events: none;
308
+ user-select: none;
312
309
  }
313
310
 
314
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
315
- opacity: 1;
311
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
312
+ color: white;
316
313
  }
317
314
 
318
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
319
- content: "NOT LIVE";
320
- }
321
315
 
322
316
  .settings-selection.vjs-control.vjs-button{
323
317
  display: flex !important;
@@ -334,57 +328,57 @@
334
328
  .tvProviderImage{
335
329
  display: none
336
330
  }
337
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
331
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
338
332
  .icon-maximize {
339
333
  height: 30px !important;
340
334
  }
341
335
 
342
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
336
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
343
337
  .icon-minimize {
344
338
  height: 30px !important;
345
339
  }
346
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
340
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
347
341
  width: 4.5em;
348
342
  }
349
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
343
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
350
344
  height: min-content;
351
345
  }
352
346
 
353
- .video-js.skin_news button.vjs-slowmo-button{
347
+ .video-js.skin_news_live button.vjs-slowmo-button{
354
348
  display: none;
355
349
  }
356
- .video-js.skin_news button.vjs-rewind-button{
350
+ .video-js.skin_news_live button.vjs-rewind-button{
357
351
  display: none;
358
352
  }
359
- .video-js.skin_news button.vjs-rewind-button>svg{
353
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
360
354
  height: 20px;
361
355
  }
362
- .video-js.skin_news .vjs-button{
356
+ .video-js.skin_news_live .vjs-button{
363
357
  width: 4.8em;
364
358
  }
365
- .video-js.skin_news .widget-selection{
359
+ .video-js.skin_news_live .widget-selection{
366
360
  display: none;
367
361
  }
368
- .video-js.skin_news .container{
362
+ .video-js.skin_news_live .container{
369
363
  display: none !important;
370
364
  }
371
- .video-js.skin_news .vjs-control-bar{
365
+ .video-js.skin_news_live .vjs-control-bar{
372
366
  height: 4em !important;
373
367
  }
374
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
368
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
375
369
  font-size: 2.5em;
376
370
  line-height: 1.5;
377
371
  }
378
- .video-js.skin_news .vjs-play-progress:before {
372
+ .video-js.skin_news_live .vjs-play-progress:before {
379
373
  font-size: 1.2em;
380
374
  position: absolute;
381
375
  right: -0.5em;
382
376
  z-index: 1;
383
377
  }
384
- .video-js.skin_news button.vjs-skip-button>svg{
378
+ .video-js.skin_news_live button.vjs-skip-button>svg{
385
379
  height: 20px;
386
380
  }
387
- .video-js.skin_news button.vjs-big-play-button {
381
+ .video-js.skin_news_live button.vjs-big-play-button {
388
382
  width: 50px !important;
389
383
  height: 50px !important;
390
384
  font-size: 2.1rem !important;
@@ -394,17 +388,17 @@
394
388
  width: 24px;
395
389
  height: 24px;
396
390
  }
397
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
391
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
398
392
  margin: 0 12px 0 12px;
399
393
  }
400
- .video-js.skin_news .vjs-seek-to-live-text{
394
+ .video-js.skin_news_live .vjs-seek-to-live-text{
401
395
  font-size: 12px;
402
396
  }
403
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
397
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
404
398
  margin: 0 12px 0 12px;
405
399
  }
406
400
  }
407
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
401
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
408
402
  width: 90px;
409
403
  height: 90px;
410
404
  display: flex;
@@ -421,7 +415,7 @@
421
415
  line-height: 1.4em;
422
416
  }
423
417
 
424
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
418
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
425
419
  display: flex;
426
420
  justify-content: center;
427
421
  align-items: center;
@@ -429,29 +423,22 @@
429
423
  transition: width 0.1s;
430
424
  }
431
425
 
432
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
426
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
433
427
  display: flex;
434
428
  justify-content: center;
435
429
  align-items: center;
436
430
  height: 100%;
437
431
  transition: width 0.1s;
438
432
  }
439
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
433
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
440
434
  display: none !important;
441
435
  }
442
- .video-js.skin_news .ssai-ad-container{
443
- position: absolute;
444
- bottom: 14px;
445
- }
446
436
 
447
437
  @media (max-width: 576px) {
448
- .video-js.skin_news .ssai-ad-container{
449
- bottom: 2px;
450
- }
451
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
438
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
452
439
  height: 5px !important;
453
440
  }
454
- .video-js.skin_news button.vjs-big-play-button {
441
+ .video-js.skin_news_live button.vjs-big-play-button {
455
442
  width: 50px !important;
456
443
  height: 50px !important;
457
444
  font-size: 2.1rem !important;
@@ -460,95 +447,89 @@
460
447
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
461
448
  display: none;
462
449
  }
463
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
450
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
464
451
  bottom: 2.4em !important;
465
452
  right: -1em;
466
453
  z-index: 1;
467
454
  }
468
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
455
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
469
456
  display: none !important;
470
457
  }
471
458
 
472
- .video-js.skin_news .vjs-text-track-display-ttml span {
459
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
473
460
  color: white !important;
474
461
  font-size: 13px !important;
475
462
  background-color: black !important;
476
463
  }
477
464
  }
478
465
 
479
- .video-js.skin_news .vjs-text-track-display-ttml span {
466
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
467
+ width: 100% !important;
468
+ }
469
+
470
+ .video-js.skin_news_live .vjs-text-track-display-ttml span {
480
471
  color: white !important;
481
472
  font-size: 16px !important;
482
473
  background-color: black !important;
483
474
  }
484
475
 
485
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
476
+ .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
486
477
  margin-bottom: 2rem !important;
487
478
  }
488
479
 
489
- .video-js.skin_news .vjs-text-track-display-ttml p {
480
+ .video-js.skin_news_live .vjs-text-track-display-ttml p {
490
481
  font-size: 18px !important;
491
482
  }
492
483
 
493
484
 
494
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
495
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
485
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
486
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
496
487
  font-size: 1.2em !important;
497
488
  line-height: 1.5em !important;
498
489
  padding: 0.2em 0.8em !important;
499
490
  }
500
491
 
501
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
492
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
502
493
  content: none !important;
503
494
  fill: none !important;
504
495
  filter: none !important;
505
496
  }
506
497
 
507
- /* svg icons opacity and hover effect */
508
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
509
- opacity: 0.7 !important;
498
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
499
+ color: rgba(255, 255, 2555, 0.7)!important;
510
500
  }
511
501
 
512
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
513
- opacity: 1 !important;
514
- }
515
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
516
- opacity: 0.7 !important;
517
- }
518
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
519
- opacity: 1 !important;
520
- }
521
-
522
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
523
- color: rgba(255, 255, 2555, 0.7)!important;
524
- }
525
-
526
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
527
- color: rgba(255, 255, 2555, 1)!important;
502
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
503
+ color: rgba(255, 255, 2555, 1)!important;
528
504
  }
529
505
 
530
506
 
531
507
 
532
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
508
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
533
509
  font-size: 2.2em;
534
510
  line-height: 2.6;
535
511
  }
536
- .video-js.skin_mini{
537
- overflow: hidden;
512
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
513
+ background: white;
538
514
  }
539
- .video-js.skin_mini .vjs-control-bar{
515
+ .video-js.skin_news .vjs-control-bar{
540
516
  z-index: 1 !important;
541
- height: 4em !important;
517
+ height: 5em !important;
542
518
  background: black !important;
543
519
  }
520
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
521
+ display: flex;
522
+ align-items: center;
523
+ justify-content: center;
524
+ }
544
525
 
545
- .video-js.skin_mini .vjs-fade>* {
526
+ .video-js.skin_news .vjs-fade>* {
546
527
  visibility: hidden !important;
547
528
  opacity: 0 !important;
548
529
  transition: visibility 1s, opacity 1s !important;
549
530
  }
550
531
 
551
- .video-js.skin_mini .custom-spaced-progress-bar {
532
+ .video-js.skin_news .custom-spaced-progress-bar {
552
533
  position: absolute;
553
534
  width: 100%;
554
535
  display: flex;
@@ -556,7 +537,7 @@
556
537
  top: -0.5em;
557
538
  }
558
539
 
559
- .video-js.skin_mini .vjs-progress-control {
540
+ .video-js.skin_news .vjs-progress-control {
560
541
  /* left: -6px; */
561
542
  position: relative;
562
543
  width: 100%;
@@ -567,19 +548,19 @@
567
548
 
568
549
 
569
550
 
570
- .video-js.skin_mini .vjs-custom-control-spacer {
551
+ .video-js.skin_news .vjs-custom-control-spacer {
571
552
  display: block;
572
553
  flex: 1 1 auto;
573
554
  }
574
555
 
575
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
556
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
576
557
  margin: 0 0px 0 0px;
577
558
  }
578
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
559
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
579
560
  display: none;
580
561
  }
581
562
 
582
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
563
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
583
564
  font-size: 14px;
584
565
  font-weight: 500;
585
566
  align-self: center;
@@ -588,158 +569,143 @@
588
569
  border-radius: 8px;
589
570
  }
590
571
 
591
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
592
- height: 5px !important;
572
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
573
+ height: 6px !important;
593
574
  }
594
575
 
595
- .video-js.skin_mini .vjs-play-progress:before {
596
- font-size: 1.3em;
576
+ .video-js.skin_news .vjs-play-progress:before {
577
+ font-size: 1.5em;
597
578
  line-height: unset;
598
579
  top: -0.3333333333em;
599
580
  }
600
581
 
601
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
582
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
602
583
  display: none !important;
603
584
  }
604
585
 
605
586
  /* */
606
- .video-js.skin_mini .vjs-mouse-display{
587
+ .video-js.skin_news .vjs-mouse-display{
607
588
  font-size: 1.6666666667em;
608
589
  }
609
590
 
610
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
591
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
611
592
  font-size: 1em !important;
612
593
  }
613
594
 
614
- .video-js.skin_mini .vjs-button{
615
- width: 3em;
595
+ .video-js.skin_news .vjs-button{
596
+ width: 5.3em;
616
597
  display: flex;
617
598
  align-items: center;
618
599
  justify-content: center;
619
600
  }
620
601
 
621
602
 
622
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
603
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
623
604
  .icon-maximize {
624
605
  display: block;
625
606
  height: 32px;
626
607
  }
627
608
 
628
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
609
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
629
610
  line-height: 4;
630
611
  }
631
612
 
632
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
613
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
633
614
  .icon-minimize {
634
615
  display: none;
635
616
  height: 32px;
636
617
  }
637
618
 
638
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
619
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
639
620
  outline: none !important;
640
621
  }
641
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
622
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
642
623
  .vjs-icon-fullscreen-enter:before {
643
624
  /* content: '' !important; */
644
625
  }
645
626
 
646
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
627
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
647
628
  display: flex;
648
629
  justify-content: center;
649
630
  align-items: center;
650
631
  /* transform: rotate(90deg); */
651
632
  }
652
633
 
653
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
634
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
654
635
  display: none;
655
636
  }
656
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
637
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
657
638
  margin-left: -10px;
658
- display: none;
659
- }
660
-
661
- .video-js.skin_mini .vjs-loading-spinner {
662
- position: absolute;
663
- top: 50%;
664
- left: 50%;
665
- transform: translate(-50%, -50%);
666
- opacity: .85;
667
- text-align: left;
668
- border: .2em solid rgba(43, 51, 63, .7);
669
- box-sizing: border-box;
670
- background-clip: padding-box;
671
- width: 3em;
672
- height: 3em;
673
- border-radius: 50%;
674
- visibility: hidden;
675
639
  }
676
640
 
677
- .video-js.skin_mini .skipbtn:hover{
641
+ .video-js.skin_news .skipbtn:hover{
678
642
  cursor: pointer;
679
643
  }
680
644
 
681
- .video-js.skin_mini .rewindbtn:hover{
645
+ .video-js.skin_news .rewindbtn:hover{
682
646
  cursor: pointer;
683
647
  }
684
648
 
685
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
649
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
686
650
  position: relative;
687
651
  padding-left: 0;
688
652
  }
689
653
 
690
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
691
- width: 40px;
692
- height: 40px;
693
- display: flex;
694
- justify-content: center;
695
- align-items: center;
696
- border: none;
697
- position: absolute;
698
- top: 0;
699
- left: 0;
700
- right: 0;
701
- bottom: 0;
702
- margin: auto;
703
- font-size: 3em;
704
- line-height: 1.3em;
705
- transform: none !important;
706
- border-radius: 1.3em;
654
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
655
+ display: none !important;
707
656
  }
708
657
 
709
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
658
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
659
+ width: 90px;
660
+ height: 90px;
661
+ display: flex;
662
+ justify-content: center;
663
+ align-items: center;
664
+ border-radius: 50%;
665
+ position: absolute;
666
+ top: 0;
667
+ left: 0;
668
+ right: 0;
669
+ bottom: 0;
670
+ margin: auto;
671
+ font-size: 6em;
672
+ line-height: 1.4em;
673
+ border: 0.05em solid;
674
+ color: inherit;
675
+ }
676
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
710
677
  font-weight: bold;
711
678
  }
712
679
 
713
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
714
- bottom: 1.1em !important;
715
- right: 1em;
680
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
681
+ bottom: 2.4em !important;
682
+ right: -1em;
716
683
  z-index: 1;
717
- font-size: 10px;
718
684
  }
719
685
 
720
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
686
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
721
687
  width: 24px !important;
722
688
  height: 24px !important;
723
689
  }
724
- .video-js.skin_mini .settings-selector-icon>svg{
690
+ .settings-selector-icon>svg{
725
691
  height: 19px !important;
726
692
  width: 19px !important;
727
693
  }
728
694
 
729
695
 
730
- .video-js.skin_mini button.vjs-rewind-button{
696
+ .video-js.skin_news button.vjs-rewind-button{
731
697
  cursor: pointer;
732
698
  }
733
699
 
734
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
700
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
735
701
  padding-right: 0;
736
702
  }
737
703
 
738
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
704
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
739
705
  padding-left: 0;
740
706
  }
741
707
 
742
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
708
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
743
709
  padding-left: 0;
744
710
  padding-right: 0;
745
711
  display: flex;
@@ -747,48 +713,46 @@
747
713
  width: min-content;
748
714
  }
749
715
 
750
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
716
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
751
717
  display: none
752
718
  }
753
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
719
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
754
720
  display: none
755
721
  }
756
722
 
757
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
758
- display: flex;
759
- align-items: center;
760
- font-weight: 700;
761
- font-size: 9px;
762
- min-width: 0.8em;
763
- padding-left: 0;
723
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
724
+ display: flex;
725
+ align-items: center;
726
+ font-weight: 700;
727
+ font-size: 12px;
728
+ min-width: 1.2em;
764
729
  }
765
730
 
766
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
731
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
767
732
  display: none;
768
733
  font-size: 11px;
769
734
  justify-content: center;
770
735
  align-items: center;
771
736
  user-select: none;
772
737
  }
773
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
738
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
774
739
  display: none;
775
740
  }
776
741
 
777
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
742
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
778
743
  height: min-content;
779
744
  width: min-content;
780
745
  }
781
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
782
- width: 3em;
783
- margin-right: 4px;
746
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
747
+ width: 6em;
784
748
  }
785
749
 
786
- .video-js.skin_mini .content{
750
+ .video-js.skin_news .content{
787
751
  bottom: 3.4rem !important;
788
752
  right: -4rem !important;
789
753
  }
790
754
 
791
- .video-js.skin_mini .setting-icon > svg{
755
+ .setting-icon > svg{
792
756
  height:18px !important;
793
757
  }
794
758
 
@@ -802,16 +766,15 @@
802
766
  pointer-events:none
803
767
  }
804
768
 
805
- .video-js.skin_mini iframe{
769
+ .video-js.skin_news iframe{
806
770
  width: 100%;
807
771
  height: 100%;
808
772
  }
809
773
 
810
- .video-js.skin_mini .vjs-live-control{
774
+ .video-js.skin_news .vjs-live-control{
811
775
  align-items: center;
812
- max-width: 5em;
813
776
  }
814
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
777
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
815
778
  height: 2.2em;
816
779
  display: flex;
817
780
  align-items: center;
@@ -819,212 +782,277 @@
819
782
  width: 4em;
820
783
  justify-content: center;
821
784
  background: red;
822
- margin: 4px 0px 4px 2px;
785
+ margin: 4px 0px 4px 12px;
823
786
  }
824
787
 
825
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
788
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
826
789
  text-shadow: none;
827
790
  }
828
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
791
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
829
792
  display: none;
830
793
  font-size: 12px;
831
794
  }
832
795
 
833
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
834
- height: 1.8em;
796
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
797
+ height: 2.2em;
835
798
  display: inline-flex;
836
799
  align-items: center;
837
- font-family: monospace;
800
+ /* font-family: monospace; */
838
801
  justify-content: center;
839
- border: 1.5px solid;
840
- margin: 4px 0px 4px 2px;
802
+ border: 2px solid;
803
+ margin: 4px 0px 4px 6px;
841
804
  white-space: pre;
842
- padding: 2px 4px;
805
+ padding: 0px 6px;
843
806
  font-size: 1.2em;
844
807
  font-weight: 500;
845
808
  color: rgba(255, 255, 2555, 0.7);
809
+
810
+ letter-spacing: -.1px;
811
+ line-height: normal;
812
+ text-transform: uppercase;
813
+ color: #FFFFFF;
814
+ opacity: .7;
815
+ font-family: "Proxima Nova";
846
816
  }
847
817
 
848
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
818
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
819
+ opacity: 1;
820
+ }
821
+
822
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
849
823
  content: "NOT LIVE";
850
- word-spacing: -4px;
824
+ }
825
+
826
+ .settings-selection.vjs-control.vjs-button{
827
+ display: flex !important;
828
+ }
829
+
830
+ @media(max-width:576px){
831
+ .settings-selection.vjs-control.vjs-button{
832
+ display: none !important;
833
+ }
851
834
  }
852
835
 
853
836
 
854
- @media(max-width:600px){
837
+ @media(max-width:576px){
855
838
  .tvProviderImage{
856
839
  display: none
857
840
  }
858
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
841
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
859
842
  .icon-maximize {
860
843
  height: 30px !important;
861
844
  }
862
845
 
863
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
846
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
864
847
  .icon-minimize {
865
848
  height: 30px !important;
866
849
  }
867
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
868
- width: 3.5em;
850
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
851
+ width: 4.5em;
869
852
  }
870
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
853
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
871
854
  height: min-content;
872
855
  }
873
856
 
874
- .video-js.skin_mini button.vjs-slowmo-button{
857
+ .video-js.skin_news button.vjs-slowmo-button{
875
858
  display: none;
876
859
  }
877
- .video-js.skin_mini button.vjs-rewind-button{
860
+ .video-js.skin_news button.vjs-rewind-button{
878
861
  display: none;
879
862
  }
880
- .video-js.skin_mini button.vjs-rewind-button>svg{
863
+ .video-js.skin_news button.vjs-rewind-button>svg{
881
864
  height: 20px;
882
865
  }
883
- .video-js.skin_mini .vjs-button{
884
- width: 3em;
866
+ .video-js.skin_news .vjs-button{
867
+ width: 4.8em;
885
868
  }
886
- .video-js.skin_mini .widget-selection{
869
+ .video-js.skin_news .widget-selection{
887
870
  display: none;
888
871
  }
889
- .video-js.skin_mini .container{
872
+ .video-js.skin_news .container{
890
873
  display: none !important;
891
874
  }
892
- .video-js.skin_mini .vjs-control-bar{
875
+ .video-js.skin_news .vjs-control-bar{
893
876
  height: 4em !important;
894
877
  }
895
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
878
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
896
879
  font-size: 2.5em;
897
880
  line-height: 1.5;
898
881
  }
899
- .video-js.skin_mini .vjs-play-progress:before {
882
+ .video-js.skin_news .vjs-play-progress:before {
900
883
  font-size: 1.2em;
901
884
  position: absolute;
902
885
  right: -0.5em;
903
886
  z-index: 1;
904
887
  }
905
- .video-js.skin_mini button.vjs-skip-button>svg{
888
+ .video-js.skin_news button.vjs-skip-button>svg{
906
889
  height: 20px;
907
890
  }
891
+ .video-js.skin_news button.vjs-big-play-button {
892
+ width: 50px !important;
893
+ height: 50px !important;
894
+ font-size: 2.1rem !important;
895
+ }
908
896
 
909
897
  .stream-selector-icon>svg{
910
898
  width: 24px;
911
899
  height: 24px;
912
900
  }
913
- .video-js.skin_mini .vjs-seek-to-live-text{
914
- font-size: 12px;
901
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
902
+ margin: 0 12px 0 12px;
915
903
  }
916
-
917
- .video-js.skin_mini .vjs-text-track-display-ttml span {
918
- color: white !important;
919
- font-size: 16px !important;
920
- background-color: rgba(0,0,0,0.2) !important;
921
- }
904
+ .video-js.skin_news .vjs-seek-to-live-text{
905
+ font-size: 12px;
922
906
  }
923
-
924
- .video-js.skin_mini .vjs-text-track-display-ttml span {
925
- color: white !important;
926
- font-size: 16px !important;
927
- background-color: rgba(0,0,0,0.2) !important;
907
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
908
+ margin: 0 12px 0 12px;
928
909
  }
929
-
930
- .video-js.skin_mini .vjs-text-track-display-ttml p {
931
- font-size: 18px !important;
932
910
  }
933
-
934
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
935
- margin-bottom: 1rem !important;
911
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
912
+ width: 90px;
913
+ height: 90px;
914
+ display: flex;
915
+ justify-content: center;
916
+ align-items: center;
917
+ border-radius: 50%;
918
+ position: absolute;
919
+ top: 0;
920
+ left: 0;
921
+ right: 0;
922
+ bottom: 0;
923
+ margin: auto;
924
+ font-size: 6em;
925
+ line-height: 1.4em;
936
926
  }
937
927
 
938
-
939
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
928
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
940
929
  display: flex;
941
930
  justify-content: center;
942
931
  align-items: center;
943
932
  height: 100%;
944
933
  transition: width 0.1s;
945
934
  }
946
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
947
- margin: 2px;
948
- }
949
935
 
950
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
936
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
951
937
  display: flex;
952
938
  justify-content: center;
953
939
  align-items: center;
954
940
  height: 100%;
955
941
  transition: width 0.1s;
956
942
  }
957
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
958
- display: grid;
959
- font-size: 10px;
960
- grid-template-columns: 1fr;
961
- grid-template-rows: 1fr;
962
- padding: 1px 0px 0 0px;
963
- margin: 0;
943
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
944
+ display: none !important;
945
+ }
946
+ .video-js.skin_news .ssai-ad-container{
947
+ position: absolute;
948
+ bottom: 14px;
964
949
  }
965
950
 
966
- @media (max-width: 600px) {
967
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
951
+ @media (max-width: 576px) {
952
+ .video-js.skin_news .ssai-ad-container{
953
+ bottom: 2px;
954
+ }
955
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
968
956
  height: 5px !important;
969
957
  }
958
+ .video-js.skin_news button.vjs-big-play-button {
959
+ width: 50px !important;
960
+ height: 50px !important;
961
+ font-size: 2.1rem !important;
962
+ }
970
963
 
971
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
964
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
972
965
  display: none;
973
966
  }
967
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
968
+ bottom: 2.4em !important;
969
+ right: -1em;
970
+ z-index: 1;
971
+ }
972
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
973
+ display: none !important;
974
+ }
974
975
 
976
+ .video-js.skin_news .vjs-text-track-display-ttml span {
977
+ color: white !important;
978
+ font-size: 13px !important;
979
+ background-color: black !important;
980
+ }
975
981
  }
976
982
 
977
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
983
+ .video-js.skin_news .vjs-text-track-display-ttml span {
984
+ color: white !important;
985
+ font-size: 16px !important;
986
+ background-color: black !important;
987
+ }
988
+
989
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
990
+ margin-bottom: 2rem !important;
991
+ }
992
+
993
+ .video-js.skin_news .vjs-text-track-display-ttml p {
994
+ font-size: 18px !important;
995
+ }
996
+
997
+
998
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
999
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1000
+ font-size: 1.2em !important;
1001
+ line-height: 1.5em !important;
1002
+ padding: 0.2em 0.8em !important;
1003
+ }
1004
+
1005
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
978
1006
  content: none !important;
979
1007
  fill: none !important;
980
1008
  filter: none !important;
981
1009
  }
982
1010
 
983
1011
  /* svg icons opacity and hover effect */
984
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1012
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
985
1013
  opacity: 0.7 !important;
986
1014
  }
987
1015
 
988
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1016
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1017
+ opacity: 1 !important;
1018
+ }
1019
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1020
+ opacity: 0.7 !important;
1021
+ }
1022
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
989
1023
  opacity: 1 !important;
990
1024
  }
991
1025
 
992
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1026
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
993
1027
  color: rgba(255, 255, 2555, 0.7)!important;
994
1028
  }
995
1029
 
996
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1030
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
997
1031
  color: rgba(255, 255, 2555, 1)!important;
998
1032
  }
999
1033
 
1000
1034
 
1001
1035
 
1002
-
1003
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1036
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1004
1037
  font-size: 2.2em;
1005
1038
  line-height: 2.6;
1006
1039
  }
1007
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
1008
- background: #fcb700;
1040
+ .video-js.skin_mini{
1041
+ overflow: hidden;
1009
1042
  }
1010
- .video-js.skin_news_live .vjs-control-bar{
1043
+ .video-js.skin_mini .vjs-control-bar{
1011
1044
  z-index: 1 !important;
1012
- height: 5em !important;
1045
+ height: 4em !important;
1013
1046
  background: black !important;
1014
1047
  }
1015
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1016
- display: flex;
1017
- align-items: center;
1018
- justify-content: center;
1019
- }
1020
1048
 
1021
- .video-js.skin_news_live .vjs-fade>* {
1049
+ .video-js.skin_mini .vjs-fade>* {
1022
1050
  visibility: hidden !important;
1023
1051
  opacity: 0 !important;
1024
1052
  transition: visibility 1s, opacity 1s !important;
1025
1053
  }
1026
1054
 
1027
- .video-js.skin_news_live .custom-spaced-progress-bar {
1055
+ .video-js.skin_mini .custom-spaced-progress-bar {
1028
1056
  position: absolute;
1029
1057
  width: 100%;
1030
1058
  display: flex;
@@ -1032,7 +1060,7 @@
1032
1060
  top: -0.5em;
1033
1061
  }
1034
1062
 
1035
- .video-js.skin_news_live .vjs-progress-control {
1063
+ .video-js.skin_mini .vjs-progress-control {
1036
1064
  /* left: -6px; */
1037
1065
  position: relative;
1038
1066
  width: 100%;
@@ -1040,25 +1068,22 @@
1040
1068
  transition: height 0.1s, top 0.1s;
1041
1069
  }
1042
1070
 
1043
- .video-js.skin_news_live .vjs-volume-panel{
1044
- min-width: 5.3em;
1045
- }
1046
1071
 
1047
1072
 
1048
1073
 
1049
- .video-js.skin_news_live .vjs-custom-control-spacer {
1050
- /* display: block; */
1051
- /* flex: 1 1 auto; */
1074
+ .video-js.skin_mini .vjs-custom-control-spacer {
1075
+ display: block;
1076
+ flex: 1 1 auto;
1052
1077
  }
1053
1078
 
1054
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1079
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1055
1080
  margin: 0 0px 0 0px;
1056
1081
  }
1057
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
1082
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1058
1083
  display: none;
1059
1084
  }
1060
1085
 
1061
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
1086
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1062
1087
  font-size: 14px;
1063
1088
  font-weight: 500;
1064
1089
  align-self: center;
@@ -1067,199 +1092,207 @@
1067
1092
  border-radius: 8px;
1068
1093
  }
1069
1094
 
1070
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1071
- height: 6px !important;
1095
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1096
+ height: 5px !important;
1072
1097
  }
1073
1098
 
1074
- .video-js.skin_news_live .vjs-play-progress:before {
1075
- font-size: 1.5em;
1099
+ .video-js.skin_mini .vjs-play-progress:before {
1100
+ font-size: 1.3em;
1076
1101
  line-height: unset;
1077
1102
  top: -0.3333333333em;
1078
1103
  }
1079
1104
 
1080
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
1105
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1081
1106
  display: none !important;
1082
1107
  }
1083
1108
 
1084
1109
  /* */
1085
- .video-js.skin_news_live .vjs-mouse-display{
1110
+ .video-js.skin_mini .vjs-mouse-display{
1086
1111
  font-size: 1.6666666667em;
1087
1112
  }
1088
1113
 
1089
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
1114
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1090
1115
  font-size: 1em !important;
1091
1116
  }
1092
1117
 
1093
- .video-js.skin_news_live .vjs-button{
1094
- width: 5.3em;
1118
+ .video-js.skin_mini .vjs-button{
1119
+ width: 3em;
1095
1120
  display: flex;
1096
1121
  align-items: center;
1097
1122
  justify-content: center;
1098
1123
  }
1099
1124
 
1100
1125
 
1101
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1126
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1102
1127
  .icon-maximize {
1103
1128
  display: block;
1104
1129
  height: 32px;
1105
1130
  }
1106
1131
 
1107
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
1132
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1108
1133
  line-height: 4;
1109
1134
  }
1110
1135
 
1111
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1136
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1112
1137
  .icon-minimize {
1113
1138
  display: none;
1114
1139
  height: 32px;
1115
1140
  }
1116
1141
 
1117
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
1142
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1118
1143
  outline: none !important;
1119
- /* flex: 1; */
1120
- }
1121
- .video-js.skin_news_live .vjs-play-toggle-container{
1122
- display: flex;
1123
- flex: 1;
1124
- justify-content: center;
1125
1144
  }
1126
-
1127
-
1128
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
1145
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1129
1146
  .vjs-icon-fullscreen-enter:before {
1130
1147
  /* content: '' !important; */
1131
1148
  }
1132
1149
 
1133
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
1150
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1134
1151
  display: flex;
1135
1152
  justify-content: center;
1136
1153
  align-items: center;
1137
1154
  /* transform: rotate(90deg); */
1138
1155
  }
1139
1156
 
1140
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
1157
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1141
1158
  display: none;
1142
1159
  }
1143
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
1160
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1144
1161
  margin-left: -10px;
1162
+ display: none;
1145
1163
  }
1146
1164
 
1147
- .video-js.skin_news_live .skipbtn:hover{
1165
+ .video-js.skin_mini .vjs-loading-spinner {
1166
+ position: absolute;
1167
+ top: 50%;
1168
+ left: 50%;
1169
+ transform: translate(-50%, -50%);
1170
+ opacity: .85;
1171
+ text-align: left;
1172
+ border: .2em solid rgba(43, 51, 63, .7);
1173
+ box-sizing: border-box;
1174
+ background-clip: padding-box;
1175
+ width: 3em;
1176
+ height: 3em;
1177
+ border-radius: 50%;
1178
+ visibility: hidden;
1179
+ }
1180
+
1181
+ .video-js.skin_mini .skipbtn:hover{
1148
1182
  cursor: pointer;
1149
1183
  }
1150
1184
 
1151
- .video-js.skin_news_live .rewindbtn:hover{
1185
+ .video-js.skin_mini .rewindbtn:hover{
1152
1186
  cursor: pointer;
1153
1187
  }
1154
1188
 
1155
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1189
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1156
1190
  position: relative;
1157
1191
  padding-left: 0;
1158
1192
  }
1159
1193
 
1160
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
1161
- display: none !important;
1194
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1195
+ width: 40px;
1196
+ height: 40px;
1197
+ display: flex;
1198
+ justify-content: center;
1199
+ align-items: center;
1200
+ border: none;
1201
+ position: absolute;
1202
+ top: 0;
1203
+ left: 0;
1204
+ right: 0;
1205
+ bottom: 0;
1206
+ margin: auto;
1207
+ font-size: 3em;
1208
+ line-height: 1.3em;
1209
+ transform: none !important;
1210
+ border-radius: 1.3em;
1162
1211
  }
1163
1212
 
1164
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1165
- /* width: 90px;
1166
- height: 90px;
1167
- display: flex;
1168
- justify-content: center;
1169
- align-items: center;
1170
- border-radius: 50%;
1171
- position: absolute;
1172
- top: 0;
1173
- left: 0;
1174
- right: 0;
1175
- bottom: 0;
1176
- margin: auto;
1177
- font-size: 6em;
1178
- line-height: 1.4em;
1179
- border: 0.05em solid;
1180
- color: inherit; */
1181
- display: none !important;
1182
- }
1183
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
1213
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1184
1214
  font-weight: bold;
1185
1215
  }
1186
1216
 
1187
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
1188
- bottom: 2.4em !important;
1189
- right: -1em;
1217
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1218
+ bottom: 1.1em !important;
1219
+ right: 1em;
1190
1220
  z-index: 1;
1221
+ font-size: 10px;
1191
1222
  }
1192
1223
 
1193
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
1224
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1194
1225
  width: 24px !important;
1195
1226
  height: 24px !important;
1196
1227
  }
1197
- .settings-selector-icon>svg{
1228
+ .video-js.skin_mini .settings-selector-icon>svg{
1198
1229
  height: 19px !important;
1199
1230
  width: 19px !important;
1200
1231
  }
1201
1232
 
1202
1233
 
1203
- .video-js.skin_news_live button.vjs-rewind-button{
1234
+ .video-js.skin_mini button.vjs-rewind-button{
1204
1235
  cursor: pointer;
1205
1236
  }
1206
1237
 
1207
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1238
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1208
1239
  padding-right: 0;
1209
- display: none;
1210
1240
  }
1211
1241
 
1212
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1242
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1213
1243
  padding-left: 0;
1214
- display: none;
1215
1244
  }
1216
1245
 
1217
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
1246
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1218
1247
  padding-left: 0;
1219
1248
  padding-right: 0;
1220
- display: none;
1249
+ display: flex;
1250
+ justify-content: center;
1251
+ width: min-content;
1221
1252
  }
1222
1253
 
1223
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
1254
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1224
1255
  display: none
1225
1256
  }
1226
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
1257
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1227
1258
  display: none
1228
1259
  }
1229
1260
 
1230
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
1231
- display: flex;
1232
- align-items: center;
1233
- font-weight: 700;
1234
- font-size: 12px;
1235
- min-width: 1.2em;
1261
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1262
+ display: flex;
1263
+ align-items: center;
1264
+ font-weight: 700;
1265
+ font-size: 9px;
1266
+ min-width: 0.8em;
1267
+ padding-left: 0;
1236
1268
  }
1237
1269
 
1238
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
1270
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1239
1271
  display: none;
1240
1272
  font-size: 11px;
1241
1273
  justify-content: center;
1242
1274
  align-items: center;
1243
1275
  user-select: none;
1244
1276
  }
1245
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1277
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1246
1278
  display: none;
1247
1279
  }
1248
1280
 
1249
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1281
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1250
1282
  height: min-content;
1251
1283
  width: min-content;
1252
1284
  }
1253
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1254
- width: 6em;
1285
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1286
+ width: 3em;
1287
+ margin-right: 4px;
1255
1288
  }
1256
1289
 
1257
- .video-js.skin_news_live .content{
1290
+ .video-js.skin_mini .content{
1258
1291
  bottom: 3.4rem !important;
1259
1292
  right: -4rem !important;
1260
1293
  }
1261
1294
 
1262
- .setting-icon > svg{
1295
+ .video-js.skin_mini .setting-icon > svg{
1263
1296
  height:18px !important;
1264
1297
  }
1265
1298
 
@@ -1273,16 +1306,16 @@
1273
1306
  pointer-events:none
1274
1307
  }
1275
1308
 
1276
- .video-js.skin_news_live iframe{
1309
+ .video-js.skin_mini iframe{
1277
1310
  width: 100%;
1278
1311
  height: 100%;
1279
1312
  }
1280
1313
 
1281
- .video-js.skin_news_live .vjs-live-control{
1314
+ .video-js.skin_mini .vjs-live-control{
1282
1315
  align-items: center;
1283
- display: none;
1316
+ max-width: 5em;
1284
1317
  }
1285
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
1318
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1286
1319
  height: 2.2em;
1287
1320
  display: flex;
1288
1321
  align-items: center;
@@ -1290,218 +1323,185 @@
1290
1323
  width: 4em;
1291
1324
  justify-content: center;
1292
1325
  background: red;
1293
- margin: 4px 0px 4px 12px;
1326
+ margin: 4px 0px 4px 2px;
1294
1327
  }
1295
1328
 
1296
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
1329
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1297
1330
  text-shadow: none;
1298
1331
  }
1299
-
1300
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
1301
- display: flex;
1302
- justify-content: center;
1303
- min-width: 5.3em;
1304
- pointer-events: none;
1305
- user-select: none;
1306
- }
1307
-
1308
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
1309
- color: white;
1332
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1333
+ display: none;
1334
+ font-size: 12px;
1310
1335
  }
1311
1336
 
1312
-
1313
- .settings-selection.vjs-control.vjs-button{
1314
- display: flex !important;
1337
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1338
+ height: 1.8em;
1339
+ display: inline-flex;
1340
+ align-items: center;
1341
+ font-family: monospace;
1342
+ justify-content: center;
1343
+ border: 1.5px solid;
1344
+ margin: 4px 0px 4px 2px;
1345
+ white-space: pre;
1346
+ padding: 2px 4px;
1347
+ font-size: 1.2em;
1348
+ font-weight: 500;
1349
+ color: rgba(255, 255, 2555, 0.7);
1315
1350
  }
1316
1351
 
1317
- @media(max-width:576px){
1318
- .settings-selection.vjs-control.vjs-button{
1319
- display: none !important;
1320
- }
1352
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1353
+ content: "NOT LIVE";
1354
+ word-spacing: -4px;
1321
1355
  }
1322
1356
 
1323
1357
 
1324
- @media(max-width:576px){
1358
+ @media(max-width:600px){
1325
1359
  .tvProviderImage{
1326
1360
  display: none
1327
1361
  }
1328
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1362
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1329
1363
  .icon-maximize {
1330
1364
  height: 30px !important;
1331
1365
  }
1332
1366
 
1333
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1367
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1334
1368
  .icon-minimize {
1335
1369
  height: 30px !important;
1336
1370
  }
1337
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
1338
- width: 4.5em;
1371
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1372
+ width: 3.5em;
1339
1373
  }
1340
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1374
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1341
1375
  height: min-content;
1342
1376
  }
1343
1377
 
1344
- .video-js.skin_news_live button.vjs-slowmo-button{
1378
+ .video-js.skin_mini button.vjs-slowmo-button{
1345
1379
  display: none;
1346
1380
  }
1347
- .video-js.skin_news_live button.vjs-rewind-button{
1381
+ .video-js.skin_mini button.vjs-rewind-button{
1348
1382
  display: none;
1349
1383
  }
1350
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1384
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1351
1385
  height: 20px;
1352
1386
  }
1353
- .video-js.skin_news_live .vjs-button{
1354
- width: 4.8em;
1387
+ .video-js.skin_mini .vjs-button{
1388
+ width: 3em;
1355
1389
  }
1356
- .video-js.skin_news_live .widget-selection{
1390
+ .video-js.skin_mini .widget-selection{
1357
1391
  display: none;
1358
1392
  }
1359
- .video-js.skin_news_live .container{
1393
+ .video-js.skin_mini .container{
1360
1394
  display: none !important;
1361
1395
  }
1362
- .video-js.skin_news_live .vjs-control-bar{
1396
+ .video-js.skin_mini .vjs-control-bar{
1363
1397
  height: 4em !important;
1364
1398
  }
1365
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1399
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1366
1400
  font-size: 2.5em;
1367
1401
  line-height: 1.5;
1368
1402
  }
1369
- .video-js.skin_news_live .vjs-play-progress:before {
1403
+ .video-js.skin_mini .vjs-play-progress:before {
1370
1404
  font-size: 1.2em;
1371
1405
  position: absolute;
1372
1406
  right: -0.5em;
1373
1407
  z-index: 1;
1374
1408
  }
1375
- .video-js.skin_news_live button.vjs-skip-button>svg{
1409
+ .video-js.skin_mini button.vjs-skip-button>svg{
1376
1410
  height: 20px;
1377
1411
  }
1378
- .video-js.skin_news_live button.vjs-big-play-button {
1379
- width: 50px !important;
1380
- height: 50px !important;
1381
- font-size: 2.1rem !important;
1382
- }
1383
1412
 
1384
1413
  .stream-selector-icon>svg{
1385
1414
  width: 24px;
1386
1415
  height: 24px;
1387
1416
  }
1388
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
1389
- margin: 0 12px 0 12px;
1390
- }
1391
- .video-js.skin_news_live .vjs-seek-to-live-text{
1417
+ .video-js.skin_mini .vjs-seek-to-live-text{
1392
1418
  font-size: 12px;
1393
1419
  }
1394
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
1395
- margin: 0 12px 0 12px;
1420
+
1421
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1422
+ color: white !important;
1423
+ font-size: 16px !important;
1424
+ background-color: rgba(0,0,0,0.2) !important;
1425
+ }
1396
1426
  }
1427
+
1428
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1429
+ color: white !important;
1430
+ font-size: 16px !important;
1431
+ background-color: rgba(0,0,0,0.2) !important;
1397
1432
  }
1398
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
1399
- width: 90px;
1400
- height: 90px;
1401
- display: flex;
1402
- justify-content: center;
1403
- align-items: center;
1404
- border-radius: 50%;
1405
- position: absolute;
1406
- top: 0;
1407
- left: 0;
1408
- right: 0;
1409
- bottom: 0;
1410
- margin: auto;
1411
- font-size: 6em;
1412
- line-height: 1.4em;
1433
+
1434
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1435
+ font-size: 18px !important;
1413
1436
  }
1414
1437
 
1415
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1438
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1439
+ margin-bottom: 1rem !important;
1440
+ }
1441
+
1442
+
1443
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1416
1444
  display: flex;
1417
1445
  justify-content: center;
1418
1446
  align-items: center;
1419
1447
  height: 100%;
1420
1448
  transition: width 0.1s;
1421
1449
  }
1450
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1451
+ margin: 2px;
1452
+ }
1422
1453
 
1423
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1454
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1424
1455
  display: flex;
1425
1456
  justify-content: center;
1426
1457
  align-items: center;
1427
1458
  height: 100%;
1428
1459
  transition: width 0.1s;
1429
1460
  }
1430
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1431
- display: none !important;
1461
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1462
+ display: grid;
1463
+ font-size: 10px;
1464
+ grid-template-columns: 1fr;
1465
+ grid-template-rows: 1fr;
1466
+ padding: 1px 0px 0 0px;
1467
+ margin: 0;
1432
1468
  }
1433
1469
 
1434
- @media (max-width: 576px) {
1435
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1470
+ @media (max-width: 600px) {
1471
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1436
1472
  height: 5px !important;
1437
1473
  }
1438
- .video-js.skin_news_live button.vjs-big-play-button {
1439
- width: 50px !important;
1440
- height: 50px !important;
1441
- font-size: 2.1rem !important;
1442
- }
1443
1474
 
1444
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1475
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1445
1476
  display: none;
1446
1477
  }
1447
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
1448
- bottom: 2.4em !important;
1449
- right: -1em;
1450
- z-index: 1;
1451
- }
1452
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1453
- display: none !important;
1454
- }
1455
-
1456
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1457
- color: white !important;
1458
- font-size: 13px !important;
1459
- background-color: black !important;
1460
- }
1461
- }
1462
-
1463
- .video-js.skin_news_live .vjs-text-track-display-ttml {
1464
- width: 100% !important;
1465
- }
1466
-
1467
- .video-js.skin_news_live .vjs-text-track-display-ttml span {
1468
- color: white !important;
1469
- font-size: 16px !important;
1470
- background-color: black !important;
1471
- }
1472
1478
 
1473
- .video-js.skin_news_live.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1474
- margin-bottom: 2rem !important;
1475
1479
  }
1476
1480
 
1477
- .video-js.skin_news_live .vjs-text-track-display-ttml p {
1478
- font-size: 18px !important;
1481
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1482
+ content: none !important;
1483
+ fill: none !important;
1484
+ filter: none !important;
1479
1485
  }
1480
1486
 
1481
-
1482
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1483
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1484
- font-size: 1.2em !important;
1485
- line-height: 1.5em !important;
1486
- padding: 0.2em 0.8em !important;
1487
+ /* svg icons opacity and hover effect */
1488
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1489
+ opacity: 0.7 !important;
1487
1490
  }
1488
1491
 
1489
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1490
- content: none !important;
1491
- fill: none !important;
1492
- filter: none !important;
1492
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1493
+ opacity: 1 !important;
1493
1494
  }
1494
1495
 
1495
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1496
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1496
1497
  color: rgba(255, 255, 2555, 0.7)!important;
1497
1498
  }
1498
1499
 
1499
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1500
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1500
1501
  color: rgba(255, 255, 2555, 1)!important;
1501
1502
  }
1502
1503
 
1503
1504
 
1504
-
1505
1505
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
1506
1506
  height: 0.7em;
1507
1507
  position: absolute;
@@ -1879,6 +1879,7 @@
1879
1879
 
1880
1880
 
1881
1881
 
1882
+
1882
1883
  .video-js .multicamera-parent.default{
1883
1884
  height: 345px;
1884
1885
  position: absolute;
@@ -2009,112 +2010,292 @@
2009
2010
  width: 22px;
2010
2011
  }
2011
2012
 
2013
+ /* nextep — up-next card (centered in player, scales with player size) */
2014
+ .video-js:has(.next-ep-preview),
2015
+ .video-js:has(.next-ep-preview-player-thumb) {
2016
+ position: relative;
2017
+ }
2018
+
2019
+ .next-ep-preview {
2020
+ container-type: inline-size;
2021
+ container-name: next-ep-preview;
2012
2022
 
2013
- /* nextep */
2014
- .next-ep-preview{
2015
2023
  position: absolute;
2016
- height: min-content;
2017
- width: 300px;
2018
- bottom: 16%;
2019
- right: 1.5%;
2020
- padding: 13px;
2024
+ top: 50%;
2025
+ left: 50%;
2026
+ right: auto;
2027
+ bottom: auto;
2028
+ transform: translate(-50%, -50%);
2029
+ z-index: 15;
2030
+
2031
+ box-sizing: border-box;
2032
+ width: min(92%, 16rem);
2033
+ max-width: calc(100% - 1.5rem);
2034
+ max-height: min(90%, 100%);
2035
+ overflow: auto;
2036
+ overscroll-behavior: contain;
2037
+
2038
+ padding: clamp(0.625rem, 3.5cqi, 1rem) clamp(0.75rem, 4cqi, 1rem);
2039
+ border-radius: clamp(0.5rem, 2cqi, 0.75rem);
2040
+
2041
+ font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
2042
+ color: #fff;
2043
+ }
2044
+
2045
+ .next-heading-wrapper {
2046
+ display: flex;
2047
+ flex-direction: row;
2048
+ justify-content: space-between;
2049
+ align-items: flex-start;
2050
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2051
+ margin-bottom: clamp(0.375rem, 2.5cqi, 0.5rem);
2052
+ }
2053
+
2054
+ .next-ep-header {
2055
+ display: flex;
2056
+ flex-direction: row;
2057
+ flex-wrap: wrap;
2058
+ align-items: baseline;
2059
+ gap: 0.35em;
2060
+ flex: 1;
2061
+ min-width: 0;
2062
+ text-align: left;
2063
+ font-weight: 600;
2064
+ font-size: clamp(0.5625rem, 3.2cqi, 0.6875rem);
2065
+ color: rgba(255, 255, 255, 0.95);
2066
+ margin: 0;
2067
+ }
2068
+
2069
+ .next-ep-header-text {
2070
+ flex-shrink: 0;
2071
+ }
2072
+
2073
+ .next-ep-header .next-ep-duration {
2074
+ flex-shrink: 0;
2075
+ font-weight: 700;
2076
+ color: #fff;
2077
+ }
2078
+
2079
+ .next-ep-close {
2080
+ display: flex;
2081
+ align-items: center;
2082
+ justify-content: center;
2083
+ flex-shrink: 0;
2084
+ padding: clamp(0.125rem, 1cqi, 0.25rem) clamp(0.25rem, 1.5cqi, 0.25rem);
2085
+ margin: 0;
2021
2086
  border-radius: 4px;
2022
- background: rgba(0, 0, 0, 0.75);
2087
+ cursor: pointer;
2088
+ color: rgba(255, 255, 255, 0.85);
2089
+ line-height: 0;
2090
+ opacity: 0.9;
2023
2091
  }
2024
- .next-ep-img{
2025
- width: 185px;
2026
- height: 95px;
2027
-
2092
+
2093
+ .next-ep-close:hover {
2094
+ opacity: 1;
2095
+ }
2096
+
2097
+ .next-ep-close svg {
2098
+ width: clamp(0.75rem, 4cqi, 1rem);
2099
+ height: clamp(0.75rem, 4cqi, 1rem);
2100
+ }
2101
+
2102
+ .next-ep-content {
2103
+ display: flex;
2104
+ flex-direction: column;
2105
+ align-items: stretch;
2106
+ gap: clamp(0.5rem, 3cqi, 0.75rem);
2107
+ cursor: pointer;
2108
+ min-width: 0;
2109
+ }
2110
+
2111
+ .next-ep-content:hover {
2112
+ opacity: 0.98;
2113
+ }
2114
+
2115
+ .next-ep-thumb-wrap {
2116
+ position: relative;
2117
+ width: 100%;
2118
+ aspect-ratio: 16 / 9;
2119
+ border-radius: clamp(0.375rem, 2cqi, 0.5rem);
2120
+ overflow: hidden;
2121
+ background: #1a1a1a;
2028
2122
  }
2029
- .next-ep-img-container{
2123
+
2124
+ .next-ep-img {
2030
2125
  width: 100%;
2031
2126
  height: 100%;
2127
+ object-fit: cover;
2128
+ display: block;
2032
2129
  }
2033
- .next-ep-header{
2034
- text-align: left;
2035
- font-weight: bold;
2036
- font-size: 18px;
2037
- margin-bottom: 8px;
2130
+
2131
+ .next-ep-thumb-runtime {
2132
+ position: absolute;
2133
+ left: clamp(0.375rem, 2.5cqi, 0.625rem);
2134
+ bottom: clamp(0.375rem, 2.5cqi, 0.625rem);
2135
+ padding: clamp(0.125rem, 1cqi, 0.1875rem) clamp(0.375rem, 2cqi, 0.5rem);
2136
+ border-radius: 999px;
2137
+ font-size: clamp(0.5625rem, 2.8cqi, 0.6875rem);
2138
+ font-weight: 600;
2139
+ color: #fff;
2140
+ background: rgba(0, 0, 0, 0.65);
2141
+ letter-spacing: 0.02em;
2142
+ }
2143
+
2144
+ .next-ep-thumb-runtime--empty {
2145
+ display: none;
2038
2146
  }
2039
2147
 
2040
- .next-ep-title{
2041
- font-size: 15px;
2042
- margin-left: 8px;
2148
+ .next-ep-meta-with-logo {
2149
+ display: flex;
2150
+ flex-direction: row;
2151
+ align-items: flex-start;
2152
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2153
+ min-width: 0;
2154
+ }
2043
2155
 
2156
+ .next-ep-meta-with-logo > .next-ep-meta {
2157
+ flex: 1;
2158
+ min-width: 0;
2044
2159
  }
2045
2160
 
2046
- .next-ep-content{
2161
+ .next-ep-meta {
2047
2162
  display: flex;
2048
- align-items: center;
2163
+ flex-direction: column;
2164
+ gap: 0;
2165
+ min-width: 0;
2049
2166
  }
2050
- .next-ep-content:hover{
2051
- cursor: pointer;
2167
+
2168
+ .next-ep-title {
2169
+ font-size: clamp(0.75rem, 4.5cqi, 0.875rem);
2170
+ font-weight: 700;
2171
+ line-height: 1.25;
2172
+ color: #fff;
2173
+ margin: 0;
2174
+ min-width: 0;
2175
+ white-space: nowrap;
2176
+ overflow: hidden;
2177
+ text-overflow: ellipsis;
2178
+ }
2179
+
2180
+ .next-ep-desc {
2181
+ font-size: clamp(0.6875rem, 3.8cqi, 0.75rem);
2182
+ font-weight: 400;
2183
+ line-height: 1.35;
2184
+ color: rgba(255, 255, 255, 0.82);
2185
+ margin: 0;
2186
+ margin-top: 3px;
2187
+ min-width: 0;
2188
+ white-space: nowrap;
2189
+ overflow: hidden;
2190
+ text-overflow: ellipsis;
2191
+ }
2192
+
2193
+ .next-ep-desc--empty {
2194
+ display: none;
2052
2195
  }
2053
- .next-heading-wrapper{
2196
+
2197
+ .next-ep-meta-row {
2054
2198
  display: flex;
2055
- flex-direction: unset;
2056
- justify-content: space-between;
2199
+ flex-direction: row;
2057
2200
  align-items: center;
2201
+ justify-content: flex-start;
2202
+ gap: clamp(0.375rem, 2.5cqi, 0.625rem);
2203
+ margin-top: 2px;
2204
+ min-width: 0;
2058
2205
  }
2059
- .next-ep-close{
2060
- align-items: right;
2061
- font-weight: bold;
2062
- font-size: 18px;
2063
- margin-bottom: 8px;
2064
- font-size: 20px;
2206
+
2207
+ .next-ep-meta-row-left {
2208
+ display: flex;
2209
+ flex-direction: row;
2210
+ align-items: center;
2211
+ gap: clamp(0.375rem, 2cqi, 0.5rem);
2212
+ min-width: 0;
2213
+ flex: 1;
2214
+ }
2215
+
2216
+ .next-ep-badge {
2217
+ flex-shrink: 0;
2218
+ font-size: clamp(0.5rem, 2.6cqi, 0.625rem);
2219
+ font-weight: 600;
2220
+ letter-spacing: 0.08em;
2221
+ text-transform: uppercase;
2222
+ padding: clamp(0.0625rem, 0.8cqi, 0.125rem) clamp(0.1875rem, 1.6cqi, 0.25rem);
2223
+ border: 1px solid rgba(255, 255, 255, 0.75);
2065
2224
  border-radius: 3px;
2066
- cursor: pointer;
2225
+ color: rgba(255, 255, 255, 0.95);
2067
2226
  }
2068
2227
 
2069
- @media (max-width:600px){
2070
- .next-ep-preview{
2071
- width: 170px;
2072
- right: 2.5%;
2073
- padding: 6px;
2074
- bottom: 56px;
2075
- }
2076
- .next-ep-header{
2077
- font-size: 12px;
2078
- }
2079
- .next-ep-img {
2080
- width: 100px;
2081
- height: 60px;
2228
+ .next-ep-badge--empty {
2229
+ display: none;
2230
+ }
2231
+
2232
+ .next-ep-episode {
2233
+ font-size: clamp(0.6875rem, 3.6cqi, 0.75rem);
2234
+ color: rgba(255, 255, 255, 0.88);
2235
+ white-space: nowrap;
2236
+ overflow: hidden;
2237
+ text-overflow: ellipsis;
2238
+ min-width: 0;
2239
+ }
2240
+
2241
+ .next-ep-network-logo {
2242
+ flex-shrink: 0;
2243
+ max-height: clamp(0.875rem, 5cqi, 1.375rem);
2244
+ max-width: clamp(2.5rem, 14cqi, 3.5rem);
2245
+ width: auto;
2246
+ height: auto;
2247
+ object-fit: contain;
2248
+ opacity: 0.98;
2249
+ }
2250
+
2251
+ .next-ep-network-logo--empty {
2252
+ display: none;
2253
+ }
2254
+
2255
+ /* Narrow card: stack meta and network logo */
2256
+ @container next-ep-preview (max-width: 220px) {
2257
+ .next-ep-meta-with-logo {
2258
+ flex-direction: column;
2259
+ align-items: flex-start;
2082
2260
  }
2083
- .next-ep-title {
2084
- font-size: 9px;
2085
- margin-left: 8px;
2261
+
2262
+ .next-ep-network-logo {
2263
+ align-self: flex-end;
2086
2264
  }
2087
2265
  }
2088
- /* a wrapper element that tracks the mouse vertically */
2089
- .vjs-thumbnail-holder {
2090
- position: absolute;
2091
- left: -1000px;
2266
+
2267
+ /* Full-player thumbnail while the next episode asset loads */
2268
+ .video-js.next-ep-load-pending {
2269
+ position: relative;
2092
2270
  }
2093
2271
 
2094
- /* the thumbnail image itself */
2095
- .vjs-thumbnail {
2096
- position: absolute;
2097
- left: 0;
2098
- bottom: 1.3em;
2099
- opacity: 0;
2100
- transition: opacity .2s ease;
2101
- -webkit-transition: opacity .2s ease;
2102
- -moz-transition: opacity .2s ease;
2103
- -mz-transition: opacity .2s ease;
2272
+ .next-ep-preview-player-thumb {
2273
+ position: absolute;
2274
+ inset: 0;
2275
+ z-index: 5;
2276
+ overflow: hidden;
2277
+ background: #000;
2278
+ pointer-events: none;
2104
2279
  }
2105
2280
 
2106
- /* fade in the thumbnail when hovering over the progress bar */
2107
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2108
- .vjs-progress-control:hover .vjs-thumbnail,
2109
- .vjs-progress-control.fake-active .vjs-thumbnail,
2110
- .vjs-progress-control:active .vjs-thumbnail {
2111
- opacity: 1;
2281
+ .next-ep-load-overlay {
2282
+ position: absolute;
2283
+ inset: 0;
2284
+ z-index: 10;
2285
+ overflow: hidden;
2286
+ background: #000;
2287
+ pointer-events: none;
2112
2288
  }
2113
2289
 
2114
- /* ... but hide the thumbnail when hovering directly over it */
2115
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2116
- .vjs-progress-control:active .vjs-thumbnail:active {
2117
- opacity: 0;
2290
+ .next-ep-load-overlay-img {
2291
+ width: 100%;
2292
+ height: 100%;
2293
+ object-fit: cover;
2294
+ display: block;
2295
+ }
2296
+
2297
+ .video-js.next-ep-load-pending .vjs-loading-spinner {
2298
+ z-index: 30 !important;
2118
2299
  }
2119
2300
 
2120
2301
  .video-js.vjs-quality-menu {
@@ -2187,6 +2368,38 @@
2187
2368
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2188
2369
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2189
2370
  }
2371
+ /* a wrapper element that tracks the mouse vertically */
2372
+ .vjs-thumbnail-holder {
2373
+ position: absolute;
2374
+ left: -1000px;
2375
+ }
2376
+
2377
+ /* the thumbnail image itself */
2378
+ .vjs-thumbnail {
2379
+ position: absolute;
2380
+ left: 0;
2381
+ bottom: 1.3em;
2382
+ opacity: 0;
2383
+ transition: opacity .2s ease;
2384
+ -webkit-transition: opacity .2s ease;
2385
+ -moz-transition: opacity .2s ease;
2386
+ -mz-transition: opacity .2s ease;
2387
+ }
2388
+
2389
+ /* fade in the thumbnail when hovering over the progress bar */
2390
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2391
+ .vjs-progress-control:hover .vjs-thumbnail,
2392
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2393
+ .vjs-progress-control:active .vjs-thumbnail {
2394
+ opacity: 1;
2395
+ }
2396
+
2397
+ /* ... but hide the thumbnail when hovering directly over it */
2398
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2399
+ .vjs-progress-control:active .vjs-thumbnail:active {
2400
+ opacity: 0;
2401
+ }
2402
+
2190
2403
  .vjs-poster {
2191
2404
  display: inline-block;
2192
2405
  vertical-align: middle;