@viewlift/player-backup 2.0.364-backup → 2.0.366-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 (155) hide show
  1. package/cjs/{_commonjsHelpers-81c4d214.js → _commonjsHelpers-b015a800.js} +1 -1
  2. package/cjs/{autoNextVideo-b57fd94e.js → autoNextVideo-39137ea7.js} +1 -1
  3. package/cjs/browser-2807cc02.js +1 -0
  4. package/cjs/bundle.css +1095 -1095
  5. package/cjs/caption-settings-0d09a023.js +1 -0
  6. package/cjs/captions-4dfe293a.js +1 -0
  7. package/cjs/features-23064295.js +1 -0
  8. package/cjs/generic-d59df798.js +1 -0
  9. package/cjs/index-21f99efb.js +1 -0
  10. package/cjs/index-4d9691aa.js +1 -0
  11. package/cjs/index-58f88daa.js +1 -0
  12. package/cjs/index-6c930113.js +1 -0
  13. package/cjs/index-8ccb921b.js +1 -0
  14. package/cjs/index-e0705a65.js +1 -0
  15. package/cjs/index-ea6cb061.js +1 -0
  16. package/cjs/index.js +1 -1
  17. package/cjs/multicamv2-8f462e38.js +1 -0
  18. package/cjs/multicamv2-b8c17949.js +1 -0
  19. package/cjs/nextEpisodeButton-d9cd5fb1.js +1 -0
  20. package/cjs/playlist-6969c5ca.js +1 -0
  21. package/cjs/relatedVideosManager-0a220d05.js +1 -0
  22. package/cjs/renditions-627bdfad.js +1 -0
  23. package/cjs/resolution-687b9e26.js +1 -0
  24. package/cjs/series-66922472.js +1 -0
  25. package/cjs/series-v2-85ae7b80.js +1 -0
  26. package/cjs/series-v2-d31238b9.js +1 -0
  27. package/cjs/settings-icon-059ca993.js +1 -0
  28. package/cjs/skin-034b2cc3.js +1 -0
  29. package/cjs/skin-1dbd805c.js +1 -0
  30. package/cjs/skin-2c0788b0.js +1 -0
  31. package/cjs/skin-48e3676a.js +1 -0
  32. package/cjs/skin-66dce245.js +1 -0
  33. package/cjs/skin-683cc0d5.js +1 -0
  34. package/cjs/skin-726761e7.js +1 -0
  35. package/cjs/{skin-eecb289d.js → skin-7be222c3.js} +1 -1
  36. package/cjs/skin-97f54825.js +1 -0
  37. package/cjs/skin-e8cb7689.js +1 -0
  38. package/cjs/skin-e9dbdb98.js +1 -0
  39. package/cjs/videoSelector-b4dabf14.js +1 -0
  40. package/cjs/videoSelector-f97158a8.js +1 -0
  41. package/cjs/videojs-dash5.es-80bdd597.js +1 -0
  42. package/esm/{_commonjsHelpers-0307ea52.js → _commonjsHelpers-fa53191c.js} +1 -1
  43. package/esm/{autoNextVideo-ca468d20.js → autoNextVideo-2cf2a466.js} +1 -1
  44. package/esm/browser-05efadfa.js +1 -0
  45. package/esm/bundle.css +1095 -1095
  46. package/esm/caption-settings-e1a53633.js +1 -0
  47. package/esm/captions-1f931e14.js +1 -0
  48. package/esm/features-f801ac8f.js +1 -0
  49. package/esm/generic-1ec63419.js +1 -0
  50. package/esm/index-02b0a133.js +1 -0
  51. package/esm/index-0f7da6b9.js +1 -0
  52. package/esm/index-b2787475.js +1 -0
  53. package/esm/index-cf61797b.js +1 -0
  54. package/esm/index-e8f0fd76.js +1 -0
  55. package/esm/index-ec92c082.js +1 -0
  56. package/esm/index-f822cbee.js +1 -0
  57. package/esm/index.js +1 -1
  58. package/esm/multicamv2-aafe0810.js +1 -0
  59. package/esm/multicamv2-dd9f7e2e.js +1 -0
  60. package/esm/nextEpisodeButton-09890402.js +1 -0
  61. package/esm/playlist-238c7916.js +1 -0
  62. package/esm/relatedVideosManager-81661348.js +1 -0
  63. package/esm/renditions-620d93b3.js +1 -0
  64. package/esm/resolution-43f91f56.js +1 -0
  65. package/esm/series-4995e7da.js +1 -0
  66. package/esm/series-v2-497e237a.js +1 -0
  67. package/esm/series-v2-bfcf3143.js +1 -0
  68. package/esm/settings-icon-de1c6c28.js +1 -0
  69. package/esm/skin-23645580.js +1 -0
  70. package/esm/skin-3653c5b3.js +1 -0
  71. package/esm/{skin-62c1d140.js → skin-37630f8b.js} +1 -1
  72. package/esm/skin-55d12fd9.js +1 -0
  73. package/esm/skin-6fe61142.js +1 -0
  74. package/esm/skin-715400e8.js +1 -0
  75. package/esm/skin-93b5b4e7.js +1 -0
  76. package/esm/skin-d3ef74e4.js +1 -0
  77. package/esm/{skin-5bafce20.js → skin-e5d67823.js} +1 -1
  78. package/esm/skin-f088d573.js +1 -0
  79. package/esm/skin-ffd719f6.js +1 -0
  80. package/esm/src/components/watch-history/handleWatchHistory.d.ts +1 -0
  81. package/esm/videoSelector-23dd3316.js +1 -0
  82. package/esm/videoSelector-a26f3b99.js +1 -0
  83. package/esm/videojs-dash5.es-45c88e15.js +1 -0
  84. package/package.json +3 -2
  85. package/cjs/browser-ab1ec3ab.js +0 -1
  86. package/cjs/caption-settings-50cfa585.js +0 -1
  87. package/cjs/captions-23ff3076.js +0 -1
  88. package/cjs/features-84532cac.js +0 -1
  89. package/cjs/generic-ca18a946.js +0 -1
  90. package/cjs/index-27a62060.js +0 -1
  91. package/cjs/index-62250ea0.js +0 -1
  92. package/cjs/index-66e473f7.js +0 -1
  93. package/cjs/index-91ceac93.js +0 -1
  94. package/cjs/index-d28c1d04.js +0 -1
  95. package/cjs/index-d9460e79.js +0 -1
  96. package/cjs/index-ee9cb57f.js +0 -1
  97. package/cjs/multicamv2-96472b7c.js +0 -1
  98. package/cjs/multicamv2-a3b15f57.js +0 -1
  99. package/cjs/nextEpisodeButton-0e7c699e.js +0 -1
  100. package/cjs/playlist-6dbaae47.js +0 -1
  101. package/cjs/relatedVideosManager-44ec6d59.js +0 -1
  102. package/cjs/renditions-05a85e06.js +0 -1
  103. package/cjs/resolution-059a4468.js +0 -1
  104. package/cjs/series-3754d0a9.js +0 -1
  105. package/cjs/series-v2-00ad95c3.js +0 -1
  106. package/cjs/series-v2-faf6c719.js +0 -1
  107. package/cjs/settings-icon-81e0bc78.js +0 -1
  108. package/cjs/skin-0220bbd7.js +0 -1
  109. package/cjs/skin-13c66191.js +0 -1
  110. package/cjs/skin-2b08e648.js +0 -1
  111. package/cjs/skin-55634dc6.js +0 -1
  112. package/cjs/skin-5e92eba9.js +0 -1
  113. package/cjs/skin-5f049521.js +0 -1
  114. package/cjs/skin-65a80a93.js +0 -1
  115. package/cjs/skin-8111bf49.js +0 -1
  116. package/cjs/skin-c211c3a9.js +0 -1
  117. package/cjs/skin-e3d5c1a7.js +0 -1
  118. package/cjs/videoSelector-0bd954a8.js +0 -1
  119. package/cjs/videoSelector-99835c7d.js +0 -1
  120. package/cjs/videojs-dash5.es-0f92604f.js +0 -1
  121. package/esm/browser-8ea05bed.js +0 -1
  122. package/esm/caption-settings-d0e2275a.js +0 -1
  123. package/esm/captions-4dea3682.js +0 -1
  124. package/esm/features-0d4290a8.js +0 -1
  125. package/esm/generic-6c14b09e.js +0 -1
  126. package/esm/index-23afe568.js +0 -1
  127. package/esm/index-4be0bb5b.js +0 -1
  128. package/esm/index-8b7ad7a7.js +0 -1
  129. package/esm/index-c276e2a6.js +0 -1
  130. package/esm/index-c4656b30.js +0 -1
  131. package/esm/index-e096af23.js +0 -1
  132. package/esm/index-eded6cb0.js +0 -1
  133. package/esm/multicamv2-63047664.js +0 -1
  134. package/esm/multicamv2-7b8465e8.js +0 -1
  135. package/esm/nextEpisodeButton-a3ed5cde.js +0 -1
  136. package/esm/playlist-41378efa.js +0 -1
  137. package/esm/relatedVideosManager-93533a90.js +0 -1
  138. package/esm/renditions-28891b91.js +0 -1
  139. package/esm/resolution-ce4463bf.js +0 -1
  140. package/esm/series-b9736092.js +0 -1
  141. package/esm/series-v2-1d1e574d.js +0 -1
  142. package/esm/series-v2-768b237e.js +0 -1
  143. package/esm/settings-icon-8eaa7cc6.js +0 -1
  144. package/esm/skin-012028ab.js +0 -1
  145. package/esm/skin-05244e25.js +0 -1
  146. package/esm/skin-2a3ee818.js +0 -1
  147. package/esm/skin-30bed6f1.js +0 -1
  148. package/esm/skin-322d12ce.js +0 -1
  149. package/esm/skin-35b6305b.js +0 -1
  150. package/esm/skin-5dd350fb.js +0 -1
  151. package/esm/skin-9126d695.js +0 -1
  152. package/esm/skin-eb02f212.js +0 -1
  153. package/esm/videoSelector-323e9112.js +0 -1
  154. package/esm/videoSelector-f3f07a76.js +0 -1
  155. package/esm/videojs-dash5.es-cfe95daa.js +0 -1
package/cjs/bundle.css CHANGED
@@ -4,31 +4,31 @@
4
4
 
5
5
 
6
6
 
7
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
7
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
8
8
  font-size: 2.2em;
9
9
  line-height: 2.6;
10
10
  }
11
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
12
- background: white;
11
+ .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
12
+ background: #fcb700;
13
13
  }
14
- .video-js.skin_news .vjs-control-bar{
14
+ .video-js.skin_news_live .vjs-control-bar{
15
15
  z-index: 1 !important;
16
16
  height: 5em !important;
17
17
  background: black !important;
18
18
  }
19
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
19
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
20
20
  display: flex;
21
21
  align-items: center;
22
22
  justify-content: center;
23
23
  }
24
24
 
25
- .video-js.skin_news .vjs-fade>* {
25
+ .video-js.skin_news_live .vjs-fade>* {
26
26
  visibility: hidden !important;
27
27
  opacity: 0 !important;
28
28
  transition: visibility 1s, opacity 1s !important;
29
29
  }
30
30
 
31
- .video-js.skin_news .custom-spaced-progress-bar {
31
+ .video-js.skin_news_live .custom-spaced-progress-bar {
32
32
  position: absolute;
33
33
  width: 100%;
34
34
  display: flex;
@@ -36,7 +36,7 @@
36
36
  top: -0.5em;
37
37
  }
38
38
 
39
- .video-js.skin_news .vjs-progress-control {
39
+ .video-js.skin_news_live .vjs-progress-control {
40
40
  /* left: -6px; */
41
41
  position: relative;
42
42
  width: 100%;
@@ -44,22 +44,25 @@
44
44
  transition: height 0.1s, top 0.1s;
45
45
  }
46
46
 
47
+ .video-js.skin_news_live .vjs-volume-panel{
48
+ min-width: 5.3em;
49
+ }
47
50
 
48
51
 
49
52
 
50
- .video-js.skin_news .vjs-custom-control-spacer {
51
- display: block;
52
- flex: 1 1 auto;
53
+ .video-js.skin_news_live .vjs-custom-control-spacer {
54
+ /* display: block; */
55
+ /* flex: 1 1 auto; */
53
56
  }
54
57
 
55
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
58
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
56
59
  margin: 0 0px 0 0px;
57
60
  }
58
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
61
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
59
62
  display: none;
60
63
  }
61
64
 
62
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
65
+ .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
63
66
  font-size: 14px;
64
67
  font-weight: 500;
65
68
  align-self: center;
@@ -68,30 +71,30 @@
68
71
  border-radius: 8px;
69
72
  }
70
73
 
71
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
74
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
72
75
  height: 6px !important;
73
76
  }
74
77
 
75
- .video-js.skin_news .vjs-play-progress:before {
78
+ .video-js.skin_news_live .vjs-play-progress:before {
76
79
  font-size: 1.5em;
77
80
  line-height: unset;
78
81
  top: -0.3333333333em;
79
82
  }
80
83
 
81
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
84
+ .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
82
85
  display: none !important;
83
86
  }
84
87
 
85
88
  /* */
86
- .video-js.skin_news .vjs-mouse-display{
89
+ .video-js.skin_news_live .vjs-mouse-display{
87
90
  font-size: 1.6666666667em;
88
91
  }
89
92
 
90
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
93
+ .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
91
94
  font-size: 1em !important;
92
95
  }
93
96
 
94
- .video-js.skin_news .vjs-button{
97
+ .video-js.skin_news_live .vjs-button{
95
98
  width: 5.3em;
96
99
  display: flex;
97
100
  align-items: center;
@@ -99,63 +102,71 @@
99
102
  }
100
103
 
101
104
 
102
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
105
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
103
106
  .icon-maximize {
104
107
  display: block;
105
108
  height: 32px;
106
109
  }
107
110
 
108
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
111
+ .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
109
112
  line-height: 4;
110
113
  }
111
114
 
112
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
115
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
113
116
  .icon-minimize {
114
117
  display: none;
115
118
  height: 32px;
116
119
  }
117
120
 
118
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
121
+ .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
119
122
  outline: none !important;
123
+ /* flex: 1; */
120
124
  }
121
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
125
+ .video-js.skin_news_live .vjs-play-toggle-container{
126
+ display: flex;
127
+ flex: 1;
128
+ justify-content: center;
129
+ }
130
+
131
+
132
+ .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
122
133
  .vjs-icon-fullscreen-enter:before {
123
134
  /* content: '' !important; */
124
135
  }
125
136
 
126
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
137
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
127
138
  display: flex;
128
139
  justify-content: center;
129
140
  align-items: center;
130
141
  /* transform: rotate(90deg); */
131
142
  }
132
143
 
133
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
144
+ .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
134
145
  display: none;
135
146
  }
136
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
147
+ .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
137
148
  margin-left: -10px;
138
149
  }
139
150
 
140
- .video-js.skin_news .skipbtn:hover{
151
+ .video-js.skin_news_live .skipbtn:hover{
141
152
  cursor: pointer;
142
153
  }
143
154
 
144
- .video-js.skin_news .rewindbtn:hover{
155
+ .video-js.skin_news_live .rewindbtn:hover{
145
156
  cursor: pointer;
146
157
  }
147
158
 
148
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
159
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
149
160
  position: relative;
150
161
  padding-left: 0;
151
162
  }
152
163
 
153
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
164
+ .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
154
165
  display: none !important;
155
166
  }
156
167
 
157
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
158
- width: 90px;
168
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
169
+ /* width: 90px;
159
170
  height: 90px;
160
171
  display: flex;
161
172
  justify-content: center;
@@ -170,19 +181,20 @@
170
181
  font-size: 6em;
171
182
  line-height: 1.4em;
172
183
  border: 0.05em solid;
173
- color: inherit;
184
+ color: inherit; */
185
+ display: none !important;
174
186
  }
175
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
187
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
176
188
  font-weight: bold;
177
189
  }
178
190
 
179
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
191
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
180
192
  bottom: 2.4em !important;
181
193
  right: -1em;
182
194
  z-index: 1;
183
195
  }
184
196
 
185
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
197
+ .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
186
198
  width: 24px !important;
187
199
  height: 24px !important;
188
200
  }
@@ -192,34 +204,34 @@
192
204
  }
193
205
 
194
206
 
195
- .video-js.skin_news button.vjs-rewind-button{
207
+ .video-js.skin_news_live button.vjs-rewind-button{
196
208
  cursor: pointer;
197
209
  }
198
210
 
199
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
211
+ .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
200
212
  padding-right: 0;
213
+ display: none;
201
214
  }
202
215
 
203
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
216
+ .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
204
217
  padding-left: 0;
218
+ display: none;
205
219
  }
206
220
 
207
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
221
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
208
222
  padding-left: 0;
209
223
  padding-right: 0;
210
- display: flex;
211
- justify-content: center;
212
- width: min-content;
224
+ display: none;
213
225
  }
214
226
 
215
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
227
+ .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
216
228
  display: none
217
229
  }
218
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
230
+ .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
219
231
  display: none
220
232
  }
221
233
 
222
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
234
+ .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
223
235
  display: flex;
224
236
  align-items: center;
225
237
  font-weight: 700;
@@ -227,26 +239,26 @@
227
239
  min-width: 1.2em;
228
240
  }
229
241
 
230
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
242
+ .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
231
243
  display: none;
232
244
  font-size: 11px;
233
245
  justify-content: center;
234
246
  align-items: center;
235
247
  user-select: none;
236
248
  }
237
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
249
+ .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
238
250
  display: none;
239
251
  }
240
252
 
241
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
253
+ .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
242
254
  height: min-content;
243
255
  width: min-content;
244
256
  }
245
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
257
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
246
258
  width: 6em;
247
259
  }
248
260
 
249
- .video-js.skin_news .content{
261
+ .video-js.skin_news_live .content{
250
262
  bottom: 3.4rem !important;
251
263
  right: -4rem !important;
252
264
  }
@@ -265,15 +277,16 @@
265
277
  pointer-events:none
266
278
  }
267
279
 
268
- .video-js.skin_news iframe{
280
+ .video-js.skin_news_live iframe{
269
281
  width: 100%;
270
282
  height: 100%;
271
283
  }
272
284
 
273
- .video-js.skin_news .vjs-live-control{
285
+ .video-js.skin_news_live .vjs-live-control{
274
286
  align-items: center;
287
+ display: none;
275
288
  }
276
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
289
+ .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
277
290
  height: 2.2em;
278
291
  display: flex;
279
292
  align-items: center;
@@ -284,43 +297,22 @@
284
297
  margin: 4px 0px 4px 12px;
285
298
  }
286
299
 
287
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
300
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
288
301
  text-shadow: none;
289
302
  }
290
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
291
- display: none;
292
- font-size: 12px;
293
- }
294
303
 
295
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
296
- height: 2.2em;
297
- display: inline-flex;
298
- align-items: center;
299
- /* font-family: monospace; */
304
+ .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
305
+ display: flex;
300
306
  justify-content: center;
301
- border: 2px solid;
302
- margin: 4px 0px 4px 6px;
303
- white-space: pre;
304
- padding: 0px 6px;
305
- font-size: 1.2em;
306
- font-weight: 500;
307
- color: rgba(255, 255, 2555, 0.7);
308
-
309
- letter-spacing: -.1px;
310
- line-height: normal;
311
- text-transform: uppercase;
312
- color: #FFFFFF;
313
- opacity: .7;
314
- font-family: "Proxima Nova";
307
+ min-width: 5.3em;
308
+ pointer-events: none;
309
+ user-select: none;
315
310
  }
316
311
 
317
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
318
- opacity: 1;
312
+ .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
313
+ color: white;
319
314
  }
320
315
 
321
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
322
- content: "NOT LIVE";
323
- }
324
316
 
325
317
  .settings-selection.vjs-control.vjs-button{
326
318
  display: flex !important;
@@ -337,57 +329,57 @@
337
329
  .tvProviderImage{
338
330
  display: none
339
331
  }
340
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
332
+ .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
341
333
  .icon-maximize {
342
334
  height: 30px !important;
343
335
  }
344
336
 
345
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
337
+ .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
346
338
  .icon-minimize {
347
339
  height: 30px !important;
348
340
  }
349
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
341
+ .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
350
342
  width: 4.5em;
351
343
  }
352
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
344
+ .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
353
345
  height: min-content;
354
346
  }
355
347
 
356
- .video-js.skin_news button.vjs-slowmo-button{
348
+ .video-js.skin_news_live button.vjs-slowmo-button{
357
349
  display: none;
358
350
  }
359
- .video-js.skin_news button.vjs-rewind-button{
351
+ .video-js.skin_news_live button.vjs-rewind-button{
360
352
  display: none;
361
353
  }
362
- .video-js.skin_news button.vjs-rewind-button>svg{
354
+ .video-js.skin_news_live button.vjs-rewind-button>svg{
363
355
  height: 20px;
364
356
  }
365
- .video-js.skin_news .vjs-button{
357
+ .video-js.skin_news_live .vjs-button{
366
358
  width: 4.8em;
367
359
  }
368
- .video-js.skin_news .widget-selection{
360
+ .video-js.skin_news_live .widget-selection{
369
361
  display: none;
370
362
  }
371
- .video-js.skin_news .container{
363
+ .video-js.skin_news_live .container{
372
364
  display: none !important;
373
365
  }
374
- .video-js.skin_news .vjs-control-bar{
366
+ .video-js.skin_news_live .vjs-control-bar{
375
367
  height: 4em !important;
376
368
  }
377
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
369
+ .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
378
370
  font-size: 2.5em;
379
371
  line-height: 1.5;
380
372
  }
381
- .video-js.skin_news .vjs-play-progress:before {
373
+ .video-js.skin_news_live .vjs-play-progress:before {
382
374
  font-size: 1.2em;
383
375
  position: absolute;
384
376
  right: -0.5em;
385
377
  z-index: 1;
386
378
  }
387
- .video-js.skin_news button.vjs-skip-button>svg{
379
+ .video-js.skin_news_live button.vjs-skip-button>svg{
388
380
  height: 20px;
389
381
  }
390
- .video-js.skin_news button.vjs-big-play-button {
382
+ .video-js.skin_news_live button.vjs-big-play-button {
391
383
  width: 50px !important;
392
384
  height: 50px !important;
393
385
  font-size: 2.1rem !important;
@@ -397,17 +389,17 @@
397
389
  width: 24px;
398
390
  height: 24px;
399
391
  }
400
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
392
+ .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
401
393
  margin: 0 12px 0 12px;
402
394
  }
403
- .video-js.skin_news .vjs-seek-to-live-text{
395
+ .video-js.skin_news_live .vjs-seek-to-live-text{
404
396
  font-size: 12px;
405
397
  }
406
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
398
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
407
399
  margin: 0 12px 0 12px;
408
400
  }
409
401
  }
410
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
402
+ .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
411
403
  width: 90px;
412
404
  height: 90px;
413
405
  display: flex;
@@ -424,7 +416,7 @@
424
416
  line-height: 1.4em;
425
417
  }
426
418
 
427
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
419
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
428
420
  display: flex;
429
421
  justify-content: center;
430
422
  align-items: center;
@@ -432,29 +424,22 @@
432
424
  transition: width 0.1s;
433
425
  }
434
426
 
435
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
427
+ .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
436
428
  display: flex;
437
429
  justify-content: center;
438
430
  align-items: center;
439
431
  height: 100%;
440
432
  transition: width 0.1s;
441
433
  }
442
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
434
+ .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
443
435
  display: none !important;
444
436
  }
445
- .video-js.skin_news .ssai-ad-container{
446
- position: absolute;
447
- bottom: 14px;
448
- }
449
437
 
450
438
  @media (max-width: 576px) {
451
- .video-js.skin_news .ssai-ad-container{
452
- bottom: 2px;
453
- }
454
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
439
+ .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
455
440
  height: 5px !important;
456
441
  }
457
- .video-js.skin_news button.vjs-big-play-button {
442
+ .video-js.skin_news_live button.vjs-big-play-button {
458
443
  width: 50px !important;
459
444
  height: 50px !important;
460
445
  font-size: 2.1rem !important;
@@ -463,335 +448,505 @@
463
448
  .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
464
449
  display: none;
465
450
  }
466
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
451
+ .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
467
452
  bottom: 2.4em !important;
468
453
  right: -1em;
469
454
  z-index: 1;
470
455
  }
471
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
456
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
472
457
  display: none !important;
473
458
  }
474
459
 
475
- .video-js.skin_news .vjs-text-track-display-ttml span {
476
- color: white;
477
- font-size: 13px;
478
- background-color: black;
479
- }
480
- }
481
-
482
- .video-js.skin_news .vjs-text-track-display-ttml span {
483
- color: white;
484
- font-size: 16px;
485
- background-color: black;
486
- }
487
-
488
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
489
- margin-bottom: 2rem !important;
490
460
  }
491
461
 
492
- .video-js.skin_news .vjs-text-track-display-ttml p {
493
- font-size: 18px !important;
462
+ .video-js.skin_news_live .vjs-text-track-display-ttml {
463
+ width: 100% !important;
494
464
  }
495
465
 
496
-
497
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
498
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
466
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
467
+ .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
499
468
  font-size: 1.2em !important;
500
469
  line-height: 1.5em !important;
501
470
  padding: 0.2em 0.8em !important;
502
471
  }
503
472
 
504
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
473
+ .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
505
474
  content: none !important;
506
475
  fill: none !important;
507
476
  filter: none !important;
508
477
  }
509
478
 
510
- /* svg icons opacity and hover effect */
511
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
512
- opacity: 0.7 !important;
479
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
480
+ color: rgba(255, 255, 2555, 0.7)!important;
513
481
  }
514
482
 
515
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
516
- opacity: 1 !important;
517
- }
518
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
519
- opacity: 0.7 !important;
520
- }
521
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
522
- opacity: 1 !important;
483
+ .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
484
+ color: rgba(255, 255, 2555, 1)!important;
523
485
  }
524
486
 
525
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
526
- color: rgba(255, 255, 2555, 0.7)!important;
527
- }
528
487
 
529
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
530
- color: rgba(255, 255, 2555, 1)!important;
531
- }
532
488
 
489
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
490
+ height: 0.7em !important;
491
+ position: absolute !important;
492
+ top: -0.7em !important;
493
+ width: 100% !important;
494
+ }
533
495
 
496
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
497
+ height: 100%;
498
+ }
534
499
 
535
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
536
- font-size: 2.2em;
537
- line-height: 2.6;
500
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
501
+ line-height: 2.5;
538
502
  }
539
- .video-js.skin_news_live .vjs-custom-big-mute.vjs-control{
540
- background: #fcb700;
503
+
504
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
505
+ height: 19px;
506
+ width: 19px;
507
+ cursor: pointer;
541
508
  }
542
- .video-js.skin_news_live .vjs-control-bar{
543
- z-index: 1 !important;
544
- height: 5em !important;
545
- background: black !important;
509
+ .video-js.skin_vlone .vjs-control {
510
+ user-select: none;
546
511
  }
547
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
548
- display: flex;
549
- align-items: center;
550
- justify-content: center;
512
+ .video-js.skin_vlone .vjs-custom-control-spacer{
513
+ user-select: none;
551
514
  }
552
515
 
553
- .video-js.skin_news_live .vjs-fade>* {
554
- visibility: hidden !important;
555
- opacity: 0 !important;
556
- transition: visibility 1s, opacity 1s !important;
516
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
517
+ height: 19px;
518
+ width: 19px;
519
+ cursor: pointer;
557
520
  }
558
521
 
559
- .video-js.skin_news_live .custom-spaced-progress-bar {
560
- position: absolute;
561
- width: 100%;
562
- display: flex;
563
- height: 0.5em;
564
- top: -0.5em;
522
+ .video-js.skin_vlone .vjs-play-progress:before {
523
+ display: none !important;
565
524
  }
566
525
 
567
- .video-js.skin_news_live .vjs-progress-control {
568
- /* left: -6px; */
569
- position: relative;
570
- width: 100%;
571
- height: 0.5em;
572
- transition: height 0.1s, top 0.1s;
573
- }
526
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
527
+ margin: 0 !important;
574
528
 
575
- .video-js.skin_news_live .vjs-volume-panel{
576
- min-width: 5.3em;
577
529
  }
578
530
 
579
531
 
580
-
581
- .video-js.skin_news_live .vjs-custom-control-spacer {
582
- /* display: block; */
583
- /* flex: 1 1 auto; */
532
+ .video-js.skin_vlone .vjs-custom-control-spacer {
533
+ display: block;
534
+ flex: 1 1 auto;
584
535
  }
585
536
 
586
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
587
- margin: 0 0px 0 0px;
588
- }
589
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control{
590
- display: none;
537
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
538
+ z-index: 1;
591
539
  }
592
540
 
593
- .video-js.skin_news_live button.vjs-control.vjs-button.vjs-slowmo-button {
594
- font-size: 14px;
595
- font-weight: 500;
596
- align-self: center;
597
- height: min-content;
598
- padding: 5px 2px;
599
- border-radius: 8px;
600
- }
601
541
 
602
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
603
- height: 6px !important;
542
+ .video-js.skin_vlone .vjs-control-bar {
543
+ height: 40px;
604
544
  }
605
545
 
606
- .video-js.skin_news_live .vjs-play-progress:before {
607
- font-size: 1.5em;
608
- line-height: unset;
609
- top: -0.3333333333em;
546
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
547
+ .vjs-button>.vjs-icon-placeholder:before {
548
+ position: relative !important;
610
549
  }
611
-
612
- .video-js.skin_news_live .vjs-play-progress .vjs-time-tooltip {
613
- display: none !important;
550
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
551
+ display: flex;
552
+ left: 0px;
553
+ top: -1px;
614
554
  }
615
555
 
616
- /* */
617
- .video-js.skin_news_live .vjs-mouse-display{
618
- font-size: 1.6666666667em;
556
+ .vjs-button>.vjs-icon-placeholder:before {
557
+ font-size: 2em !important;
619
558
  }
620
559
 
621
- .video-js.skin_news_live .vjs-progress-control:hover .vjs-progress-holder {
622
- font-size: 1em !important;
560
+ .video-js.skin_vlone .vjs-control {
561
+ width: 4.3em;
623
562
  }
624
563
 
625
- .video-js.skin_news_live .vjs-button{
626
- width: 5.3em;
627
- display: flex;
628
- align-items: center;
629
- justify-content: center;
564
+ .vjs-menu-button-popup .vjs-menu {
565
+ bottom: 10px !important;
630
566
  }
631
567
 
632
568
 
633
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
634
- .icon-maximize {
635
- display: block;
636
- height: 32px;
569
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
570
+ height: 1.3em !important;
571
+ position: absolute !important;
572
+ top: -1.3em !important;
573
+ transition: height 0.3s, top 0.3s !important;
637
574
  }
638
575
 
639
- .video-js.skin_news_live .vjs-playback-rate .vjs-playback-rate-value{
640
- line-height: 4;
641
- }
642
576
 
643
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
644
- .icon-minimize {
645
- display: none;
646
- height: 32px;
577
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
578
+ display: none !important;
647
579
  }
648
580
 
649
- .video-js.skin_news_live button.vjs-play-control.vjs-control.vjs-button{
650
- outline: none !important;
651
- /* flex: 1; */
581
+ .video-js.skin_vlone .vjs-time-control {
582
+ display: block;
652
583
  }
653
- .video-js.skin_news_live .vjs-play-toggle-container{
654
- display: flex;
655
- flex: 1;
656
- justify-content: center;
584
+ .video-js.skin_vlone .vjs-remaining-time {
585
+ display: none;
657
586
  }
658
587
 
659
-
660
- .video-js.skin_news_live .vjs-fullscreen-control .vjs-icon-placeholder:before,
661
- .vjs-icon-fullscreen-enter:before {
662
- /* content: '' !important; */
588
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
589
+ line-height: 3.5em;
590
+ font-size: 1.1em;
591
+ min-width: 4em;
663
592
  }
664
593
 
665
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button {
666
- display: flex;
667
- justify-content: center;
668
- align-items: center;
669
- /* transform: rotate(90deg); */
594
+ .video-js.skin_vlone .vjs-time-divider > div{
595
+ display: flex;
596
+ justify-content: center;
670
597
  }
671
598
 
672
- .video-js.skin_news_live .vjs-subs-caps-button .vjs-icon-placeholder:before{
673
- display: none;
599
+ .video-js.skin_vlone .vjs-live-control{
600
+ align-items: center;
674
601
  }
675
- .video-js.skin_news_live .vjs-volume-panel .vjs-volume-control{
676
- margin-left: -10px;
602
+ .video-js.skin_vlone .vjs-live-display{
603
+ height: 2.2em;
604
+ display: flex;
605
+ align-items: center;
606
+ font-family: monospace;
607
+ width: 4em;
608
+ justify-content: center;
609
+ background: red;
610
+ margin: 4px 0px 4px 12px;
677
611
  }
678
-
679
- .video-js.skin_news_live .skipbtn:hover{
680
- cursor: pointer;
612
+ .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
613
+ background: #6b6b6b;
614
+ }
615
+ .video-js.skin_vlone .vjs-live-display:hover{
616
+ cursor: pointer;
681
617
  }
682
618
 
683
- .video-js.skin_news_live .rewindbtn:hover{
684
- cursor: pointer;
619
+ .video-js.skin_vlone .vjs-time-control {
620
+ line-height: 3.5em !important;
621
+ font-size: 1.1em !important;
622
+ width: min-content !important;
623
+ min-width: 1.5em;
624
+ padding: 0 !important;
625
+ user-select: none;
685
626
  }
686
627
 
687
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
688
- position: relative;
689
- padding-left: 0;
628
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
629
+ margin-left: 16px !important;
690
630
  }
691
631
 
692
- .video-js.skin_news_live.vjs-seeking .vjs-big-play-button{
693
- display: none !important;
632
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
633
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
634
+ font-size: 1.2em !important;
635
+ line-height: 1.5em !important;
636
+ padding: 0.2em 0.8em !important;
694
637
  }
695
638
 
696
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
697
- /* width: 90px;
698
- height: 90px;
639
+
640
+ /* Big play */
641
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
642
+ width: 80px;
643
+ height: 80px;
699
644
  display: flex;
700
645
  justify-content: center;
701
646
  align-items: center;
702
- border-radius: 50%;
647
+ border: none;
703
648
  position: absolute;
704
649
  top: 0;
705
650
  left: 0;
706
651
  right: 0;
707
652
  bottom: 0;
708
653
  margin: auto;
709
- font-size: 6em;
710
- line-height: 1.4em;
711
- border: 0.05em solid;
712
- color: inherit; */
713
- display: none !important;
654
+ font-size: 5em;
655
+ line-height: 1.3em;
656
+ transform: none !important;
657
+ border-radius: 1.3em;
714
658
  }
715
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control{
716
- font-weight: bold;
659
+ .video-js.skin_vlone .ssai-ad-container{
660
+ position: absolute;
661
+ bottom: 4px;
717
662
  }
663
+
664
+ @media(max-width:600px){
665
+ .video-js.skin_vlone button.vjs-big-play-button {
666
+ width: 50px !important;
667
+ height: 50px !important;
668
+ font-size: 2.1rem !important;
669
+ }
718
670
 
719
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content{
720
- bottom: 2.4em !important;
721
- right: -1em;
722
- z-index: 1;
671
+ .video-js.skin_vlone .ssai-ad-container {
672
+ position: absolute;
673
+ bottom: 2px;
723
674
  }
724
-
725
- .video-js.skin_news_live .vjs-chromecast-button .vjs-icon-placeholder {
675
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
676
+ display: none;
677
+ }
678
+
679
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
680
+ /* display: none; */
681
+ }
682
+
683
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
684
+ /* display: none; */
685
+ }
686
+ }
687
+ .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
688
+ text-decoration: underline;
689
+ }
690
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
691
+ font-size: 2.2em;
692
+ line-height: 2.6;
693
+ }
694
+ .video-js.skin_mini{
695
+ overflow: hidden;
696
+ }
697
+ .video-js.skin_mini .vjs-control-bar{
698
+ z-index: 1 !important;
699
+ height: 4em !important;
700
+ background: black !important;
701
+ }
702
+
703
+ .video-js.skin_mini .vjs-fade>* {
704
+ visibility: hidden !important;
705
+ opacity: 0 !important;
706
+ transition: visibility 1s, opacity 1s !important;
707
+ }
708
+
709
+ .video-js.skin_mini .custom-spaced-progress-bar {
710
+ position: absolute;
711
+ width: 100%;
712
+ display: flex;
713
+ height: 0.5em;
714
+ top: -0.5em;
715
+ }
716
+
717
+ .video-js.skin_mini .vjs-progress-control {
718
+ /* left: -6px; */
719
+ position: relative;
720
+ width: 100%;
721
+ height: 0.5em;
722
+ transition: height 0.1s, top 0.1s;
723
+ }
724
+
725
+
726
+
727
+
728
+ .video-js.skin_mini .vjs-custom-control-spacer {
729
+ display: block;
730
+ flex: 1 1 auto;
731
+ }
732
+
733
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
734
+ margin: 0 0px 0 0px;
735
+ }
736
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
737
+ display: none;
738
+ }
739
+
740
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
741
+ font-size: 14px;
742
+ font-weight: 500;
743
+ align-self: center;
744
+ height: min-content;
745
+ padding: 5px 2px;
746
+ border-radius: 8px;
747
+ }
748
+
749
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
750
+ height: 5px !important;
751
+ }
752
+
753
+ .video-js.skin_mini .vjs-play-progress:before {
754
+ font-size: 1.3em;
755
+ line-height: unset;
756
+ top: -0.3333333333em;
757
+ }
758
+
759
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
760
+ display: none !important;
761
+ }
762
+
763
+ /* */
764
+ .video-js.skin_mini .vjs-mouse-display{
765
+ font-size: 1.6666666667em;
766
+ }
767
+
768
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
769
+ font-size: 1em !important;
770
+ }
771
+
772
+ .video-js.skin_mini .vjs-button{
773
+ width: 3em;
774
+ display: flex;
775
+ align-items: center;
776
+ justify-content: center;
777
+ }
778
+
779
+
780
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
781
+ .icon-maximize {
782
+ display: block;
783
+ height: 32px;
784
+ }
785
+
786
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
787
+ line-height: 4;
788
+ }
789
+
790
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
791
+ .icon-minimize {
792
+ display: none;
793
+ height: 32px;
794
+ }
795
+
796
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
797
+ outline: none !important;
798
+ }
799
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
800
+ .vjs-icon-fullscreen-enter:before {
801
+ /* content: '' !important; */
802
+ }
803
+
804
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
805
+ display: flex;
806
+ justify-content: center;
807
+ align-items: center;
808
+ /* transform: rotate(90deg); */
809
+ }
810
+
811
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
812
+ display: none;
813
+ }
814
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
815
+ margin-left: -10px;
816
+ display: none;
817
+ }
818
+
819
+ .video-js.skin_mini .vjs-loading-spinner {
820
+ position: absolute;
821
+ top: 50%;
822
+ left: 50%;
823
+ transform: translate(-50%, -50%);
824
+ opacity: .85;
825
+ text-align: left;
826
+ border: .2em solid rgba(43, 51, 63, .7);
827
+ box-sizing: border-box;
828
+ background-clip: padding-box;
829
+ width: 3em;
830
+ height: 3em;
831
+ border-radius: 50%;
832
+ visibility: hidden;
833
+ }
834
+
835
+ .video-js.skin_mini .skipbtn:hover{
836
+ cursor: pointer;
837
+ }
838
+
839
+ .video-js.skin_mini .rewindbtn:hover{
840
+ cursor: pointer;
841
+ }
842
+
843
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
844
+ position: relative;
845
+ padding-left: 0;
846
+ }
847
+
848
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
849
+ width: 40px;
850
+ height: 40px;
851
+ display: flex;
852
+ justify-content: center;
853
+ align-items: center;
854
+ border: none;
855
+ position: absolute;
856
+ top: 0;
857
+ left: 0;
858
+ right: 0;
859
+ bottom: 0;
860
+ margin: auto;
861
+ font-size: 3em;
862
+ line-height: 1.3em;
863
+ transform: none !important;
864
+ border-radius: 1.3em;
865
+ }
866
+
867
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
868
+ font-weight: bold;
869
+ }
870
+
871
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
872
+ bottom: 1.1em !important;
873
+ right: 1em;
874
+ z-index: 1;
875
+ font-size: 10px;
876
+ }
877
+
878
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
726
879
  width: 24px !important;
727
880
  height: 24px !important;
728
881
  }
729
- .settings-selector-icon>svg{
882
+ .video-js.skin_mini .settings-selector-icon>svg{
730
883
  height: 19px !important;
731
884
  width: 19px !important;
732
885
  }
733
886
 
734
887
 
735
- .video-js.skin_news_live button.vjs-rewind-button{
888
+ .video-js.skin_mini button.vjs-rewind-button{
736
889
  cursor: pointer;
737
890
  }
738
891
 
739
- .video-js.skin_news_live .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
892
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
740
893
  padding-right: 0;
741
- display: none;
742
894
  }
743
895
 
744
- .video-js.skin_news_live .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
896
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
745
897
  padding-left: 0;
746
- display: none;
747
898
  }
748
899
 
749
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control.vjs-time-divider {
900
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
750
901
  padding-left: 0;
751
902
  padding-right: 0;
752
- display: none;
903
+ display: flex;
904
+ justify-content: center;
905
+ width: min-content;
753
906
  }
754
907
 
755
- .video-js.skin_news_live.vjs-live .vjs-control-bar .vjs-time-control {
908
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
756
909
  display: none
757
910
  }
758
- .video-js.skin_news_live.vjs-liveui .vjs-control-bar .vjs-time-control {
911
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
759
912
  display: none
760
913
  }
761
914
 
762
- .video-js.skin_news_live .vjs-control-bar .vjs-time-control {
763
- display: flex;
764
- align-items: center;
765
- font-weight: 700;
766
- font-size: 12px;
767
- min-width: 1.2em;
915
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
916
+ display: flex;
917
+ align-items: center;
918
+ font-weight: 700;
919
+ font-size: 9px;
920
+ min-width: 0.8em;
921
+ padding-left: 0;
768
922
  }
769
923
 
770
- .video-js.skin_news_live .vjs-remaining-time.vjs-time-control.vjs-control {
924
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
771
925
  display: none;
772
926
  font-size: 11px;
773
927
  justify-content: center;
774
928
  align-items: center;
775
929
  user-select: none;
776
930
  }
777
- .video-js.skin_news_live.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
931
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
778
932
  display: none;
779
933
  }
780
934
 
781
- .video-js.skin_news_live button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
935
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
782
936
  height: min-content;
783
937
  width: min-content;
784
938
  }
785
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
786
- width: 6em;
939
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
940
+ width: 3em;
941
+ margin-right: 4px;
787
942
  }
788
943
 
789
- .video-js.skin_news_live .content{
944
+ .video-js.skin_mini .content{
790
945
  bottom: 3.4rem !important;
791
946
  right: -4rem !important;
792
947
  }
793
948
 
794
- .setting-icon > svg{
949
+ .video-js.skin_mini .setting-icon > svg{
795
950
  height:18px !important;
796
951
  }
797
952
 
@@ -805,16 +960,16 @@
805
960
  pointer-events:none
806
961
  }
807
962
 
808
- .video-js.skin_news_live iframe{
963
+ .video-js.skin_mini iframe{
809
964
  width: 100%;
810
965
  height: 100%;
811
966
  }
812
967
 
813
- .video-js.skin_news_live .vjs-live-control{
968
+ .video-js.skin_mini .vjs-live-control{
814
969
  align-items: center;
815
- display: none;
970
+ max-width: 5em;
816
971
  }
817
- .video-js.skin_news_live .vjs-live-control.vjs-control .vjs-live-display{
972
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
818
973
  height: 2.2em;
819
974
  display: flex;
820
975
  align-items: center;
@@ -822,419 +977,545 @@
822
977
  width: 4em;
823
978
  justify-content: center;
824
979
  background: red;
825
- margin: 4px 0px 4px 12px;
980
+ margin: 4px 0px 4px 2px;
826
981
  }
827
982
 
828
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control:focus{
983
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
829
984
  text-shadow: none;
830
985
  }
831
-
832
- .video-js.skin_news_live .vjs-control-bar .vjs-seek-to-live-control.vjs-control{
833
- display: flex;
834
- justify-content: center;
835
- min-width: 5.3em;
836
- pointer-events: none;
837
- user-select: none;
838
- }
839
-
840
- .video-js.skin_news_live .vjs-seek-to-live-control.vjs-control .vjs-icon-placeholder::before{
841
- color: white;
986
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
987
+ display: none;
988
+ font-size: 12px;
842
989
  }
843
990
 
844
-
845
- .settings-selection.vjs-control.vjs-button{
846
- display: flex !important;
991
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
992
+ height: 1.8em;
993
+ display: inline-flex;
994
+ align-items: center;
995
+ font-family: monospace;
996
+ justify-content: center;
997
+ border: 1.5px solid;
998
+ margin: 4px 0px 4px 2px;
999
+ white-space: pre;
1000
+ padding: 2px 4px;
1001
+ font-size: 1.2em;
1002
+ font-weight: 500;
1003
+ color: rgba(255, 255, 2555, 0.7);
847
1004
  }
848
1005
 
849
- @media(max-width:576px){
850
- .settings-selection.vjs-control.vjs-button{
851
- display: none !important;
852
- }
1006
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1007
+ content: "NOT LIVE";
1008
+ word-spacing: -4px;
853
1009
  }
854
1010
 
855
1011
 
856
- @media(max-width:576px){
1012
+ @media(max-width:600px){
857
1013
  .tvProviderImage{
858
1014
  display: none
859
1015
  }
860
- .video-js.skin_news_live .vjs-fullscreen .icon-minimize,
1016
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
861
1017
  .icon-maximize {
862
1018
  height: 30px !important;
863
1019
  }
864
1020
 
865
- .video-js.skin_news_live .vjs-fullscreen .icon-maximize,
1021
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
866
1022
  .icon-minimize {
867
1023
  height: 30px !important;
868
1024
  }
869
- .video-js.skin_news_live .vjs-volume-panel.vjs-volume-panel-vertical{
870
- width: 4.5em;
1025
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1026
+ width: 3.5em;
871
1027
  }
872
- .video-js.skin_news_live button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1028
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
873
1029
  height: min-content;
874
1030
  }
875
1031
 
876
- .video-js.skin_news_live button.vjs-slowmo-button{
1032
+ .video-js.skin_mini button.vjs-slowmo-button{
877
1033
  display: none;
878
1034
  }
879
- .video-js.skin_news_live button.vjs-rewind-button{
1035
+ .video-js.skin_mini button.vjs-rewind-button{
880
1036
  display: none;
881
1037
  }
882
- .video-js.skin_news_live button.vjs-rewind-button>svg{
1038
+ .video-js.skin_mini button.vjs-rewind-button>svg{
883
1039
  height: 20px;
884
1040
  }
885
- .video-js.skin_news_live .vjs-button{
886
- width: 4.8em;
1041
+ .video-js.skin_mini .vjs-button{
1042
+ width: 3em;
887
1043
  }
888
- .video-js.skin_news_live .widget-selection{
1044
+ .video-js.skin_mini .widget-selection{
889
1045
  display: none;
890
1046
  }
891
- .video-js.skin_news_live .container{
1047
+ .video-js.skin_mini .container{
892
1048
  display: none !important;
893
1049
  }
894
- .video-js.skin_news_live .vjs-control-bar{
1050
+ .video-js.skin_mini .vjs-control-bar{
895
1051
  height: 4em !important;
896
1052
  }
897
- .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before{
1053
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
898
1054
  font-size: 2.5em;
899
1055
  line-height: 1.5;
900
1056
  }
901
- .video-js.skin_news_live .vjs-play-progress:before {
1057
+ .video-js.skin_mini .vjs-play-progress:before {
902
1058
  font-size: 1.2em;
903
1059
  position: absolute;
904
1060
  right: -0.5em;
905
1061
  z-index: 1;
906
1062
  }
907
- .video-js.skin_news_live button.vjs-skip-button>svg{
1063
+ .video-js.skin_mini button.vjs-skip-button>svg{
908
1064
  height: 20px;
909
1065
  }
910
- .video-js.skin_news_live button.vjs-big-play-button {
911
- width: 50px !important;
912
- height: 50px !important;
913
- font-size: 2.1rem !important;
914
- }
915
1066
 
916
1067
  .stream-selector-icon>svg{
917
1068
  width: 24px;
918
1069
  height: 24px;
919
1070
  }
920
- .video-js.skin_news_live.vjs-live .vjs-progress-control .vjs-progress-holder{
921
- margin: 0 12px 0 12px;
922
- }
923
- .video-js.skin_news_live .vjs-seek-to-live-text{
1071
+ .video-js.skin_mini .vjs-seek-to-live-text{
924
1072
  font-size: 12px;
925
1073
  }
926
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder {
927
- margin: 0 12px 0 12px;
928
- }
929
1074
  }
930
- .video-js.skin_news_live.vjs-paused .vjs-big-play-button {
931
- width: 90px;
932
- height: 90px;
933
- display: flex;
934
- justify-content: center;
935
- align-items: center;
936
- border-radius: 50%;
937
- position: absolute;
938
- top: 0;
939
- left: 0;
940
- right: 0;
941
- bottom: 0;
942
- margin: auto;
943
- font-size: 6em;
944
- line-height: 1.4em;
1075
+
1076
+
1077
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1078
+ background-color: rgba(0, 0, 0, 0.2);
945
1079
  }
946
1080
 
947
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1081
+
1082
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
948
1083
  display: flex;
949
1084
  justify-content: center;
950
1085
  align-items: center;
951
1086
  height: 100%;
952
1087
  transition: width 0.1s;
953
1088
  }
1089
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1090
+ margin: 2px;
1091
+ }
954
1092
 
955
- .video-js.skin_news_live .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1093
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
956
1094
  display: flex;
957
1095
  justify-content: center;
958
1096
  align-items: center;
959
1097
  height: 100%;
960
1098
  transition: width 0.1s;
961
1099
  }
962
- .video-js.skin_news_live.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
963
- display: none !important;
1100
+
1101
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1102
+ display: block;
1103
+ font-size: 10px;
1104
+ padding: 6px 10px;
1105
+ margin: 0;
1106
+ max-height: 100%;
1107
+ overflow-y: auto;
1108
+ }
1109
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
1110
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
1111
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
1112
+ display: block;
1113
+ width: 100%;
1114
+ }
1115
+ .video-js.skin_mini .vjs-text-track-settings fieldset{
1116
+ margin: 4px 0;
1117
+ }
1118
+ .video-js.skin_mini .vjs-text-track-settings fieldset span{
1119
+ display: block;
1120
+ padding: 0 0 6px;
1121
+ }
1122
+ .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
1123
+ max-width: 100%;
964
1124
  }
965
1125
 
966
- @media (max-width: 576px) {
967
- .video-js.skin_news_live .vjs-progress-control .vjs-progress-holder{
1126
+ @media (max-width: 600px) {
1127
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
968
1128
  height: 5px !important;
969
1129
  }
970
- .video-js.skin_news_live button.vjs-big-play-button {
971
- width: 50px !important;
972
- height: 50px !important;
973
- font-size: 2.1rem !important;
974
- }
975
1130
 
976
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1131
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
977
1132
  display: none;
978
1133
  }
979
- .video-js.skin_news_live .vjs-menu > ul.vjs-menu-content {
980
- bottom: 2.4em !important;
981
- right: -1em;
982
- z-index: 1;
983
- }
984
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
985
- display: none !important;
986
- }
987
1134
 
988
1135
  }
989
1136
 
990
- .video-js.skin_news_live .vjs-text-track-display-ttml {
991
- width: 100% !important;
1137
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1138
+ content: none !important;
1139
+ fill: none !important;
1140
+ filter: none !important;
992
1141
  }
993
1142
 
994
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
995
- .video-js.skin_news_live .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
996
- font-size: 1.2em !important;
997
- line-height: 1.5em !important;
998
- padding: 0.2em 0.8em !important;
1143
+ /* svg icons opacity and hover effect */
1144
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1145
+ opacity: 0.7 !important;
999
1146
  }
1000
1147
 
1001
- .video-js.skin_news_live .vjs-control-bar .vjs-svg-icon{
1002
- content: none !important;
1003
- fill: none !important;
1004
- filter: none !important;
1148
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1149
+ opacity: 1 !important;
1005
1150
  }
1006
1151
 
1007
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1152
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1008
1153
  color: rgba(255, 255, 2555, 0.7)!important;
1009
1154
  }
1010
1155
 
1011
- .video-js.skin_news_live .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1156
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1012
1157
  color: rgba(255, 255, 2555, 1)!important;
1013
1158
  }
1014
1159
 
1015
1160
 
1016
1161
 
1017
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
1018
- height: 0.7em !important;
1019
- position: absolute !important;
1020
- top: -0.7em !important;
1021
- width: 100% !important;
1162
+ .video-js.skin_cn_news .vjs-control-bar {
1163
+ z-index: 1 !important;
1164
+ height: auto !important;
1165
+ padding: 0.8em 30px 0.6em;
1166
+ background: transparent !important;
1167
+ display: flex;
1168
+ flex-wrap: wrap;
1169
+ align-items: center;
1170
+ column-gap: 10px;
1022
1171
  }
1023
1172
 
1024
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
1025
- height: 100%;
1173
+
1174
+ .video-js.skin_cn_news .vjs-control-bar::before {
1175
+ content: '';
1176
+ position: absolute;
1177
+ left: 0;
1178
+ right: 0;
1179
+ bottom: 0;
1180
+ top: -3em;
1181
+ background: linear-gradient(
1182
+ to top,
1183
+ rgba(0, 0, 0, 0.85) 0%,
1184
+ rgba(0, 0, 0, 0.7) 40%,
1185
+ rgba(0, 0, 0, 0.55) 70%,
1186
+ rgba(0, 0, 0, 0.38) 86%,
1187
+ transparent 100%
1188
+ );
1189
+ pointer-events: none;
1190
+ z-index: -1;
1026
1191
  }
1027
1192
 
1028
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
1029
- line-height: 2.5;
1193
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1194
+ order: -1;
1195
+ flex: 0 0 100%;
1196
+ width: 80%;
1197
+ margin: 0 0 5em;
1198
+ position: relative;
1030
1199
  }
1031
1200
 
1032
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
1033
- height: 19px;
1034
- width: 19px;
1035
- cursor: pointer;
1201
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1202
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1203
+ width: auto;
1204
+ min-width: 0;
1036
1205
  }
1037
- .video-js.skin_vlone .vjs-control {
1038
- user-select: none;
1206
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1207
+ display: inline-flex;
1208
+ align-items: center;
1209
+ justify-content: center;
1210
+ height: 7em;
1211
+ padding: 0 10px;
1212
+ color: #fff;
1039
1213
  }
1040
- .video-js.skin_vlone .vjs-custom-control-spacer{
1041
- user-select: none;
1214
+
1215
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1216
+ content: none !important;
1042
1217
  }
1043
1218
 
1044
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
1045
- height: 19px;
1046
- width: 19px;
1047
- cursor: pointer;
1048
- }
1049
1219
 
1050
- .video-js.skin_vlone .vjs-play-progress:before {
1051
- display: none !important;
1220
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1221
+ display: inline-flex;
1222
+ align-items: center;
1223
+ justify-content: center;
1052
1224
  }
1053
-
1054
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
1055
- margin: 0 !important;
1056
-
1225
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1226
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1227
+ width: 24px;
1228
+ height: 24px;
1229
+ display: block;
1057
1230
  }
1058
1231
 
1059
1232
 
1060
- .video-js.skin_vlone .vjs-custom-control-spacer {
1061
- display: block;
1062
- flex: 1 1 auto;
1063
- }
1064
1233
 
1065
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
1066
- z-index: 1;
1234
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1235
+ opacity: 1;
1067
1236
  }
1068
1237
 
1069
1238
 
1070
- .video-js.skin_vlone .vjs-control-bar {
1071
- height: 40px;
1072
- }
1073
1239
 
1074
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
1075
- .vjs-button>.vjs-icon-placeholder:before {
1076
- position: relative !important;
1077
- }
1078
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
1079
- display: flex;
1080
- left: 0px;
1081
- top: -1px;
1240
+ .video-js.skin_cn_news .vjs-volume-panel {
1241
+ margin: 0;
1242
+ display: inline-flex;
1243
+ align-items: center;
1244
+ align-self: center;
1245
+ height: 2.2em;
1246
+ min-width: 7em;
1247
+ transition: none;
1082
1248
  }
1083
-
1084
- .vjs-button>.vjs-icon-placeholder:before {
1085
- font-size: 2em !important;
1249
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1250
+ width: 0;
1251
+ height: 100%;
1252
+ display: flex;
1253
+ align-items: center;
1254
+ overflow: hidden;
1255
+ opacity: 0;
1256
+ transition: width 0.15s ease, opacity 0.15s ease;
1086
1257
  }
1087
-
1088
- .video-js.skin_vlone .vjs-control {
1089
- width: 4.3em;
1258
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1259
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1260
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1261
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1262
+ width: 5em;
1263
+ opacity: 1;
1090
1264
  }
1091
1265
 
1092
- .vjs-menu-button-popup .vjs-menu {
1093
- bottom: 10px !important;
1266
+ .video-js.skin_cn_news .vjs-volume-bar {
1267
+ width: 4em;
1268
+ height: 0.3em;
1269
+ margin: 0 0.45em;
1094
1270
  }
1095
1271
 
1096
1272
 
1097
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
1098
- height: 1.3em !important;
1099
- position: absolute !important;
1100
- top: -1.3em !important;
1101
- transition: height 0.3s, top 0.3s !important;
1273
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1274
+ display: none !important;
1102
1275
  }
1103
1276
 
1104
-
1105
- .video-js.skin_vlone.vjs-live .vjs-time-control{
1106
- display: none !important;
1277
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1278
+ width: 0 !important;
1107
1279
  }
1108
1280
 
1109
- .video-js.skin_vlone .vjs-time-control {
1110
- display: block;
1111
- }
1112
- .video-js.skin_vlone .vjs-remaining-time {
1113
- display: none;
1114
- }
1115
1281
 
1116
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
1117
- line-height: 3.5em;
1118
- font-size: 1.1em;
1119
- min-width: 4em;
1282
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1283
+ display: block !important;
1284
+ flex: 1 1 auto;
1120
1285
  }
1121
1286
 
1122
- .video-js.skin_vlone .vjs-time-divider > div{
1123
- display: flex;
1124
- justify-content: center;
1125
- }
1126
1287
 
1127
- .video-js.skin_vlone .vjs-live-control{
1128
- align-items: center;
1129
- }
1130
- .video-js.skin_vlone .vjs-live-display{
1131
- height: 2.2em;
1132
- display: flex;
1133
- align-items: center;
1134
- font-family: monospace;
1135
- width: 4em;
1136
- justify-content: center;
1137
- background: red;
1138
- margin: 4px 0px 4px 12px;
1288
+ .video-js.skin_cn_news .vjs-big-play-button {
1289
+ display: none;
1139
1290
  }
1140
- .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
1141
- background: #6b6b6b;
1291
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1292
+ position: relative !important;
1293
+ display: flex;
1294
+ left: 0;
1295
+ top: -1px;
1142
1296
  }
1143
- .video-js.skin_vlone .vjs-live-display:hover{
1144
- cursor: pointer;
1297
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1298
+ display: flex;
1299
+ justify-content: center;
1300
+ align-items: center;
1301
+ position: absolute;
1302
+ top: 0;
1303
+ left: 0;
1304
+ right: 0;
1305
+ bottom: 0;
1306
+ margin: auto;
1307
+ width: 80px;
1308
+ height: 80px;
1309
+ border: none;
1310
+ border-radius: 50%;
1311
+ background: rgba(0, 0, 0, 0.55);
1312
+ font-size: 5em;
1313
+ line-height: 1.3em;
1314
+ transform: none !important;
1145
1315
  }
1146
1316
 
1147
- .video-js.skin_vlone .vjs-time-control {
1148
- line-height: 3.5em !important;
1149
- font-size: 1.1em !important;
1150
- width: min-content !important;
1151
- min-width: 1.5em;
1152
- padding: 0 !important;
1153
- user-select: none;
1317
+
1318
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1319
+ height: 4px !important;
1320
+ margin: 0;
1321
+ border-radius: 20px;
1322
+ background-color: #393944;
1154
1323
  }
1155
1324
 
1156
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
1157
- margin-left: 16px !important;
1325
+ .video-js.skin_cn_news .vjs-play-progress {
1326
+ background-color: #ffffff;
1327
+ border-radius: 20px;
1158
1328
  }
1159
1329
 
1160
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1161
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1162
- font-size: 1.2em !important;
1163
- line-height: 1.5em !important;
1164
- padding: 0.2em 0.8em !important;
1330
+ .video-js.skin_cn_news .vjs-load-progress,
1331
+ .video-js.skin_cn_news .vjs-load-progress div {
1332
+ background: rgba(255, 255, 255, 0.15);
1333
+ border-radius: 20px;
1165
1334
  }
1166
1335
 
1167
1336
 
1168
- /* Big play */
1169
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
1170
- width: 80px;
1171
- height: 80px;
1172
- display: flex;
1173
- justify-content: center;
1174
- align-items: center;
1175
- border: none;
1176
- position: absolute;
1177
- top: 0;
1178
- left: 0;
1179
- right: 0;
1180
- bottom: 0;
1181
- margin: auto;
1182
- font-size: 5em;
1183
- line-height: 1.3em;
1184
- transform: none !important;
1185
- border-radius: 1.3em;
1337
+ .video-js.skin_cn_news .vjs-play-progress:before {
1338
+ content: '';
1339
+ width: 16px;
1340
+ height: 16px;
1341
+ border-radius: 50%;
1342
+ background: #ffffff;
1343
+ border: 2px solid rgba(0, 0, 0, 0.6);
1344
+ box-sizing: border-box;
1345
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1346
+ top: -6px;
1347
+ right: -8px;
1348
+ position: absolute;
1186
1349
  }
1187
- .video-js.skin_vlone .ssai-ad-container{
1188
- position: absolute;
1189
- bottom: 4px;
1350
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1351
+ display: none !important;
1190
1352
  }
1191
-
1192
- @media(max-width:600px){
1193
- .video-js.skin_vlone button.vjs-big-play-button {
1194
- width: 50px !important;
1195
- height: 50px !important;
1196
- font-size: 2.1rem !important;
1197
- }
1198
1353
 
1199
- .video-js.skin_vlone .ssai-ad-container {
1200
- position: absolute;
1201
- bottom: 2px;
1202
- }
1203
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
1204
- display: none;
1354
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1355
+ background: #ffffff;
1356
+ color: #0a0e17;
1357
+ font-weight: 700;
1358
+ border-radius: 3px;
1205
1359
  }
1206
1360
 
1207
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
1208
- /* display: none; */
1361
+ .video-js.skin_cn_news .vjs-live-control {
1362
+ display: none !important;
1209
1363
  }
1210
-
1211
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
1212
- /* display: none; */
1364
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1365
+ display: inline-flex;
1366
+ align-items: center;
1367
+ align-self: center;
1368
+ height: 2.2em;
1369
+ gap: 5px;
1370
+ width: auto;
1371
+ padding: 0 10px;
1372
+ border: 1px solid rgba(255, 255, 255, 0.45);
1373
+ border-radius: 4px;
1374
+ cursor: pointer;
1213
1375
  }
1376
+
1377
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1378
+ display: none;
1214
1379
  }
1215
- .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
1216
- text-decoration: underline;
1380
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1381
+ display: inline-flex;
1382
+ align-items: center;
1217
1383
  }
1218
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1219
- font-size: 2.2em;
1220
- line-height: 2.6;
1384
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1385
+ content: '';
1386
+ display: inline-block;
1387
+ width: 8px;
1388
+ height: 8px;
1389
+ border-radius: 50%;
1390
+ background: #ff2d2d; /* red live dot */
1221
1391
  }
1222
- .video-js.skin_mini{
1223
- overflow: hidden;
1392
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1393
+ color: #ffffff;
1394
+ font-weight: 700;
1395
+ font-size: 12px;
1396
+ letter-spacing: 0.03em;
1224
1397
  }
1225
- .video-js.skin_mini .vjs-control-bar{
1398
+
1399
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1400
+ border-color: transparent;
1401
+ }
1402
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1403
+ color: #ff2d2d;
1404
+ }
1405
+
1406
+ /* ---- time controls ---- */
1407
+ .video-js.skin_cn_news .vjs-current-time,
1408
+ .video-js.skin_cn_news .vjs-duration,
1409
+ .video-js.skin_cn_news .vjs-time-divider {
1410
+ display: none !important;
1411
+ }
1412
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1413
+ display: none;
1414
+ align-items: center;
1415
+ justify-content: center;
1416
+ font-size: 11px;
1417
+ font-weight: 700;
1418
+ color: #fff;
1419
+ padding: 0 6px;
1420
+ user-select: none;
1421
+ }
1422
+
1423
+
1424
+ .video-js.skin_cn_news .vjs-chapter-marker {
1425
+ z-index: 2;
1426
+ width: var(--vl-chapter-size, 8px);
1427
+ height: var(--vl-chapter-size, 8px);
1428
+ top: 50%;
1429
+ bottom: auto;
1430
+ background: var(--vl-chapter-color, #ffffff);
1431
+ opacity: var(--vl-chapter-opacity, 1);
1432
+ border-radius: 50%;
1433
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1434
+ transform: translate(-50%, -50%) scale(1);
1435
+ transition: background-color 0.12s ease;
1436
+ }
1437
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1438
+ background: var(--vl-chapter-hover, #0a5cff);
1439
+ }
1440
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1441
+ background: var(--vl-chapter-active, #0a5cff);
1442
+ }
1443
+
1444
+
1445
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1446
+ width: 16px;
1447
+ height: 16px;
1448
+ bottom: 160%;
1449
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1450
+ }
1451
+
1452
+
1453
+ .video-js.skin_cn_news .vjs-chapter-preview {
1454
+ background: var(--vl-chapter-tooltip, #0a5cff);
1455
+ border-radius: 6px;
1456
+ padding: 8px 10px;
1457
+ width: max-content;
1458
+ max-width: 300px;
1459
+ text-align: left;
1460
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1461
+ }
1462
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1463
+ color: #ffffff;
1464
+ font-size: 13px;
1465
+ font-weight: 400;
1466
+ margin-bottom: 2px;
1467
+ }
1468
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1469
+ color: #ffffff;
1470
+ font-size: 13px;
1471
+ font-weight: 400;
1472
+ line-height: 1.3;
1473
+ white-space: normal;
1474
+ text-align: left;
1475
+ }
1476
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1477
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1478
+ }
1479
+
1480
+ /* ---- responsive ---- */
1481
+ @media (max-width: 576px) {
1482
+ .video-js.skin_cn_news .vjs-control-bar {
1483
+ height: 3.2em !important;
1484
+ padding: 0 8px;
1485
+ }
1486
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1487
+ padding: 0 6px;
1488
+ }
1489
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1490
+ display: none !important;
1491
+ }
1492
+ }
1493
+
1494
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1495
+ font-size: 2.2em;
1496
+ line-height: 2.6;
1497
+ }
1498
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1499
+ background: white;
1500
+ }
1501
+ .video-js.skin_news .vjs-control-bar{
1226
1502
  z-index: 1 !important;
1227
- height: 4em !important;
1503
+ height: 5em !important;
1228
1504
  background: black !important;
1229
1505
  }
1506
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1507
+ display: flex;
1508
+ align-items: center;
1509
+ justify-content: center;
1510
+ }
1230
1511
 
1231
- .video-js.skin_mini .vjs-fade>* {
1512
+ .video-js.skin_news .vjs-fade>* {
1232
1513
  visibility: hidden !important;
1233
1514
  opacity: 0 !important;
1234
1515
  transition: visibility 1s, opacity 1s !important;
1235
1516
  }
1236
1517
 
1237
- .video-js.skin_mini .custom-spaced-progress-bar {
1518
+ .video-js.skin_news .custom-spaced-progress-bar {
1238
1519
  position: absolute;
1239
1520
  width: 100%;
1240
1521
  display: flex;
@@ -1242,7 +1523,7 @@
1242
1523
  top: -0.5em;
1243
1524
  }
1244
1525
 
1245
- .video-js.skin_mini .vjs-progress-control {
1526
+ .video-js.skin_news .vjs-progress-control {
1246
1527
  /* left: -6px; */
1247
1528
  position: relative;
1248
1529
  width: 100%;
@@ -1253,19 +1534,19 @@
1253
1534
 
1254
1535
 
1255
1536
 
1256
- .video-js.skin_mini .vjs-custom-control-spacer {
1537
+ .video-js.skin_news .vjs-custom-control-spacer {
1257
1538
  display: block;
1258
1539
  flex: 1 1 auto;
1259
1540
  }
1260
1541
 
1261
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1542
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1262
1543
  margin: 0 0px 0 0px;
1263
1544
  }
1264
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1545
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1265
1546
  display: none;
1266
1547
  }
1267
1548
 
1268
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1549
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1269
1550
  font-size: 14px;
1270
1551
  font-weight: 500;
1271
1552
  align-self: center;
@@ -1274,158 +1555,143 @@
1274
1555
  border-radius: 8px;
1275
1556
  }
1276
1557
 
1277
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1278
- height: 5px !important;
1558
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1559
+ height: 6px !important;
1279
1560
  }
1280
1561
 
1281
- .video-js.skin_mini .vjs-play-progress:before {
1282
- font-size: 1.3em;
1562
+ .video-js.skin_news .vjs-play-progress:before {
1563
+ font-size: 1.5em;
1283
1564
  line-height: unset;
1284
1565
  top: -0.3333333333em;
1285
1566
  }
1286
1567
 
1287
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1568
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1288
1569
  display: none !important;
1289
1570
  }
1290
1571
 
1291
1572
  /* */
1292
- .video-js.skin_mini .vjs-mouse-display{
1573
+ .video-js.skin_news .vjs-mouse-display{
1293
1574
  font-size: 1.6666666667em;
1294
1575
  }
1295
1576
 
1296
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1577
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1297
1578
  font-size: 1em !important;
1298
1579
  }
1299
1580
 
1300
- .video-js.skin_mini .vjs-button{
1301
- width: 3em;
1581
+ .video-js.skin_news .vjs-button{
1582
+ width: 5.3em;
1302
1583
  display: flex;
1303
1584
  align-items: center;
1304
1585
  justify-content: center;
1305
1586
  }
1306
1587
 
1307
1588
 
1308
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1589
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1309
1590
  .icon-maximize {
1310
1591
  display: block;
1311
1592
  height: 32px;
1312
1593
  }
1313
1594
 
1314
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1595
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1315
1596
  line-height: 4;
1316
1597
  }
1317
1598
 
1318
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1599
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1319
1600
  .icon-minimize {
1320
1601
  display: none;
1321
1602
  height: 32px;
1322
1603
  }
1323
1604
 
1324
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1605
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1325
1606
  outline: none !important;
1326
1607
  }
1327
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1608
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1328
1609
  .vjs-icon-fullscreen-enter:before {
1329
1610
  /* content: '' !important; */
1330
1611
  }
1331
1612
 
1332
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1613
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1333
1614
  display: flex;
1334
1615
  justify-content: center;
1335
1616
  align-items: center;
1336
1617
  /* transform: rotate(90deg); */
1337
1618
  }
1338
1619
 
1339
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1620
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1340
1621
  display: none;
1341
1622
  }
1342
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1623
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1343
1624
  margin-left: -10px;
1344
- display: none;
1345
- }
1346
-
1347
- .video-js.skin_mini .vjs-loading-spinner {
1348
- position: absolute;
1349
- top: 50%;
1350
- left: 50%;
1351
- transform: translate(-50%, -50%);
1352
- opacity: .85;
1353
- text-align: left;
1354
- border: .2em solid rgba(43, 51, 63, .7);
1355
- box-sizing: border-box;
1356
- background-clip: padding-box;
1357
- width: 3em;
1358
- height: 3em;
1359
- border-radius: 50%;
1360
- visibility: hidden;
1361
1625
  }
1362
1626
 
1363
- .video-js.skin_mini .skipbtn:hover{
1627
+ .video-js.skin_news .skipbtn:hover{
1364
1628
  cursor: pointer;
1365
1629
  }
1366
1630
 
1367
- .video-js.skin_mini .rewindbtn:hover{
1631
+ .video-js.skin_news .rewindbtn:hover{
1368
1632
  cursor: pointer;
1369
1633
  }
1370
1634
 
1371
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1635
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1372
1636
  position: relative;
1373
1637
  padding-left: 0;
1374
1638
  }
1375
1639
 
1376
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1377
- width: 40px;
1378
- height: 40px;
1379
- display: flex;
1380
- justify-content: center;
1381
- align-items: center;
1382
- border: none;
1383
- position: absolute;
1384
- top: 0;
1385
- left: 0;
1386
- right: 0;
1387
- bottom: 0;
1388
- margin: auto;
1389
- font-size: 3em;
1390
- line-height: 1.3em;
1391
- transform: none !important;
1392
- border-radius: 1.3em;
1640
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1641
+ display: none !important;
1393
1642
  }
1394
1643
 
1395
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1644
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1645
+ width: 90px;
1646
+ height: 90px;
1647
+ display: flex;
1648
+ justify-content: center;
1649
+ align-items: center;
1650
+ border-radius: 50%;
1651
+ position: absolute;
1652
+ top: 0;
1653
+ left: 0;
1654
+ right: 0;
1655
+ bottom: 0;
1656
+ margin: auto;
1657
+ font-size: 6em;
1658
+ line-height: 1.4em;
1659
+ border: 0.05em solid;
1660
+ color: inherit;
1661
+ }
1662
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1396
1663
  font-weight: bold;
1397
1664
  }
1398
1665
 
1399
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1400
- bottom: 1.1em !important;
1401
- right: 1em;
1666
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1667
+ bottom: 2.4em !important;
1668
+ right: -1em;
1402
1669
  z-index: 1;
1403
- font-size: 10px;
1404
1670
  }
1405
1671
 
1406
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1672
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1407
1673
  width: 24px !important;
1408
1674
  height: 24px !important;
1409
1675
  }
1410
- .video-js.skin_mini .settings-selector-icon>svg{
1676
+ .settings-selector-icon>svg{
1411
1677
  height: 19px !important;
1412
1678
  width: 19px !important;
1413
1679
  }
1414
1680
 
1415
1681
 
1416
- .video-js.skin_mini button.vjs-rewind-button{
1682
+ .video-js.skin_news button.vjs-rewind-button{
1417
1683
  cursor: pointer;
1418
1684
  }
1419
1685
 
1420
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1686
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1421
1687
  padding-right: 0;
1422
1688
  }
1423
1689
 
1424
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1690
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1425
1691
  padding-left: 0;
1426
1692
  }
1427
1693
 
1428
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1694
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1429
1695
  padding-left: 0;
1430
1696
  padding-right: 0;
1431
1697
  display: flex;
@@ -1433,48 +1699,46 @@
1433
1699
  width: min-content;
1434
1700
  }
1435
1701
 
1436
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1702
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1437
1703
  display: none
1438
1704
  }
1439
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1705
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1440
1706
  display: none
1441
1707
  }
1442
1708
 
1443
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1444
- display: flex;
1445
- align-items: center;
1446
- font-weight: 700;
1447
- font-size: 9px;
1448
- min-width: 0.8em;
1449
- padding-left: 0;
1709
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
1710
+ display: flex;
1711
+ align-items: center;
1712
+ font-weight: 700;
1713
+ font-size: 12px;
1714
+ min-width: 1.2em;
1450
1715
  }
1451
1716
 
1452
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1717
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1453
1718
  display: none;
1454
1719
  font-size: 11px;
1455
1720
  justify-content: center;
1456
1721
  align-items: center;
1457
1722
  user-select: none;
1458
1723
  }
1459
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1724
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1460
1725
  display: none;
1461
1726
  }
1462
1727
 
1463
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1728
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1464
1729
  height: min-content;
1465
1730
  width: min-content;
1466
1731
  }
1467
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1468
- width: 3em;
1469
- margin-right: 4px;
1732
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1733
+ width: 6em;
1470
1734
  }
1471
1735
 
1472
- .video-js.skin_mini .content{
1736
+ .video-js.skin_news .content{
1473
1737
  bottom: 3.4rem !important;
1474
1738
  right: -4rem !important;
1475
1739
  }
1476
1740
 
1477
- .video-js.skin_mini .setting-icon > svg{
1741
+ .setting-icon > svg{
1478
1742
  height:18px !important;
1479
1743
  }
1480
1744
 
@@ -1488,16 +1752,15 @@
1488
1752
  pointer-events:none
1489
1753
  }
1490
1754
 
1491
- .video-js.skin_mini iframe{
1755
+ .video-js.skin_news iframe{
1492
1756
  width: 100%;
1493
1757
  height: 100%;
1494
1758
  }
1495
1759
 
1496
- .video-js.skin_mini .vjs-live-control{
1760
+ .video-js.skin_news .vjs-live-control{
1497
1761
  align-items: center;
1498
- max-width: 5em;
1499
1762
  }
1500
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1763
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1501
1764
  height: 2.2em;
1502
1765
  display: flex;
1503
1766
  align-items: center;
@@ -1505,520 +1768,257 @@
1505
1768
  width: 4em;
1506
1769
  justify-content: center;
1507
1770
  background: red;
1508
- margin: 4px 0px 4px 2px;
1771
+ margin: 4px 0px 4px 12px;
1509
1772
  }
1510
1773
 
1511
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1774
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1512
1775
  text-shadow: none;
1513
1776
  }
1514
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1777
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1515
1778
  display: none;
1516
1779
  font-size: 12px;
1517
1780
  }
1518
1781
 
1519
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1520
- height: 1.8em;
1782
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1783
+ height: 2.2em;
1521
1784
  display: inline-flex;
1522
1785
  align-items: center;
1523
- font-family: monospace;
1786
+ /* font-family: monospace; */
1524
1787
  justify-content: center;
1525
- border: 1.5px solid;
1526
- margin: 4px 0px 4px 2px;
1788
+ border: 2px solid;
1789
+ margin: 4px 0px 4px 6px;
1527
1790
  white-space: pre;
1528
- padding: 2px 4px;
1791
+ padding: 0px 6px;
1529
1792
  font-size: 1.2em;
1530
1793
  font-weight: 500;
1531
1794
  color: rgba(255, 255, 2555, 0.7);
1795
+
1796
+ letter-spacing: -.1px;
1797
+ line-height: normal;
1798
+ text-transform: uppercase;
1799
+ color: #FFFFFF;
1800
+ opacity: .7;
1801
+ font-family: "Proxima Nova";
1532
1802
  }
1533
1803
 
1534
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1804
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1805
+ opacity: 1;
1806
+ }
1807
+
1808
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1535
1809
  content: "NOT LIVE";
1536
- word-spacing: -4px;
1537
1810
  }
1538
1811
 
1812
+ .settings-selection.vjs-control.vjs-button{
1813
+ display: flex !important;
1814
+ }
1539
1815
 
1540
- @media(max-width:600px){
1816
+ @media(max-width:576px){
1817
+ .settings-selection.vjs-control.vjs-button{
1818
+ display: none !important;
1819
+ }
1820
+ }
1821
+
1822
+
1823
+ @media(max-width:576px){
1541
1824
  .tvProviderImage{
1542
1825
  display: none
1543
1826
  }
1544
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1827
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1545
1828
  .icon-maximize {
1546
1829
  height: 30px !important;
1547
1830
  }
1548
1831
 
1549
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1832
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1550
1833
  .icon-minimize {
1551
1834
  height: 30px !important;
1552
1835
  }
1553
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1554
- width: 3.5em;
1836
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1837
+ width: 4.5em;
1555
1838
  }
1556
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1839
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1557
1840
  height: min-content;
1558
1841
  }
1559
1842
 
1560
- .video-js.skin_mini button.vjs-slowmo-button{
1843
+ .video-js.skin_news button.vjs-slowmo-button{
1561
1844
  display: none;
1562
1845
  }
1563
- .video-js.skin_mini button.vjs-rewind-button{
1846
+ .video-js.skin_news button.vjs-rewind-button{
1564
1847
  display: none;
1565
1848
  }
1566
- .video-js.skin_mini button.vjs-rewind-button>svg{
1849
+ .video-js.skin_news button.vjs-rewind-button>svg{
1567
1850
  height: 20px;
1568
1851
  }
1569
- .video-js.skin_mini .vjs-button{
1570
- width: 3em;
1852
+ .video-js.skin_news .vjs-button{
1853
+ width: 4.8em;
1571
1854
  }
1572
- .video-js.skin_mini .widget-selection{
1855
+ .video-js.skin_news .widget-selection{
1573
1856
  display: none;
1574
1857
  }
1575
- .video-js.skin_mini .container{
1858
+ .video-js.skin_news .container{
1576
1859
  display: none !important;
1577
1860
  }
1578
- .video-js.skin_mini .vjs-control-bar{
1861
+ .video-js.skin_news .vjs-control-bar{
1579
1862
  height: 4em !important;
1580
1863
  }
1581
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1864
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1582
1865
  font-size: 2.5em;
1583
1866
  line-height: 1.5;
1584
1867
  }
1585
- .video-js.skin_mini .vjs-play-progress:before {
1868
+ .video-js.skin_news .vjs-play-progress:before {
1586
1869
  font-size: 1.2em;
1587
1870
  position: absolute;
1588
1871
  right: -0.5em;
1589
1872
  z-index: 1;
1590
1873
  }
1591
- .video-js.skin_mini button.vjs-skip-button>svg{
1874
+ .video-js.skin_news button.vjs-skip-button>svg{
1592
1875
  height: 20px;
1593
1876
  }
1594
-
1595
- .stream-selector-icon>svg{
1596
- width: 24px;
1597
- height: 24px;
1598
- }
1599
- .video-js.skin_mini .vjs-seek-to-live-text{
1600
- font-size: 12px;
1601
- }
1602
- }
1603
-
1604
-
1605
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1606
- background-color: rgba(0, 0, 0, 0.2);
1607
- }
1608
-
1609
-
1610
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1611
- display: flex;
1612
- justify-content: center;
1613
- align-items: center;
1614
- height: 100%;
1615
- transition: width 0.1s;
1616
- }
1617
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1618
- margin: 2px;
1619
- }
1620
-
1621
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1622
- display: flex;
1623
- justify-content: center;
1624
- align-items: center;
1625
- height: 100%;
1626
- transition: width 0.1s;
1627
- }
1628
-
1629
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1630
- display: block;
1631
- font-size: 10px;
1632
- padding: 6px 10px;
1633
- margin: 0;
1634
- max-height: 100%;
1635
- overflow-y: auto;
1636
- }
1637
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
1638
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
1639
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
1640
- display: block;
1641
- width: 100%;
1642
- }
1643
- .video-js.skin_mini .vjs-text-track-settings fieldset{
1644
- margin: 4px 0;
1645
- }
1646
- .video-js.skin_mini .vjs-text-track-settings fieldset span{
1647
- display: block;
1648
- padding: 0 0 6px;
1649
- }
1650
- .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
1651
- max-width: 100%;
1652
- }
1653
-
1654
- @media (max-width: 600px) {
1655
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1656
- height: 5px !important;
1657
- }
1658
-
1659
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1660
- display: none;
1661
- }
1662
-
1663
- }
1664
-
1665
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1666
- content: none !important;
1667
- fill: none !important;
1668
- filter: none !important;
1669
- }
1670
-
1671
- /* svg icons opacity and hover effect */
1672
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1673
- opacity: 0.7 !important;
1674
- }
1675
-
1676
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1677
- opacity: 1 !important;
1678
- }
1679
-
1680
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1681
- color: rgba(255, 255, 2555, 0.7)!important;
1682
- }
1683
-
1684
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1685
- color: rgba(255, 255, 2555, 1)!important;
1686
- }
1687
-
1688
-
1689
-
1690
- .video-js.skin_cn_news .vjs-control-bar {
1691
- z-index: 1 !important;
1692
- height: auto !important;
1693
- padding: 0.8em 30px 0.6em;
1694
- background: transparent !important;
1695
- display: flex;
1696
- flex-wrap: wrap;
1697
- align-items: center;
1698
- column-gap: 10px;
1699
- }
1700
-
1701
-
1702
- .video-js.skin_cn_news .vjs-control-bar::before {
1703
- content: '';
1704
- position: absolute;
1705
- left: 0;
1706
- right: 0;
1707
- bottom: 0;
1708
- top: -3em;
1709
- background: linear-gradient(
1710
- to top,
1711
- rgba(0, 0, 0, 0.85) 0%,
1712
- rgba(0, 0, 0, 0.7) 40%,
1713
- rgba(0, 0, 0, 0.55) 70%,
1714
- rgba(0, 0, 0, 0.38) 86%,
1715
- transparent 100%
1716
- );
1717
- pointer-events: none;
1718
- z-index: -1;
1719
- }
1720
-
1721
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1722
- order: -1;
1723
- flex: 0 0 100%;
1724
- width: 80%;
1725
- margin: 0 0 5em;
1726
- position: relative;
1727
- }
1728
-
1729
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1730
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1731
- width: auto;
1732
- min-width: 0;
1733
- }
1734
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1735
- display: inline-flex;
1736
- align-items: center;
1737
- justify-content: center;
1738
- height: 7em;
1739
- padding: 0 10px;
1740
- color: #fff;
1741
- }
1742
-
1743
- .video-js.skin_cn_news .vjs-svg-icon::before {
1744
- content: none !important;
1877
+ .video-js.skin_news button.vjs-big-play-button {
1878
+ width: 50px !important;
1879
+ height: 50px !important;
1880
+ font-size: 2.1rem !important;
1745
1881
  }
1746
1882
 
1747
-
1748
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1749
- display: inline-flex;
1750
- align-items: center;
1751
- justify-content: center;
1752
- }
1753
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1754
- .video-js.skin_cn_news .vjs-rewind-button svg {
1883
+ .stream-selector-icon>svg{
1755
1884
  width: 24px;
1756
1885
  height: 24px;
1757
- display: block;
1758
- }
1759
-
1760
-
1761
-
1762
- .video-js.skin_cn_news .vjs-subs-caps-button {
1763
- opacity: 1;
1764
- }
1765
-
1766
-
1767
-
1768
- .video-js.skin_cn_news .vjs-volume-panel {
1769
- margin: 0;
1770
- display: inline-flex;
1771
- align-items: center;
1772
- align-self: center;
1773
- height: 2.2em;
1774
- min-width: 7em;
1775
- transition: none;
1776
- }
1777
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1778
- width: 0;
1779
- height: 100%;
1780
- display: flex;
1781
- align-items: center;
1782
- overflow: hidden;
1783
- opacity: 0;
1784
- transition: width 0.15s ease, opacity 0.15s ease;
1785
1886
  }
1786
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1787
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1788
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1789
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1790
- width: 5em;
1791
- opacity: 1;
1792
- }
1793
-
1794
- .video-js.skin_cn_news .vjs-volume-bar {
1795
- width: 4em;
1796
- height: 0.3em;
1797
- margin: 0 0.45em;
1798
- }
1799
-
1800
-
1801
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1802
- display: none !important;
1803
- }
1804
-
1805
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1806
- width: 0 !important;
1887
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1888
+ margin: 0 12px 0 12px;
1807
1889
  }
1808
-
1809
-
1810
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1811
- display: block !important;
1812
- flex: 1 1 auto;
1890
+ .video-js.skin_news .vjs-seek-to-live-text{
1891
+ font-size: 12px;
1813
1892
  }
1814
-
1815
-
1816
- .video-js.skin_cn_news .vjs-big-play-button {
1817
- display: none;
1893
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1894
+ margin: 0 12px 0 12px;
1818
1895
  }
1819
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1820
- position: relative !important;
1821
- display: flex;
1822
- left: 0;
1823
- top: -1px;
1824
1896
  }
1825
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1897
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1898
+ width: 90px;
1899
+ height: 90px;
1826
1900
  display: flex;
1827
1901
  justify-content: center;
1828
1902
  align-items: center;
1903
+ border-radius: 50%;
1829
1904
  position: absolute;
1830
1905
  top: 0;
1831
1906
  left: 0;
1832
1907
  right: 0;
1833
1908
  bottom: 0;
1834
- margin: auto;
1835
- width: 80px;
1836
- height: 80px;
1837
- border: none;
1838
- border-radius: 50%;
1839
- background: rgba(0, 0, 0, 0.55);
1840
- font-size: 5em;
1841
- line-height: 1.3em;
1842
- transform: none !important;
1843
- }
1844
-
1845
-
1846
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1847
- height: 4px !important;
1848
- margin: 0;
1849
- border-radius: 20px;
1850
- background-color: #393944;
1851
- }
1852
-
1853
- .video-js.skin_cn_news .vjs-play-progress {
1854
- background-color: #ffffff;
1855
- border-radius: 20px;
1856
- }
1857
-
1858
- .video-js.skin_cn_news .vjs-load-progress,
1859
- .video-js.skin_cn_news .vjs-load-progress div {
1860
- background: rgba(255, 255, 255, 0.15);
1861
- border-radius: 20px;
1862
- }
1863
-
1864
-
1865
- .video-js.skin_cn_news .vjs-play-progress:before {
1866
- content: '';
1867
- width: 16px;
1868
- height: 16px;
1869
- border-radius: 50%;
1870
- background: #ffffff;
1871
- border: 2px solid rgba(0, 0, 0, 0.6);
1872
- box-sizing: border-box;
1873
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1874
- top: -6px;
1875
- right: -8px;
1876
- position: absolute;
1877
- }
1878
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1879
- display: none !important;
1880
- }
1881
-
1882
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1883
- background: #ffffff;
1884
- color: #0a0e17;
1885
- font-weight: 700;
1886
- border-radius: 3px;
1909
+ margin: auto;
1910
+ font-size: 6em;
1911
+ line-height: 1.4em;
1887
1912
  }
1888
1913
 
1889
- .video-js.skin_cn_news .vjs-live-control {
1890
- display: none !important;
1891
- }
1892
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1893
- display: inline-flex;
1914
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1915
+ display: flex;
1916
+ justify-content: center;
1894
1917
  align-items: center;
1895
- align-self: center;
1896
- height: 2.2em;
1897
- gap: 5px;
1898
- width: auto;
1899
- padding: 0 10px;
1900
- border: 1px solid rgba(255, 255, 255, 0.45);
1901
- border-radius: 4px;
1902
- cursor: pointer;
1918
+ height: 100%;
1919
+ transition: width 0.1s;
1903
1920
  }
1904
1921
 
1905
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1906
- display: none;
1907
- }
1908
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1909
- display: inline-flex;
1922
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1923
+ display: flex;
1924
+ justify-content: center;
1910
1925
  align-items: center;
1926
+ height: 100%;
1927
+ transition: width 0.1s;
1911
1928
  }
1912
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1913
- content: '';
1914
- display: inline-block;
1915
- width: 8px;
1916
- height: 8px;
1917
- border-radius: 50%;
1918
- background: #ff2d2d; /* red live dot */
1929
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1930
+ display: none !important;
1919
1931
  }
1920
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1921
- color: #ffffff;
1922
- font-weight: 700;
1923
- font-size: 12px;
1924
- letter-spacing: 0.03em;
1932
+ .video-js.skin_news .ssai-ad-container{
1933
+ position: absolute;
1934
+ bottom: 14px;
1925
1935
  }
1926
1936
 
1927
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1928
- border-color: transparent;
1929
- }
1930
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1931
- color: #ff2d2d;
1932
- }
1937
+ @media (max-width: 576px) {
1938
+ .video-js.skin_news .ssai-ad-container{
1939
+ bottom: 2px;
1940
+ }
1941
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1942
+ height: 5px !important;
1943
+ }
1944
+ .video-js.skin_news button.vjs-big-play-button {
1945
+ width: 50px !important;
1946
+ height: 50px !important;
1947
+ font-size: 2.1rem !important;
1948
+ }
1933
1949
 
1934
- /* ---- time controls ---- */
1935
- .video-js.skin_cn_news .vjs-current-time,
1936
- .video-js.skin_cn_news .vjs-duration,
1937
- .video-js.skin_cn_news .vjs-time-divider {
1938
- display: none !important;
1939
- }
1940
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1941
- display: none;
1942
- align-items: center;
1943
- justify-content: center;
1944
- font-size: 11px;
1945
- font-weight: 700;
1946
- color: #fff;
1947
- padding: 0 6px;
1948
- user-select: none;
1950
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1951
+ display: none;
1952
+ }
1953
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1954
+ bottom: 2.4em !important;
1955
+ right: -1em;
1956
+ z-index: 1;
1949
1957
  }
1958
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1959
+ display: none !important;
1960
+ }
1950
1961
 
1962
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1963
+ color: white;
1964
+ font-size: 13px;
1965
+ background-color: black;
1966
+ }
1967
+ }
1951
1968
 
1952
- .video-js.skin_cn_news .vjs-chapter-marker {
1953
- z-index: 2;
1954
- width: var(--vl-chapter-size, 8px);
1955
- height: var(--vl-chapter-size, 8px);
1956
- top: 50%;
1957
- bottom: auto;
1958
- background: var(--vl-chapter-color, #ffffff);
1959
- opacity: var(--vl-chapter-opacity, 1);
1960
- border-radius: 50%;
1961
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1962
- transform: translate(-50%, -50%) scale(1);
1963
- transition: background-color 0.12s ease;
1969
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1970
+ color: white;
1971
+ font-size: 16px;
1972
+ background-color: black;
1964
1973
  }
1965
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1966
- background: var(--vl-chapter-hover, #0a5cff);
1974
+
1975
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1976
+ margin-bottom: 2rem !important;
1967
1977
  }
1968
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1969
- background: var(--vl-chapter-active, #0a5cff);
1978
+
1979
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1980
+ font-size: 18px !important;
1970
1981
  }
1971
1982
 
1972
1983
 
1973
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1974
- width: 16px;
1975
- height: 16px;
1976
- bottom: 160%;
1977
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1984
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1985
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1986
+ font-size: 1.2em !important;
1987
+ line-height: 1.5em !important;
1988
+ padding: 0.2em 0.8em !important;
1978
1989
  }
1979
1990
 
1991
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1992
+ content: none !important;
1993
+ fill: none !important;
1994
+ filter: none !important;
1995
+ }
1980
1996
 
1981
- .video-js.skin_cn_news .vjs-chapter-preview {
1982
- background: var(--vl-chapter-tooltip, #0a5cff);
1983
- border-radius: 6px;
1984
- padding: 8px 10px;
1985
- width: max-content;
1986
- max-width: 300px;
1987
- text-align: left;
1988
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1997
+ /* svg icons opacity and hover effect */
1998
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1999
+ opacity: 0.7 !important;
1989
2000
  }
1990
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1991
- color: #ffffff;
1992
- font-size: 13px;
1993
- font-weight: 400;
1994
- margin-bottom: 2px;
2001
+
2002
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
2003
+ opacity: 1 !important;
1995
2004
  }
1996
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1997
- color: #ffffff;
1998
- font-size: 13px;
1999
- font-weight: 400;
2000
- line-height: 1.3;
2001
- white-space: normal;
2002
- text-align: left;
2005
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
2006
+ opacity: 0.7 !important;
2003
2007
  }
2004
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2005
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2008
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
2009
+ opacity: 1 !important;
2006
2010
  }
2007
2011
 
2008
- /* ---- responsive ---- */
2009
- @media (max-width: 576px) {
2010
- .video-js.skin_cn_news .vjs-control-bar {
2011
- height: 3.2em !important;
2012
- padding: 0 8px;
2013
- }
2014
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2015
- padding: 0 6px;
2016
- }
2017
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2018
- display: none !important;
2019
- }
2012
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2013
+ color: rgba(255, 255, 2555, 0.7)!important;
2020
2014
  }
2021
2015
 
2016
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2017
+ color: rgba(255, 255, 2555, 1)!important;
2018
+ }
2019
+
2020
+
2021
+
2022
2022
  /* CSS for videojs-dvr-seekbar */
2023
2023
 
2024
2024
  .video-js.vjs-dvr-seekbar {
@@ -2200,6 +2200,7 @@
2200
2200
 
2201
2201
 
2202
2202
 
2203
+
2203
2204
  .video-js .multicamera-parent.default{
2204
2205
  height: 345px;
2205
2206
  position: absolute;
@@ -2281,7 +2282,6 @@
2281
2282
 
2282
2283
 
2283
2284
 
2284
-
2285
2285
  .vjs-custom-big-mute.vjs-control{
2286
2286
  position: absolute;
2287
2287
  align-items: center;
@@ -2612,6 +2612,38 @@
2612
2612
  z-index: 30 !important;
2613
2613
  }
2614
2614
 
2615
+ /* a wrapper element that tracks the mouse vertically */
2616
+ .vjs-thumbnail-holder {
2617
+ position: absolute;
2618
+ left: -1000px;
2619
+ }
2620
+
2621
+ /* the thumbnail image itself */
2622
+ .vjs-thumbnail {
2623
+ position: absolute;
2624
+ left: 0;
2625
+ bottom: 1.3em;
2626
+ opacity: 0;
2627
+ transition: opacity .2s ease;
2628
+ -webkit-transition: opacity .2s ease;
2629
+ -moz-transition: opacity .2s ease;
2630
+ -mz-transition: opacity .2s ease;
2631
+ }
2632
+
2633
+ /* fade in the thumbnail when hovering over the progress bar */
2634
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2635
+ .vjs-progress-control:hover .vjs-thumbnail,
2636
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2637
+ .vjs-progress-control:active .vjs-thumbnail {
2638
+ opacity: 1;
2639
+ }
2640
+
2641
+ /* ... but hide the thumbnail when hovering directly over it */
2642
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2643
+ .vjs-progress-control:active .vjs-thumbnail:active {
2644
+ opacity: 0;
2645
+ }
2646
+
2615
2647
  .video-js.vjs-quality-menu {
2616
2648
  display: block;
2617
2649
  }
@@ -2691,38 +2723,6 @@
2691
2723
  .video-js.vjs-quality-menu .vjs-quality-menu-wrapper .vjs-menu .vjs-menu-content::-webkit-scrollbar{
2692
2724
  display: none;
2693
2725
  }
2694
- /* a wrapper element that tracks the mouse vertically */
2695
- .vjs-thumbnail-holder {
2696
- position: absolute;
2697
- left: -1000px;
2698
- }
2699
-
2700
- /* the thumbnail image itself */
2701
- .vjs-thumbnail {
2702
- position: absolute;
2703
- left: 0;
2704
- bottom: 1.3em;
2705
- opacity: 0;
2706
- transition: opacity .2s ease;
2707
- -webkit-transition: opacity .2s ease;
2708
- -moz-transition: opacity .2s ease;
2709
- -mz-transition: opacity .2s ease;
2710
- }
2711
-
2712
- /* fade in the thumbnail when hovering over the progress bar */
2713
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2714
- .vjs-progress-control:hover .vjs-thumbnail,
2715
- .vjs-progress-control.fake-active .vjs-thumbnail,
2716
- .vjs-progress-control:active .vjs-thumbnail {
2717
- opacity: 1;
2718
- }
2719
-
2720
- /* ... but hide the thumbnail when hovering directly over it */
2721
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2722
- .vjs-progress-control:active .vjs-thumbnail:active {
2723
- opacity: 0;
2724
- }
2725
-
2726
2726
  .vjs-poster {
2727
2727
  display: inline-block;
2728
2728
  vertical-align: middle;