@viewlift/player-backup 2.0.379-backup → 2.0.380-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 (167) hide show
  1. package/cjs/{autoNextVideo-38f45ca1.js → autoNextVideo-8be87221.js} +1 -1
  2. package/cjs/bundle.css +847 -847
  3. package/cjs/caption-settings-6976214c.js +1 -0
  4. package/cjs/captions-0f7e5504.js +1 -0
  5. package/cjs/features-d923e404.js +1 -0
  6. package/cjs/generic-932cd9bd.js +1 -0
  7. package/cjs/index-0c8d749a.js +1 -0
  8. package/cjs/index-2ee9beb4.js +1 -0
  9. package/cjs/index-4d160484.js +1 -0
  10. package/cjs/index-58f88daa.js +1 -0
  11. package/cjs/index-63a67aa1.js +1 -0
  12. package/cjs/index-a1a70e63.js +1 -0
  13. package/cjs/index-b5636b86.js +1 -0
  14. package/cjs/index-bf56b967.js +1 -0
  15. package/cjs/index.js +1 -1
  16. package/cjs/localisation-9b9539fb.js +1 -0
  17. package/cjs/manager-2b3a6487.js +1 -0
  18. package/cjs/multicamv2-a9521b14.js +1 -0
  19. package/cjs/multicamv2-b7debdd6.js +1 -0
  20. package/cjs/nextEpisodeButton-03a032ed.js +1 -0
  21. package/cjs/playerControlEvents-4bae757e.js +1 -0
  22. package/cjs/playlist-0345be6a.js +1 -0
  23. package/cjs/relatedVideosManager-0a220d05.js +1 -0
  24. package/cjs/renditions-627bdfad.js +1 -0
  25. package/cjs/resolution-4741809a.js +1 -0
  26. package/cjs/series-5b8f294c.js +1 -0
  27. package/cjs/series-v2-71e53ab6.js +1 -0
  28. package/cjs/series-v2-849ce280.js +1 -0
  29. package/cjs/settings-icon-3da03cb8.js +1 -0
  30. package/cjs/skin-168351ad.js +1 -0
  31. package/cjs/skin-1f23c6e5.js +1 -0
  32. package/cjs/skin-30cbcb3b.js +1 -0
  33. package/cjs/skin-35957e90.js +1 -0
  34. package/cjs/skin-3fbbf15a.js +1 -0
  35. package/cjs/skin-66dce245.js +1 -0
  36. package/cjs/skin-74aa6fdd.js +1 -0
  37. package/cjs/{skin-e03a88b8.js → skin-9b50d8e6.js} +1 -1
  38. package/cjs/skin-b60da048.js +1 -0
  39. package/cjs/skin-c703c4d8.js +1 -0
  40. package/cjs/skin-fd27ab72.js +1 -0
  41. package/cjs/videoSelector-9129264f.js +1 -0
  42. package/cjs/videoSelector-f1f19a68.js +1 -0
  43. package/cjs/videojs-dash5.es-80bdd597.js +1 -0
  44. package/esm/{autoNextVideo-7dc4b5f9.js → autoNextVideo-c0d4215f.js} +1 -1
  45. package/esm/bundle.css +847 -847
  46. package/esm/caption-settings-ecdb9fdd.js +1 -0
  47. package/esm/captions-6202f057.js +1 -0
  48. package/esm/features-ce5e7741.js +1 -0
  49. package/esm/generic-8c606c9f.js +1 -0
  50. package/esm/index-1a684bd4.js +1 -0
  51. package/esm/index-5a3a05a7.js +1 -0
  52. package/esm/index-6c82fd05.js +1 -0
  53. package/esm/index-7827eeb5.js +1 -0
  54. package/esm/index-a4b5d7a7.js +1 -0
  55. package/esm/index-dbeabd1b.js +1 -0
  56. package/esm/index-ec92c082.js +1 -0
  57. package/esm/index-f9ef8d3b.js +1 -0
  58. package/esm/index.js +1 -1
  59. package/esm/localisation-a4ec8f68.js +1 -0
  60. package/esm/manager-71943445.js +1 -0
  61. package/esm/multicamv2-5345efc1.js +1 -0
  62. package/esm/multicamv2-a1d5fe38.js +1 -0
  63. package/esm/nextEpisodeButton-40baf151.js +1 -0
  64. package/esm/playerControlEvents-a054a667.js +1 -0
  65. package/esm/playlist-6425a6a1.js +1 -0
  66. package/esm/relatedVideosManager-81661348.js +1 -0
  67. package/esm/renditions-620d93b3.js +1 -0
  68. package/esm/resolution-f2937f41.js +1 -0
  69. package/esm/series-1f114057.js +1 -0
  70. package/esm/series-v2-22f006ff.js +1 -0
  71. package/esm/series-v2-8dda8e16.js +1 -0
  72. package/esm/settings-icon-fbc91450.js +1 -0
  73. package/esm/skin-00c8da65.js +1 -0
  74. package/esm/skin-0782067b.js +1 -0
  75. package/esm/skin-3653c5b3.js +1 -0
  76. package/esm/skin-57d9a86c.js +1 -0
  77. package/esm/skin-6e38dd8e.js +1 -0
  78. package/{cjs/skin-8d797b1e.js → esm/skin-84f8c45b.js} +1 -1
  79. package/esm/{skin-9d2dad58.js → skin-8e064031.js} +1 -1
  80. package/esm/{skin-77259d09.js → skin-8fcaf133.js} +1 -1
  81. package/esm/skin-95d705f2.js +1 -0
  82. package/esm/skin-a89d152c.js +1 -0
  83. package/esm/skin-ff8a2ba0.js +1 -0
  84. package/esm/src/apis/index.d.ts +4 -4
  85. package/esm/src/helpers/drmRobustness.d.ts +4 -0
  86. package/esm/src/helpers/token.d.ts +1 -1
  87. package/esm/src/index.d.ts +1 -1
  88. package/esm/videoSelector-238393de.js +1 -0
  89. package/esm/videoSelector-72ba5b67.js +1 -0
  90. package/esm/videojs-dash5.es-45c88e15.js +1 -0
  91. package/package.json +1 -1
  92. package/cjs/caption-settings-af7b30a4.js +0 -1
  93. package/cjs/captions-8b889384.js +0 -1
  94. package/cjs/features-8beda29d.js +0 -1
  95. package/cjs/generic-0b925a19.js +0 -1
  96. package/cjs/index-22c077d0.js +0 -1
  97. package/cjs/index-517acf72.js +0 -1
  98. package/cjs/index-774736bd.js +0 -1
  99. package/cjs/index-93ac04ff.js +0 -1
  100. package/cjs/index-d9460e79.js +0 -1
  101. package/cjs/index-de9db53d.js +0 -1
  102. package/cjs/index-f3365b73.js +0 -1
  103. package/cjs/index-f64ef24d.js +0 -1
  104. package/cjs/localisation-da6f64c6.js +0 -1
  105. package/cjs/manager-77ddd30c.js +0 -1
  106. package/cjs/multicamv2-2123cc15.js +0 -1
  107. package/cjs/multicamv2-41a918f4.js +0 -1
  108. package/cjs/nextEpisodeButton-c68c6da4.js +0 -1
  109. package/cjs/playerControlEvents-db923a5c.js +0 -1
  110. package/cjs/playlist-8d5202b4.js +0 -1
  111. package/cjs/relatedVideosManager-44ec6d59.js +0 -1
  112. package/cjs/renditions-05a85e06.js +0 -1
  113. package/cjs/resolution-ac7705e6.js +0 -1
  114. package/cjs/series-b3b39dd7.js +0 -1
  115. package/cjs/series-v2-3baa5caa.js +0 -1
  116. package/cjs/series-v2-f31465e3.js +0 -1
  117. package/cjs/settings-icon-7a519942.js +0 -1
  118. package/cjs/skin-55634dc6.js +0 -1
  119. package/cjs/skin-6b4fd720.js +0 -1
  120. package/cjs/skin-90c06edf.js +0 -1
  121. package/cjs/skin-a3530077.js +0 -1
  122. package/cjs/skin-aef6f952.js +0 -1
  123. package/cjs/skin-d6a48901.js +0 -1
  124. package/cjs/skin-ed4decab.js +0 -1
  125. package/cjs/skin-f0bbb76d.js +0 -1
  126. package/cjs/skin-f8994d41.js +0 -1
  127. package/cjs/videoSelector-1399cc18.js +0 -1
  128. package/cjs/videoSelector-2bc8977c.js +0 -1
  129. package/cjs/videojs-dash5.es-0f92604f.js +0 -1
  130. package/esm/caption-settings-cf49bb1b.js +0 -1
  131. package/esm/captions-f011a7d4.js +0 -1
  132. package/esm/features-048cb801.js +0 -1
  133. package/esm/generic-759b1422.js +0 -1
  134. package/esm/index-07f963db.js +0 -1
  135. package/esm/index-1577b990.js +0 -1
  136. package/esm/index-1a5d906c.js +0 -1
  137. package/esm/index-28ebfa21.js +0 -1
  138. package/esm/index-3bae4958.js +0 -1
  139. package/esm/index-8b7ad7a7.js +0 -1
  140. package/esm/index-cbb86a6c.js +0 -1
  141. package/esm/index-e9e43270.js +0 -1
  142. package/esm/localisation-2f1ee38c.js +0 -1
  143. package/esm/manager-d812dea7.js +0 -1
  144. package/esm/multicamv2-220833f5.js +0 -1
  145. package/esm/multicamv2-bd4bf0f5.js +0 -1
  146. package/esm/nextEpisodeButton-ca0a2b98.js +0 -1
  147. package/esm/playerControlEvents-26580023.js +0 -1
  148. package/esm/playlist-2d49901b.js +0 -1
  149. package/esm/relatedVideosManager-93533a90.js +0 -1
  150. package/esm/renditions-28891b91.js +0 -1
  151. package/esm/resolution-d9d21f0e.js +0 -1
  152. package/esm/series-637f67ff.js +0 -1
  153. package/esm/series-v2-7caace2c.js +0 -1
  154. package/esm/series-v2-899b6955.js +0 -1
  155. package/esm/settings-icon-abd55c1e.js +0 -1
  156. package/esm/skin-0e9bc166.js +0 -1
  157. package/esm/skin-28192217.js +0 -1
  158. package/esm/skin-2a3ee818.js +0 -1
  159. package/esm/skin-2cb9e01a.js +0 -1
  160. package/esm/skin-2d7f1782.js +0 -1
  161. package/esm/skin-318448f4.js +0 -1
  162. package/esm/skin-44cb0a24.js +0 -1
  163. package/esm/skin-7d2af43a.js +0 -1
  164. package/esm/skin-bcb995db.js +0 -1
  165. package/esm/videoSelector-01d26572.js +0 -1
  166. package/esm/videoSelector-21c88bd3.js +0 -1
  167. package/esm/videojs-dash5.es-cfe95daa.js +0 -1
package/cjs/bundle.css CHANGED
@@ -1,215 +1,5 @@
1
1
 
2
2
 
3
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
4
- height: 0.7em !important;
5
- position: absolute !important;
6
- top: -0.7em !important;
7
- width: 100% !important;
8
- }
9
-
10
- .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
11
- height: 100%;
12
- }
13
-
14
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
15
- line-height: 2.5;
16
- }
17
-
18
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
19
- height: 19px;
20
- width: 19px;
21
- cursor: pointer;
22
- }
23
- .video-js.skin_vlone .vjs-control {
24
- user-select: none;
25
- }
26
- .video-js.skin_vlone .vjs-custom-control-spacer{
27
- user-select: none;
28
- }
29
-
30
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
31
- height: 19px;
32
- width: 19px;
33
- cursor: pointer;
34
- }
35
-
36
- .video-js.skin_vlone .vjs-play-progress:before {
37
- display: none !important;
38
- }
39
-
40
- .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
41
- margin: 0 !important;
42
-
43
- }
44
-
45
-
46
- .video-js.skin_vlone .vjs-custom-control-spacer {
47
- display: block;
48
- flex: 1 1 auto;
49
- }
50
-
51
- .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
52
- z-index: 1;
53
- }
54
-
55
-
56
- .video-js.skin_vlone .vjs-control-bar {
57
- height: 40px;
58
- }
59
-
60
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
61
- .vjs-button>.vjs-icon-placeholder:before {
62
- position: relative !important;
63
- }
64
- .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
65
- display: flex;
66
- left: 0px;
67
- top: -1px;
68
- }
69
-
70
- .vjs-button>.vjs-icon-placeholder:before {
71
- font-size: 2em !important;
72
- }
73
-
74
- .video-js.skin_vlone .vjs-control {
75
- width: 4.3em;
76
- }
77
-
78
- .vjs-menu-button-popup .vjs-menu {
79
- bottom: 10px !important;
80
- }
81
-
82
- .video-js .vjs-subs-caps-button .vjs-menu li,
83
- .video-js .vjs-subtitles-button .vjs-menu li,
84
- .video-js .vjs-captions-button .vjs-menu li {
85
- text-transform: none;
86
- }
87
-
88
-
89
- .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
90
- height: 1.3em !important;
91
- position: absolute !important;
92
- top: -1.3em !important;
93
- transition: height 0.3s, top 0.3s !important;
94
- }
95
-
96
-
97
- .video-js.skin_vlone.vjs-live .vjs-time-control{
98
- display: none !important;
99
- }
100
-
101
- .video-js.skin_vlone .vjs-time-control {
102
- display: block;
103
- }
104
- .video-js.skin_vlone .vjs-remaining-time {
105
- display: none;
106
- }
107
-
108
- .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
109
- line-height: 3.5em;
110
- font-size: 1.1em;
111
- min-width: 4em;
112
- }
113
-
114
- .video-js.skin_vlone .vjs-time-divider > div{
115
- display: flex;
116
- justify-content: center;
117
- }
118
-
119
- .video-js.skin_vlone .vjs-live-control{
120
- align-items: center;
121
- }
122
- .video-js.skin_vlone .vjs-live-display{
123
- height: 2.2em;
124
- display: flex;
125
- align-items: center;
126
- font-family: monospace;
127
- width: 4em;
128
- justify-content: center;
129
- background: red;
130
- margin: 4px 0px 4px 12px;
131
- }
132
- .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
133
- background: #6b6b6b;
134
- }
135
- .video-js.skin_vlone .vjs-live-display:hover{
136
- cursor: pointer;
137
- }
138
-
139
- .video-js.skin_vlone .vjs-time-control {
140
- line-height: 3.5em !important;
141
- font-size: 1.1em !important;
142
- width: min-content !important;
143
- min-width: 1.5em;
144
- padding: 0 !important;
145
- user-select: none;
146
- }
147
-
148
- .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
149
- margin-left: 16px !important;
150
- }
151
-
152
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
153
- .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
154
- font-size: 1.2em !important;
155
- line-height: 1.5em !important;
156
- padding: 0.2em 0.8em !important;
157
- }
158
-
159
-
160
- /* Big play */
161
- .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
162
- width: 80px;
163
- height: 80px;
164
- display: flex;
165
- justify-content: center;
166
- align-items: center;
167
- border: none;
168
- position: absolute;
169
- top: 0;
170
- left: 0;
171
- right: 0;
172
- bottom: 0;
173
- margin: auto;
174
- font-size: 5em;
175
- line-height: 1.3em;
176
- transform: none !important;
177
- border-radius: 1.3em;
178
- }
179
- .video-js.skin_vlone .ssai-ad-container{
180
- position: absolute;
181
- bottom: 4px;
182
- }
183
-
184
- @media(max-width:600px){
185
- .video-js.skin_vlone button.vjs-big-play-button {
186
- width: 50px !important;
187
- height: 50px !important;
188
- font-size: 2.1rem !important;
189
- }
190
-
191
- .video-js.skin_vlone .ssai-ad-container {
192
- position: absolute;
193
- bottom: 2px;
194
- }
195
- .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
196
- display: none;
197
- }
198
-
199
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
200
- /* display: none; */
201
- }
202
-
203
- .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
204
- /* display: none; */
205
- }
206
- }
207
- .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
208
- text-decoration: underline;
209
- }
210
-
211
-
212
-
213
3
 
214
4
  .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
215
5
  font-size: 2.2em;
@@ -739,476 +529,573 @@
739
529
 
740
530
 
741
531
 
742
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
743
- font-size: 2.2em;
744
- line-height: 2.6;
745
- }
746
- .video-js.skin_mini{
747
- overflow: hidden;
748
- }
749
- .video-js.skin_mini .vjs-control-bar{
750
- z-index: 1 !important;
751
- height: 4em !important;
752
- background: black !important;
532
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
533
+ height: 0.7em !important;
534
+ position: absolute !important;
535
+ top: -0.7em !important;
536
+ width: 100% !important;
753
537
  }
754
538
 
755
- .video-js.skin_mini .vjs-fade>* {
756
- visibility: hidden !important;
757
- opacity: 0 !important;
758
- transition: visibility 1s, opacity 1s !important;
539
+ .video-js.skin_vlone .vjs-progress-holder.vjs-slider.vjs-slider-horizontal {
540
+ height: 100%;
759
541
  }
760
542
 
761
- .video-js.skin_mini .custom-spaced-progress-bar {
762
- position: absolute;
763
- width: 100%;
764
- display: flex;
765
- height: 0.5em;
766
- top: -0.5em;
543
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value{
544
+ line-height: 2.5;
767
545
  }
768
546
 
769
- .video-js.skin_mini .vjs-progress-control {
770
- /* left: -6px; */
771
- position: relative;
772
- width: 100%;
773
- height: 0.5em;
774
- transition: height 0.1s, top 0.1s;
547
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button > svg{
548
+ height: 19px;
549
+ width: 19px;
550
+ cursor: pointer;
551
+ }
552
+ .video-js.skin_vlone .vjs-control {
553
+ user-select: none;
554
+ }
555
+ .video-js.skin_vlone .vjs-custom-control-spacer{
556
+ user-select: none;
775
557
  }
776
558
 
559
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button > svg{
560
+ height: 19px;
561
+ width: 19px;
562
+ cursor: pointer;
563
+ }
777
564
 
565
+ .video-js.skin_vlone .vjs-play-progress:before {
566
+ display: none !important;
567
+ }
778
568
 
569
+ .video-js.skin_vlone .vjs-progress-control>.vjs-progress-holder.vjs-slider {
570
+ margin: 0 !important;
779
571
 
780
- .video-js.skin_mini .vjs-custom-control-spacer {
781
- display: block;
782
- flex: 1 1 auto;
783
572
  }
784
573
 
785
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
786
- margin: 0 0px 0 0px;
787
- }
788
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
789
- display: none;
574
+
575
+ .video-js.skin_vlone .vjs-custom-control-spacer {
576
+ display: block;
577
+ flex: 1 1 auto;
790
578
  }
791
579
 
792
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
793
- font-size: 14px;
794
- font-weight: 500;
795
- align-self: center;
796
- height: min-content;
797
- padding: 5px 2px;
798
- border-radius: 8px;
580
+ .video-js.skin_vlone .vjs-volume-panel.vjs-volume-panel-vertical{
581
+ z-index: 1;
799
582
  }
800
583
 
801
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
802
- height: 5px !important;
584
+
585
+ .video-js.skin_vlone .vjs-control-bar {
586
+ height: 40px;
803
587
  }
804
588
 
805
- .video-js.skin_mini .vjs-play-progress:before {
806
- font-size: 1.3em;
807
- line-height: unset;
808
- top: -0.3333333333em;
589
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before,
590
+ .vjs-button>.vjs-icon-placeholder:before {
591
+ position: relative !important;
592
+ }
593
+ .video-js.skin_vlone .vjs-big-play-button .vjs-icon-placeholder:before{
594
+ display: flex;
595
+ left: 0px;
596
+ top: -1px;
809
597
  }
810
598
 
811
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
812
- display: none !important;
599
+ .vjs-button>.vjs-icon-placeholder:before {
600
+ font-size: 2em !important;
813
601
  }
814
602
 
815
- /* */
816
- .video-js.skin_mini .vjs-mouse-display{
817
- font-size: 1.6666666667em;
603
+ .video-js.skin_vlone .vjs-control {
604
+ width: 4.3em;
818
605
  }
819
606
 
820
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
821
- font-size: 1em !important;
607
+ .vjs-menu-button-popup .vjs-menu {
608
+ bottom: 10px !important;
822
609
  }
823
610
 
824
- .video-js.skin_mini .vjs-button{
825
- width: 3em;
826
- display: flex;
827
- align-items: center;
828
- justify-content: center;
611
+ .video-js .vjs-subs-caps-button .vjs-menu li,
612
+ .video-js .vjs-subtitles-button .vjs-menu li,
613
+ .video-js .vjs-captions-button .vjs-menu li {
614
+ text-transform: none;
829
615
  }
830
616
 
831
617
 
832
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
833
- .icon-maximize {
834
- display: block;
835
- height: 32px;
618
+ .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control:hover {
619
+ height: 1.3em !important;
620
+ position: absolute !important;
621
+ top: -1.3em !important;
622
+ transition: height 0.3s, top 0.3s !important;
836
623
  }
837
624
 
838
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
839
- line-height: 4;
625
+
626
+ .video-js.skin_vlone.vjs-live .vjs-time-control{
627
+ display: none !important;
840
628
  }
841
629
 
842
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
843
- .icon-minimize {
630
+ .video-js.skin_vlone .vjs-time-control {
631
+ display: block;
632
+ }
633
+ .video-js.skin_vlone .vjs-remaining-time {
844
634
  display: none;
845
- height: 32px;
846
635
  }
847
636
 
848
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
849
- outline: none !important;
850
- }
851
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
852
- .vjs-icon-fullscreen-enter:before {
853
- /* content: '' !important; */
637
+ .video-js.skin_vlone .vjs-remaining-time.vjs-time-control.vjs-control>span.vjs-remaining-time-display {
638
+ line-height: 3.5em;
639
+ font-size: 1.1em;
640
+ min-width: 4em;
854
641
  }
855
642
 
856
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
857
- display: flex;
858
- justify-content: center;
859
- align-items: center;
860
- /* transform: rotate(90deg); */
643
+ .video-js.skin_vlone .vjs-time-divider > div{
644
+ display: flex;
645
+ justify-content: center;
861
646
  }
862
647
 
863
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
864
- display: none;
648
+ .video-js.skin_vlone .vjs-live-control{
649
+ align-items: center;
865
650
  }
866
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
867
- margin-left: -10px;
868
- display: none;
651
+ .video-js.skin_vlone .vjs-live-display{
652
+ height: 2.2em;
653
+ display: flex;
654
+ align-items: center;
655
+ font-family: monospace;
656
+ width: 4em;
657
+ justify-content: center;
658
+ background: red;
659
+ margin: 4px 0px 4px 12px;
869
660
  }
870
-
871
- .video-js.skin_mini .vjs-loading-spinner {
872
- position: absolute;
873
- top: 50%;
874
- left: 50%;
875
- transform: translate(-50%, -50%);
876
- opacity: .85;
877
- text-align: left;
878
- border: .2em solid rgba(43, 51, 63, .7);
879
- box-sizing: border-box;
880
- background-clip: padding-box;
881
- width: 3em;
882
- height: 3em;
883
- border-radius: 50%;
884
- visibility: hidden;
661
+ .video-js.skin_vlone .vjs-live-display.vjs-behind-live{
662
+ background: #6b6b6b;
663
+ }
664
+ .video-js.skin_vlone .vjs-live-display:hover{
665
+ cursor: pointer;
885
666
  }
886
667
 
887
- .video-js.skin_mini .skipbtn:hover{
888
- cursor: pointer;
668
+ .video-js.skin_vlone .vjs-time-control {
669
+ line-height: 3.5em !important;
670
+ font-size: 1.1em !important;
671
+ width: min-content !important;
672
+ min-width: 1.5em;
673
+ padding: 0 !important;
674
+ user-select: none;
889
675
  }
890
676
 
891
- .video-js.skin_mini .rewindbtn:hover{
892
- cursor: pointer;
677
+ .video-js.skin_vlone .vjs-current-time.vjs-time-control.vjs-control {
678
+ margin-left: 16px !important;
893
679
  }
894
680
 
895
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
896
- position: relative;
897
- padding-left: 0;
681
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
682
+ .video-js.skin_vlone .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
683
+ font-size: 1.2em !important;
684
+ line-height: 1.5em !important;
685
+ padding: 0.2em 0.8em !important;
898
686
  }
899
687
 
900
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
901
- width: 40px;
902
- height: 40px;
903
- display: flex;
904
- justify-content: center;
905
- align-items: center;
906
- border: none;
907
- position: absolute;
908
- top: 0;
909
- left: 0;
910
- right: 0;
911
- bottom: 0;
912
- margin: auto;
913
- font-size: 3em;
914
- line-height: 1.3em;
915
- transform: none !important;
916
- border-radius: 1.3em;
688
+
689
+ /* Big play */
690
+ .video-js.skin_vlone.vjs-paused .vjs-big-play-button {
691
+ width: 80px;
692
+ height: 80px;
693
+ display: flex;
694
+ justify-content: center;
695
+ align-items: center;
696
+ border: none;
697
+ position: absolute;
698
+ top: 0;
699
+ left: 0;
700
+ right: 0;
701
+ bottom: 0;
702
+ margin: auto;
703
+ font-size: 5em;
704
+ line-height: 1.3em;
705
+ transform: none !important;
706
+ border-radius: 1.3em;
707
+ }
708
+ .video-js.skin_vlone .ssai-ad-container{
709
+ position: absolute;
710
+ bottom: 4px;
917
711
  }
712
+
713
+ @media(max-width:600px){
714
+ .video-js.skin_vlone button.vjs-big-play-button {
715
+ width: 50px !important;
716
+ height: 50px !important;
717
+ font-size: 2.1rem !important;
718
+ }
918
719
 
919
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
920
- font-weight: bold;
720
+ .video-js.skin_vlone .ssai-ad-container {
721
+ position: absolute;
722
+ bottom: 2px;
723
+ }
724
+ .video-js.skin_vlone .vjs-playback-rate .vjs-playback-rate-value {
725
+ display: none;
921
726
  }
922
727
 
923
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
924
- bottom: 1.1em !important;
925
- right: 1em;
926
- z-index: 1;
927
- font-size: 10px;
728
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-rewind-button>svg {
729
+ /* display: none; */
928
730
  }
929
731
 
930
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
931
- width: 24px !important;
932
- height: 24px !important;
732
+ .video-js.skin_vlone button.vjs-control.vjs-button.vjs-skip-button>svg {
733
+ /* display: none; */
933
734
  }
934
- .video-js.skin_mini .settings-selector-icon>svg{
935
- height: 19px !important;
936
- width: 19px !important;
735
+ }
736
+ .video-js .vjs-control-bar .vjs-subs-caps-button .vjs-menu .vjs-selected {
737
+ text-decoration: underline;
937
738
  }
938
739
 
939
740
 
940
- .video-js.skin_mini button.vjs-rewind-button{
941
- cursor: pointer;
942
- }
943
741
 
944
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
945
- padding-right: 0;
946
- }
947
742
 
948
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
949
- padding-left: 0;
743
+ .video-js.skin_cn_news .vjs-control-bar {
744
+ z-index: 1 !important;
745
+ height: auto !important;
746
+ padding: 0.8em 30px 0.6em;
747
+ background: transparent !important;
748
+ display: flex;
749
+ flex-wrap: wrap;
750
+ align-items: center;
751
+ column-gap: 10px;
950
752
  }
951
753
 
952
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
953
- padding-left: 0;
954
- padding-right: 0;
955
- display: flex;
956
- justify-content: center;
957
- width: min-content;
958
- }
959
754
 
960
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
961
- display: none
962
- }
963
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
964
- display: none
755
+ .video-js.skin_cn_news .vjs-control-bar::before {
756
+ content: '';
757
+ position: absolute;
758
+ left: 0;
759
+ right: 0;
760
+ bottom: 0;
761
+ top: -3em;
762
+ background: linear-gradient(
763
+ to top,
764
+ rgba(0, 0, 0, 0.85) 0%,
765
+ rgba(0, 0, 0, 0.7) 40%,
766
+ rgba(0, 0, 0, 0.55) 70%,
767
+ rgba(0, 0, 0, 0.38) 86%,
768
+ transparent 100%
769
+ );
770
+ pointer-events: none;
771
+ z-index: -1;
965
772
  }
966
773
 
967
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
968
- display: flex;
969
- align-items: center;
970
- font-weight: 700;
971
- font-size: 9px;
972
- min-width: 0.8em;
973
- padding-left: 0;
774
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
775
+ order: -1;
776
+ flex: 0 0 100%;
777
+ width: 80%;
778
+ margin: 0 0 5em;
779
+ position: relative;
974
780
  }
975
781
 
976
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
977
- display: none;
978
- font-size: 11px;
979
- justify-content: center;
782
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
783
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
784
+ width: auto;
785
+ min-width: 0;
786
+ }
787
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
788
+ display: inline-flex;
980
789
  align-items: center;
981
- user-select: none;
790
+ justify-content: center;
791
+ height: 7em;
792
+ padding: 0 10px;
793
+ color: #fff;
982
794
  }
983
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
984
- display: none;
795
+
796
+ .video-js.skin_cn_news .vjs-svg-icon::before {
797
+ content: none !important;
985
798
  }
986
799
 
987
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
988
- height: min-content;
989
- width: min-content;
800
+
801
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
802
+ display: inline-flex;
803
+ align-items: center;
804
+ justify-content: center;
990
805
  }
991
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
992
- width: 3em;
993
- margin-right: 4px;
806
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
807
+ .video-js.skin_cn_news .vjs-rewind-button svg {
808
+ width: 24px;
809
+ height: 24px;
810
+ display: block;
994
811
  }
995
812
 
996
- .video-js.skin_mini .content{
997
- bottom: 3.4rem !important;
998
- right: -4rem !important;
999
- }
1000
813
 
1001
- .video-js.skin_mini .setting-icon > svg{
1002
- height:18px !important;
1003
- }
1004
814
 
1005
- .output-overlay{
1006
- position: absolute;
1007
- bottom: 0;
1008
- height: 100%;
1009
- width: 100%;
1010
- z-index: 0;
1011
- border: 0;
1012
- pointer-events:none
815
+ .video-js.skin_cn_news .vjs-subs-caps-button {
816
+ opacity: 1;
1013
817
  }
1014
818
 
1015
- .video-js.skin_mini iframe{
1016
- width: 100%;
1017
- height: 100%;
1018
- }
1019
819
 
1020
- .video-js.skin_mini .vjs-live-control{
820
+
821
+ .video-js.skin_cn_news .vjs-volume-panel {
822
+ margin: 0;
823
+ display: inline-flex;
1021
824
  align-items: center;
1022
- max-width: 5em;
1023
- }
1024
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
825
+ align-self: center;
1025
826
  height: 2.2em;
827
+ min-width: 7em;
828
+ transition: none;
829
+ }
830
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
831
+ width: 0;
832
+ height: 100%;
1026
833
  display: flex;
1027
834
  align-items: center;
1028
- font-family: monospace;
1029
- width: 4em;
1030
- justify-content: center;
1031
- background: red;
1032
- margin: 4px 0px 4px 2px;
1033
- }
1034
-
1035
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1036
- text-shadow: none;
1037
- }
1038
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1039
- display: none;
1040
- font-size: 12px;
835
+ overflow: hidden;
836
+ opacity: 0;
837
+ transition: width 0.15s ease, opacity 0.15s ease;
1041
838
  }
1042
-
1043
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1044
- height: 1.8em;
1045
- display: inline-flex;
1046
- align-items: center;
1047
- font-family: monospace;
1048
- justify-content: center;
1049
- border: 1.5px solid;
1050
- margin: 4px 0px 4px 2px;
1051
- white-space: pre;
1052
- padding: 2px 4px;
1053
- font-size: 1.2em;
1054
- font-weight: 500;
1055
- color: rgba(255, 255, 2555, 0.7);
839
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
840
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
841
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
842
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
843
+ width: 5em;
844
+ opacity: 1;
1056
845
  }
1057
846
 
1058
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1059
- content: "NOT LIVE";
1060
- word-spacing: -4px;
847
+ .video-js.skin_cn_news .vjs-volume-bar {
848
+ width: 4em;
849
+ height: 0.3em;
850
+ margin: 0 0.45em;
1061
851
  }
1062
852
 
1063
853
 
1064
- @media(max-width:600px){
1065
- .tvProviderImage{
1066
- display: none
1067
- }
1068
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1069
- .icon-maximize {
1070
- height: 30px !important;
1071
- }
1072
-
1073
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1074
- .icon-minimize {
1075
- height: 30px !important;
1076
- }
1077
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1078
- width: 3.5em;
1079
- }
1080
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1081
- height: min-content;
1082
- }
1083
-
1084
- .video-js.skin_mini button.vjs-slowmo-button{
1085
- display: none;
1086
- }
1087
- .video-js.skin_mini button.vjs-rewind-button{
1088
- display: none;
1089
- }
1090
- .video-js.skin_mini button.vjs-rewind-button>svg{
1091
- height: 20px;
1092
- }
1093
- .video-js.skin_mini .vjs-button{
1094
- width: 3em;
1095
- }
1096
- .video-js.skin_mini .widget-selection{
1097
- display: none;
1098
- }
1099
- .video-js.skin_mini .container{
1100
- display: none !important;
1101
- }
1102
- .video-js.skin_mini .vjs-control-bar{
1103
- height: 4em !important;
1104
- }
1105
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1106
- font-size: 2.5em;
1107
- line-height: 1.5;
1108
- }
1109
- .video-js.skin_mini .vjs-play-progress:before {
1110
- font-size: 1.2em;
1111
- position: absolute;
1112
- right: -0.5em;
1113
- z-index: 1;
1114
- }
1115
- .video-js.skin_mini button.vjs-skip-button>svg{
1116
- height: 20px;
854
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
855
+ display: none !important;
1117
856
  }
1118
857
 
1119
- .stream-selector-icon>svg{
1120
- width: 24px;
1121
- height: 24px;
1122
- }
1123
- .video-js.skin_mini .vjs-seek-to-live-text{
1124
- font-size: 12px;
1125
- }
858
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
859
+ width: 0 !important;
1126
860
  }
1127
861
 
1128
862
 
1129
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1130
- background-color: rgba(0, 0, 0, 0.2);
863
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
864
+ display: block !important;
865
+ flex: 1 1 auto;
1131
866
  }
1132
867
 
1133
868
 
1134
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1135
- display: flex;
1136
- justify-content: center;
1137
- align-items: center;
1138
- height: 100%;
1139
- transition: width 0.1s;
869
+ .video-js.skin_cn_news .vjs-big-play-button {
870
+ display: none;
1140
871
  }
1141
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1142
- margin: 2px;
872
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
873
+ position: relative !important;
874
+ display: flex;
875
+ left: 0;
876
+ top: -1px;
1143
877
  }
1144
-
1145
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
878
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1146
879
  display: flex;
1147
880
  justify-content: center;
1148
881
  align-items: center;
1149
- height: 100%;
1150
- transition: width 0.1s;
1151
- }
1152
-
1153
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1154
- display: block;
1155
- font-size: 10px;
1156
- padding: 6px 10px;
1157
- margin: 0;
1158
- max-height: 100%;
1159
- overflow-y: auto;
882
+ position: absolute;
883
+ top: 0;
884
+ left: 0;
885
+ right: 0;
886
+ bottom: 0;
887
+ margin: auto;
888
+ width: 80px;
889
+ height: 80px;
890
+ border: none;
891
+ border-radius: 50%;
892
+ background: rgba(0, 0, 0, 0.55);
893
+ font-size: 5em;
894
+ line-height: 1.3em;
895
+ transform: none !important;
1160
896
  }
1161
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
1162
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
1163
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
1164
- display: block;
1165
- width: 100%;
897
+
898
+
899
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
900
+ height: 4px !important;
901
+ margin: 0;
902
+ border-radius: 20px;
903
+ background-color: #393944;
1166
904
  }
1167
- .video-js.skin_mini .vjs-text-track-settings fieldset{
1168
- margin: 4px 0;
905
+
906
+ .video-js.skin_cn_news .vjs-play-progress {
907
+ background-color: #ffffff;
908
+ border-radius: 20px;
1169
909
  }
1170
- .video-js.skin_mini .vjs-text-track-settings fieldset span{
1171
- display: block;
1172
- padding: 0 0 6px;
910
+
911
+ .video-js.skin_cn_news .vjs-load-progress,
912
+ .video-js.skin_cn_news .vjs-load-progress div {
913
+ background: rgba(255, 255, 255, 0.15);
914
+ border-radius: 20px;
1173
915
  }
1174
- .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
1175
- max-width: 100%;
916
+
917
+
918
+ .video-js.skin_cn_news .vjs-play-progress:before {
919
+ content: '';
920
+ width: 16px;
921
+ height: 16px;
922
+ border-radius: 50%;
923
+ background: #ffffff;
924
+ border: 2px solid rgba(0, 0, 0, 0.6);
925
+ box-sizing: border-box;
926
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
927
+ top: -6px;
928
+ right: -8px;
929
+ position: absolute;
930
+ }
931
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
932
+ display: none !important;
1176
933
  }
1177
934
 
1178
- @media (max-width: 600px) {
1179
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1180
- height: 5px !important;
1181
- }
935
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
936
+ background: #ffffff;
937
+ color: #0a0e17;
938
+ font-weight: 700;
939
+ border-radius: 3px;
940
+ }
1182
941
 
1183
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1184
- display: none;
1185
- }
942
+ .video-js.skin_cn_news .vjs-live-control {
943
+ display: none !important;
944
+ }
945
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
946
+ display: inline-flex;
947
+ align-items: center;
948
+ align-self: center;
949
+ height: 2.2em;
950
+ gap: 5px;
951
+ width: auto;
952
+ padding: 0 10px;
953
+ border: 1px solid rgba(255, 255, 255, 0.45);
954
+ border-radius: 4px;
955
+ cursor: pointer;
956
+ }
957
+ .video-js.skin_cn_news:not(.vjs-live) .vjs-seek-to-live-control.vjs-control,
958
+ .video-js.skin_cn_news.vjs-live:not(.vjs-liveui) .vjs-seek-to-live-control.vjs-control {
959
+ display: none;
960
+ }
1186
961
 
962
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
963
+ display: none;
964
+ }
965
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
966
+ display: inline-flex;
967
+ align-items: center;
968
+ }
969
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
970
+ content: '';
971
+ display: inline-block;
972
+ width: 8px;
973
+ height: 8px;
974
+ border-radius: 50%;
975
+ background: #ff2d2d; /* red live dot */
976
+ }
977
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
978
+ color: #ffffff;
979
+ font-weight: 700;
980
+ font-size: 12px;
981
+ letter-spacing: 0.03em;
1187
982
  }
1188
983
 
1189
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1190
- content: none !important;
1191
- fill: none !important;
1192
- filter: none !important;
984
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
985
+ border-color: transparent;
986
+ }
987
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
988
+ color: #ff2d2d;
1193
989
  }
1194
990
 
1195
- /* svg icons opacity and hover effect */
1196
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1197
- opacity: 0.7 !important;
991
+ /* ---- time controls ---- */
992
+ .video-js.skin_cn_news .vjs-current-time,
993
+ .video-js.skin_cn_news .vjs-duration,
994
+ .video-js.skin_cn_news .vjs-time-divider {
995
+ display: none;
996
+ align-items: center;
997
+ font-size: 12px;
998
+ font-weight: 700;
999
+ color: #fff;
1000
+ user-select: none;
1001
+ }
1002
+ .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-current-time.vjs-time-control.vjs-control,
1003
+ .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-duration.vjs-time-control.vjs-control,
1004
+ .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-time-divider.vjs-time-control {
1005
+ display: flex;
1006
+ }
1007
+ .video-js.skin_cn_news .vjs-current-time.vjs-time-control.vjs-control {
1008
+ padding-right: 0;
1009
+ }
1010
+ .video-js.skin_cn_news .vjs-duration.vjs-time-control.vjs-control {
1011
+ padding-left: 0;
1012
+ }
1013
+ .video-js.skin_cn_news .vjs-time-control.vjs-time-divider {
1014
+ padding: 0 4px;
1015
+ min-width: 0;
1016
+ width: auto;
1017
+ }
1018
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1019
+ display: none;
1020
+ align-items: center;
1021
+ justify-content: center;
1022
+ font-size: 11px;
1023
+ font-weight: 700;
1024
+ color: #fff;
1025
+ padding: 0 6px;
1026
+ user-select: none;
1198
1027
  }
1199
1028
 
1200
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1201
- opacity: 1 !important;
1029
+
1030
+ .video-js.skin_cn_news .vjs-chapter-marker {
1031
+ z-index: 2;
1032
+ width: var(--vl-chapter-size, 8px);
1033
+ height: var(--vl-chapter-size, 8px);
1034
+ top: 50%;
1035
+ bottom: auto;
1036
+ background: var(--vl-chapter-color, #ffffff);
1037
+ opacity: var(--vl-chapter-opacity, 1);
1038
+ border-radius: 50%;
1039
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1040
+ transform: translate(-50%, -50%) scale(1);
1041
+ transition: background-color 0.12s ease;
1042
+ }
1043
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1044
+ background: var(--vl-chapter-hover, #0a5cff);
1045
+ }
1046
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1047
+ background: var(--vl-chapter-active, #0a5cff);
1202
1048
  }
1203
1049
 
1204
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1205
- color: rgba(255, 255, 2555, 0.7)!important;
1050
+
1051
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1052
+ width: 16px;
1053
+ height: 16px;
1054
+ bottom: 160%;
1055
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1206
1056
  }
1207
1057
 
1208
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1209
- color: rgba(255, 255, 2555, 1)!important;
1058
+
1059
+ .video-js.skin_cn_news .vjs-chapter-preview {
1060
+ background: var(--vl-chapter-tooltip, #0a5cff);
1061
+ border-radius: 6px;
1062
+ padding: 8px 10px;
1063
+ width: max-content;
1064
+ max-width: 300px;
1065
+ text-align: left;
1066
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1067
+ }
1068
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1069
+ color: #ffffff;
1070
+ font-size: 13px;
1071
+ font-weight: 400;
1072
+ margin-bottom: 2px;
1073
+ }
1074
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1075
+ color: #ffffff;
1076
+ font-size: 13px;
1077
+ font-weight: 400;
1078
+ line-height: 1.3;
1079
+ white-space: normal;
1080
+ text-align: left;
1081
+ }
1082
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1083
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1210
1084
  }
1211
1085
 
1086
+ /* ---- responsive ---- */
1087
+ @media (max-width: 576px) {
1088
+ .video-js.skin_cn_news .vjs-control-bar {
1089
+ height: 3.2em !important;
1090
+ padding: 0 8px;
1091
+ }
1092
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1093
+ padding: 0 6px;
1094
+ }
1095
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1096
+ display: none !important;
1097
+ }
1098
+ }
1212
1099
 
1213
1100
  .video-js.skin_news_live .vjs-button>.vjs-icon-placeholder:before {
1214
1101
  font-size: 2.2em;
@@ -1692,364 +1579,477 @@
1692
1579
 
1693
1580
 
1694
1581
 
1695
-
1696
- .video-js.skin_cn_news .vjs-control-bar {
1697
- z-index: 1 !important;
1698
- height: auto !important;
1699
- padding: 0.8em 30px 0.6em;
1700
- background: transparent !important;
1701
- display: flex;
1702
- flex-wrap: wrap;
1703
- align-items: center;
1704
- column-gap: 10px;
1582
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1583
+ font-size: 2.2em;
1584
+ line-height: 2.6;
1585
+ }
1586
+ .video-js.skin_mini{
1587
+ overflow: hidden;
1588
+ }
1589
+ .video-js.skin_mini .vjs-control-bar{
1590
+ z-index: 1 !important;
1591
+ height: 4em !important;
1592
+ background: black !important;
1705
1593
  }
1706
1594
 
1595
+ .video-js.skin_mini .vjs-fade>* {
1596
+ visibility: hidden !important;
1597
+ opacity: 0 !important;
1598
+ transition: visibility 1s, opacity 1s !important;
1599
+ }
1707
1600
 
1708
- .video-js.skin_cn_news .vjs-control-bar::before {
1709
- content: '';
1601
+ .video-js.skin_mini .custom-spaced-progress-bar {
1710
1602
  position: absolute;
1711
- left: 0;
1712
- right: 0;
1713
- bottom: 0;
1714
- top: -3em;
1715
- background: linear-gradient(
1716
- to top,
1717
- rgba(0, 0, 0, 0.85) 0%,
1718
- rgba(0, 0, 0, 0.7) 40%,
1719
- rgba(0, 0, 0, 0.55) 70%,
1720
- rgba(0, 0, 0, 0.38) 86%,
1721
- transparent 100%
1722
- );
1723
- pointer-events: none;
1724
- z-index: -1;
1603
+ width: 100%;
1604
+ display: flex;
1605
+ height: 0.5em;
1606
+ top: -0.5em;
1725
1607
  }
1726
1608
 
1727
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1728
- order: -1;
1729
- flex: 0 0 100%;
1730
- width: 80%;
1731
- margin: 0 0 5em;
1609
+ .video-js.skin_mini .vjs-progress-control {
1610
+ /* left: -6px; */
1732
1611
  position: relative;
1612
+ width: 100%;
1613
+ height: 0.5em;
1614
+ transition: height 0.1s, top 0.1s;
1733
1615
  }
1734
1616
 
1735
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1736
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1737
- width: auto;
1738
- min-width: 0;
1739
- }
1740
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1741
- display: inline-flex;
1742
- align-items: center;
1743
- justify-content: center;
1744
- height: 7em;
1745
- padding: 0 10px;
1746
- color: #fff;
1747
- }
1748
1617
 
1749
- .video-js.skin_cn_news .vjs-svg-icon::before {
1750
- content: none !important;
1751
- }
1752
1618
 
1753
1619
 
1754
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1755
- display: inline-flex;
1756
- align-items: center;
1757
- justify-content: center;
1758
- }
1759
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1760
- .video-js.skin_cn_news .vjs-rewind-button svg {
1761
- width: 24px;
1762
- height: 24px;
1620
+ .video-js.skin_mini .vjs-custom-control-spacer {
1763
1621
  display: block;
1622
+ flex: 1 1 auto;
1764
1623
  }
1765
1624
 
1625
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1626
+ margin: 0 0px 0 0px;
1627
+ }
1628
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1629
+ display: none;
1630
+ }
1631
+
1632
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1633
+ font-size: 14px;
1634
+ font-weight: 500;
1635
+ align-self: center;
1636
+ height: min-content;
1637
+ padding: 5px 2px;
1638
+ border-radius: 8px;
1639
+ }
1766
1640
 
1641
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1642
+ height: 5px !important;
1643
+ }
1767
1644
 
1768
- .video-js.skin_cn_news .vjs-subs-caps-button {
1769
- opacity: 1;
1645
+ .video-js.skin_mini .vjs-play-progress:before {
1646
+ font-size: 1.3em;
1647
+ line-height: unset;
1648
+ top: -0.3333333333em;
1770
1649
  }
1771
1650
 
1651
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1652
+ display: none !important;
1653
+ }
1772
1654
 
1655
+ /* */
1656
+ .video-js.skin_mini .vjs-mouse-display{
1657
+ font-size: 1.6666666667em;
1658
+ }
1773
1659
 
1774
- .video-js.skin_cn_news .vjs-volume-panel {
1775
- margin: 0;
1776
- display: inline-flex;
1777
- align-items: center;
1778
- align-self: center;
1779
- height: 2.2em;
1780
- min-width: 7em;
1781
- transition: none;
1660
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1661
+ font-size: 1em !important;
1782
1662
  }
1783
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1784
- width: 0;
1785
- height: 100%;
1663
+
1664
+ .video-js.skin_mini .vjs-button{
1665
+ width: 3em;
1786
1666
  display: flex;
1787
1667
  align-items: center;
1788
- overflow: hidden;
1789
- opacity: 0;
1790
- transition: width 0.15s ease, opacity 0.15s ease;
1668
+ justify-content: center;
1791
1669
  }
1792
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1793
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1794
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1795
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1796
- width: 5em;
1797
- opacity: 1;
1670
+
1671
+
1672
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1673
+ .icon-maximize {
1674
+ display: block;
1675
+ height: 32px;
1798
1676
  }
1799
1677
 
1800
- .video-js.skin_cn_news .vjs-volume-bar {
1801
- width: 4em;
1802
- height: 0.3em;
1803
- margin: 0 0.45em;
1678
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1679
+ line-height: 4;
1804
1680
  }
1805
1681
 
1682
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1683
+ .icon-minimize {
1684
+ display: none;
1685
+ height: 32px;
1686
+ }
1806
1687
 
1807
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1808
- display: none !important;
1688
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1689
+ outline: none !important;
1690
+ }
1691
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1692
+ .vjs-icon-fullscreen-enter:before {
1693
+ /* content: '' !important; */
1809
1694
  }
1810
1695
 
1811
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1812
- width: 0 !important;
1696
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1697
+ display: flex;
1698
+ justify-content: center;
1699
+ align-items: center;
1700
+ /* transform: rotate(90deg); */
1813
1701
  }
1814
1702
 
1703
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1704
+ display: none;
1705
+ }
1706
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1707
+ margin-left: -10px;
1708
+ display: none;
1709
+ }
1815
1710
 
1816
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1817
- display: block !important;
1818
- flex: 1 1 auto;
1711
+ .video-js.skin_mini .vjs-loading-spinner {
1712
+ position: absolute;
1713
+ top: 50%;
1714
+ left: 50%;
1715
+ transform: translate(-50%, -50%);
1716
+ opacity: .85;
1717
+ text-align: left;
1718
+ border: .2em solid rgba(43, 51, 63, .7);
1719
+ box-sizing: border-box;
1720
+ background-clip: padding-box;
1721
+ width: 3em;
1722
+ height: 3em;
1723
+ border-radius: 50%;
1724
+ visibility: hidden;
1819
1725
  }
1820
1726
 
1727
+ .video-js.skin_mini .skipbtn:hover{
1728
+ cursor: pointer;
1729
+ }
1821
1730
 
1822
- .video-js.skin_cn_news .vjs-big-play-button {
1823
- display: none;
1731
+ .video-js.skin_mini .rewindbtn:hover{
1732
+ cursor: pointer;
1824
1733
  }
1825
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1826
- position: relative !important;
1827
- display: flex;
1828
- left: 0;
1829
- top: -1px;
1734
+
1735
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1736
+ position: relative;
1737
+ padding-left: 0;
1830
1738
  }
1831
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1739
+
1740
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1741
+ width: 40px;
1742
+ height: 40px;
1832
1743
  display: flex;
1833
1744
  justify-content: center;
1834
1745
  align-items: center;
1746
+ border: none;
1835
1747
  position: absolute;
1836
1748
  top: 0;
1837
1749
  left: 0;
1838
1750
  right: 0;
1839
1751
  bottom: 0;
1840
1752
  margin: auto;
1841
- width: 80px;
1842
- height: 80px;
1843
- border: none;
1844
- border-radius: 50%;
1845
- background: rgba(0, 0, 0, 0.55);
1846
- font-size: 5em;
1753
+ font-size: 3em;
1847
1754
  line-height: 1.3em;
1848
1755
  transform: none !important;
1756
+ border-radius: 1.3em;
1849
1757
  }
1850
1758
 
1759
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1760
+ font-weight: bold;
1761
+ }
1851
1762
 
1852
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1853
- height: 4px !important;
1854
- margin: 0;
1855
- border-radius: 20px;
1856
- background-color: #393944;
1763
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1764
+ bottom: 1.1em !important;
1765
+ right: 1em;
1766
+ z-index: 1;
1767
+ font-size: 10px;
1857
1768
  }
1858
1769
 
1859
- .video-js.skin_cn_news .vjs-play-progress {
1860
- background-color: #ffffff;
1861
- border-radius: 20px;
1770
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1771
+ width: 24px !important;
1772
+ height: 24px !important;
1773
+ }
1774
+ .video-js.skin_mini .settings-selector-icon>svg{
1775
+ height: 19px !important;
1776
+ width: 19px !important;
1862
1777
  }
1863
1778
 
1864
- .video-js.skin_cn_news .vjs-load-progress,
1865
- .video-js.skin_cn_news .vjs-load-progress div {
1866
- background: rgba(255, 255, 255, 0.15);
1867
- border-radius: 20px;
1779
+
1780
+ .video-js.skin_mini button.vjs-rewind-button{
1781
+ cursor: pointer;
1782
+ }
1783
+
1784
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1785
+ padding-right: 0;
1868
1786
  }
1869
1787
 
1788
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1789
+ padding-left: 0;
1790
+ }
1870
1791
 
1871
- .video-js.skin_cn_news .vjs-play-progress:before {
1872
- content: '';
1873
- width: 16px;
1874
- height: 16px;
1875
- border-radius: 50%;
1876
- background: #ffffff;
1877
- border: 2px solid rgba(0, 0, 0, 0.6);
1878
- box-sizing: border-box;
1879
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1880
- top: -6px;
1881
- right: -8px;
1792
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1793
+ padding-left: 0;
1794
+ padding-right: 0;
1795
+ display: flex;
1796
+ justify-content: center;
1797
+ width: min-content;
1798
+ }
1799
+
1800
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1801
+ display: none
1802
+ }
1803
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1804
+ display: none
1805
+ }
1806
+
1807
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1808
+ display: flex;
1809
+ align-items: center;
1810
+ font-weight: 700;
1811
+ font-size: 9px;
1812
+ min-width: 0.8em;
1813
+ padding-left: 0;
1814
+ }
1815
+
1816
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1817
+ display: none;
1818
+ font-size: 11px;
1819
+ justify-content: center;
1820
+ align-items: center;
1821
+ user-select: none;
1822
+ }
1823
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1824
+ display: none;
1825
+ }
1826
+
1827
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1828
+ height: min-content;
1829
+ width: min-content;
1830
+ }
1831
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1832
+ width: 3em;
1833
+ margin-right: 4px;
1834
+ }
1835
+
1836
+ .video-js.skin_mini .content{
1837
+ bottom: 3.4rem !important;
1838
+ right: -4rem !important;
1839
+ }
1840
+
1841
+ .video-js.skin_mini .setting-icon > svg{
1842
+ height:18px !important;
1843
+ }
1844
+
1845
+ .output-overlay{
1882
1846
  position: absolute;
1847
+ bottom: 0;
1848
+ height: 100%;
1849
+ width: 100%;
1850
+ z-index: 0;
1851
+ border: 0;
1852
+ pointer-events:none
1883
1853
  }
1884
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1885
- display: none !important;
1854
+
1855
+ .video-js.skin_mini iframe{
1856
+ width: 100%;
1857
+ height: 100%;
1886
1858
  }
1887
1859
 
1888
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1889
- background: #ffffff;
1890
- color: #0a0e17;
1891
- font-weight: 700;
1892
- border-radius: 3px;
1860
+ .video-js.skin_mini .vjs-live-control{
1861
+ align-items: center;
1862
+ max-width: 5em;
1863
+ }
1864
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1865
+ height: 2.2em;
1866
+ display: flex;
1867
+ align-items: center;
1868
+ font-family: monospace;
1869
+ width: 4em;
1870
+ justify-content: center;
1871
+ background: red;
1872
+ margin: 4px 0px 4px 2px;
1893
1873
  }
1894
1874
 
1895
- .video-js.skin_cn_news .vjs-live-control {
1896
- display: none !important;
1875
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1876
+ text-shadow: none;
1897
1877
  }
1898
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1878
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1879
+ display: none;
1880
+ font-size: 12px;
1881
+ }
1882
+
1883
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1884
+ height: 1.8em;
1899
1885
  display: inline-flex;
1900
1886
  align-items: center;
1901
- align-self: center;
1902
- height: 2.2em;
1903
- gap: 5px;
1904
- width: auto;
1905
- padding: 0 10px;
1906
- border: 1px solid rgba(255, 255, 255, 0.45);
1907
- border-radius: 4px;
1908
- cursor: pointer;
1887
+ font-family: monospace;
1888
+ justify-content: center;
1889
+ border: 1.5px solid;
1890
+ margin: 4px 0px 4px 2px;
1891
+ white-space: pre;
1892
+ padding: 2px 4px;
1893
+ font-size: 1.2em;
1894
+ font-weight: 500;
1895
+ color: rgba(255, 255, 2555, 0.7);
1896
+ }
1897
+
1898
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1899
+ content: "NOT LIVE";
1900
+ word-spacing: -4px;
1901
+ }
1902
+
1903
+
1904
+ @media(max-width:600px){
1905
+ .tvProviderImage{
1906
+ display: none
1907
+ }
1908
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1909
+ .icon-maximize {
1910
+ height: 30px !important;
1911
+ }
1912
+
1913
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1914
+ .icon-minimize {
1915
+ height: 30px !important;
1916
+ }
1917
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1918
+ width: 3.5em;
1919
+ }
1920
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1921
+ height: min-content;
1922
+ }
1923
+
1924
+ .video-js.skin_mini button.vjs-slowmo-button{
1925
+ display: none;
1926
+ }
1927
+ .video-js.skin_mini button.vjs-rewind-button{
1928
+ display: none;
1929
+ }
1930
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1931
+ height: 20px;
1932
+ }
1933
+ .video-js.skin_mini .vjs-button{
1934
+ width: 3em;
1935
+ }
1936
+ .video-js.skin_mini .widget-selection{
1937
+ display: none;
1938
+ }
1939
+ .video-js.skin_mini .container{
1940
+ display: none !important;
1941
+ }
1942
+ .video-js.skin_mini .vjs-control-bar{
1943
+ height: 4em !important;
1944
+ }
1945
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1946
+ font-size: 2.5em;
1947
+ line-height: 1.5;
1948
+ }
1949
+ .video-js.skin_mini .vjs-play-progress:before {
1950
+ font-size: 1.2em;
1951
+ position: absolute;
1952
+ right: -0.5em;
1953
+ z-index: 1;
1909
1954
  }
1910
- .video-js.skin_cn_news:not(.vjs-live) .vjs-seek-to-live-control.vjs-control,
1911
- .video-js.skin_cn_news.vjs-live:not(.vjs-liveui) .vjs-seek-to-live-control.vjs-control {
1912
- display: none;
1955
+ .video-js.skin_mini button.vjs-skip-button>svg{
1956
+ height: 20px;
1913
1957
  }
1914
1958
 
1915
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1916
- display: none;
1959
+ .stream-selector-icon>svg{
1960
+ width: 24px;
1961
+ height: 24px;
1917
1962
  }
1918
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1919
- display: inline-flex;
1920
- align-items: center;
1963
+ .video-js.skin_mini .vjs-seek-to-live-text{
1964
+ font-size: 12px;
1921
1965
  }
1922
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1923
- content: '';
1924
- display: inline-block;
1925
- width: 8px;
1926
- height: 8px;
1927
- border-radius: 50%;
1928
- background: #ff2d2d; /* red live dot */
1929
1966
  }
1930
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1931
- color: #ffffff;
1932
- font-weight: 700;
1933
- font-size: 12px;
1934
- letter-spacing: 0.03em;
1967
+
1968
+
1969
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1970
+ background-color: rgba(0, 0, 0, 0.2);
1935
1971
  }
1936
1972
 
1937
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1938
- border-color: transparent;
1973
+
1974
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1975
+ display: flex;
1976
+ justify-content: center;
1977
+ align-items: center;
1978
+ height: 100%;
1979
+ transition: width 0.1s;
1939
1980
  }
1940
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1941
- color: #ff2d2d;
1981
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1982
+ margin: 2px;
1942
1983
  }
1943
1984
 
1944
- /* ---- time controls ---- */
1945
- .video-js.skin_cn_news .vjs-current-time,
1946
- .video-js.skin_cn_news .vjs-duration,
1947
- .video-js.skin_cn_news .vjs-time-divider {
1948
- display: none;
1985
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1986
+ display: flex;
1987
+ justify-content: center;
1949
1988
  align-items: center;
1950
- font-size: 12px;
1951
- font-weight: 700;
1952
- color: #fff;
1953
- user-select: none;
1989
+ height: 100%;
1990
+ transition: width 0.1s;
1954
1991
  }
1955
- .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-current-time.vjs-time-control.vjs-control,
1956
- .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-duration.vjs-time-control.vjs-control,
1957
- .video-js.skin_cn_news.vjs-cn-news-vod:not(.vjs-live) .vjs-time-divider.vjs-time-control {
1958
- display: flex;
1992
+
1993
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1994
+ display: block;
1995
+ font-size: 10px;
1996
+ padding: 6px 10px;
1997
+ margin: 0;
1998
+ max-height: 100%;
1999
+ overflow-y: auto;
1959
2000
  }
1960
- .video-js.skin_cn_news .vjs-current-time.vjs-time-control.vjs-control {
1961
- padding-right: 0;
2001
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
2002
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
2003
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
2004
+ display: block;
2005
+ width: 100%;
1962
2006
  }
1963
- .video-js.skin_cn_news .vjs-duration.vjs-time-control.vjs-control {
1964
- padding-left: 0;
2007
+ .video-js.skin_mini .vjs-text-track-settings fieldset{
2008
+ margin: 4px 0;
1965
2009
  }
1966
- .video-js.skin_cn_news .vjs-time-control.vjs-time-divider {
1967
- padding: 0 4px;
1968
- min-width: 0;
1969
- width: auto;
2010
+ .video-js.skin_mini .vjs-text-track-settings fieldset span{
2011
+ display: block;
2012
+ padding: 0 0 6px;
1970
2013
  }
1971
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1972
- display: none;
1973
- align-items: center;
1974
- justify-content: center;
1975
- font-size: 11px;
1976
- font-weight: 700;
1977
- color: #fff;
1978
- padding: 0 6px;
1979
- user-select: none;
2014
+ .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
2015
+ max-width: 100%;
1980
2016
  }
1981
2017
 
2018
+ @media (max-width: 600px) {
2019
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
2020
+ height: 5px !important;
2021
+ }
1982
2022
 
1983
- .video-js.skin_cn_news .vjs-chapter-marker {
1984
- z-index: 2;
1985
- width: var(--vl-chapter-size, 8px);
1986
- height: var(--vl-chapter-size, 8px);
1987
- top: 50%;
1988
- bottom: auto;
1989
- background: var(--vl-chapter-color, #ffffff);
1990
- opacity: var(--vl-chapter-opacity, 1);
1991
- border-radius: 50%;
1992
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1993
- transform: translate(-50%, -50%) scale(1);
1994
- transition: background-color 0.12s ease;
1995
- }
1996
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1997
- background: var(--vl-chapter-hover, #0a5cff);
1998
- }
1999
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
2000
- background: var(--vl-chapter-active, #0a5cff);
2001
- }
2002
-
2023
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
2024
+ display: none;
2025
+ }
2003
2026
 
2004
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
2005
- width: 16px;
2006
- height: 16px;
2007
- bottom: 160%;
2008
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
2009
2027
  }
2010
2028
 
2011
-
2012
- .video-js.skin_cn_news .vjs-chapter-preview {
2013
- background: var(--vl-chapter-tooltip, #0a5cff);
2014
- border-radius: 6px;
2015
- padding: 8px 10px;
2016
- width: max-content;
2017
- max-width: 300px;
2018
- text-align: left;
2019
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2029
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
2030
+ content: none !important;
2031
+ fill: none !important;
2032
+ filter: none !important;
2020
2033
  }
2021
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2022
- color: #ffffff;
2023
- font-size: 13px;
2024
- font-weight: 400;
2025
- margin-bottom: 2px;
2034
+
2035
+ /* svg icons opacity and hover effect */
2036
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
2037
+ opacity: 0.7 !important;
2026
2038
  }
2027
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2028
- color: #ffffff;
2029
- font-size: 13px;
2030
- font-weight: 400;
2031
- line-height: 1.3;
2032
- white-space: normal;
2033
- text-align: left;
2039
+
2040
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
2041
+ opacity: 1 !important;
2034
2042
  }
2035
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2036
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2043
+
2044
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2045
+ color: rgba(255, 255, 2555, 0.7)!important;
2037
2046
  }
2038
2047
 
2039
- /* ---- responsive ---- */
2040
- @media (max-width: 576px) {
2041
- .video-js.skin_cn_news .vjs-control-bar {
2042
- height: 3.2em !important;
2043
- padding: 0 8px;
2044
- }
2045
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2046
- padding: 0 6px;
2047
- }
2048
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2049
- display: none !important;
2050
- }
2048
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2049
+ color: rgba(255, 255, 2555, 1)!important;
2051
2050
  }
2052
2051
 
2052
+
2053
2053
  /* CSS for videojs-dvr-seekbar */
2054
2054
 
2055
2055
  .video-js.vjs-dvr-seekbar {
@@ -2231,8 +2231,6 @@
2231
2231
 
2232
2232
 
2233
2233
 
2234
-
2235
-
2236
2234
  .video-js .multicamera-parent.default{
2237
2235
  height: 345px;
2238
2236
  position: absolute;
@@ -2312,6 +2310,7 @@
2312
2310
  }
2313
2311
 
2314
2312
 
2313
+
2315
2314
  .vjs-custom-big-mute.vjs-control{
2316
2315
  position: absolute;
2317
2316
  align-items: center;
@@ -2361,6 +2360,7 @@
2361
2360
  }
2362
2361
 
2363
2362
 
2363
+
2364
2364
  /* Watch in Vertical View Button */
2365
2365
  .video-js .vjs-control.vjs-vertical-view-button {
2366
2366
  width: auto !important;
@@ -2730,6 +2730,38 @@
2730
2730
  z-index: 30 !important;
2731
2731
  }
2732
2732
 
2733
+ /* a wrapper element that tracks the mouse vertically */
2734
+ .vjs-thumbnail-holder {
2735
+ position: absolute;
2736
+ left: -1000px;
2737
+ }
2738
+
2739
+ /* the thumbnail image itself */
2740
+ .vjs-thumbnail {
2741
+ position: absolute;
2742
+ left: 0;
2743
+ bottom: 1.3em;
2744
+ opacity: 0;
2745
+ transition: opacity .2s ease;
2746
+ -webkit-transition: opacity .2s ease;
2747
+ -moz-transition: opacity .2s ease;
2748
+ -mz-transition: opacity .2s ease;
2749
+ }
2750
+
2751
+ /* fade in the thumbnail when hovering over the progress bar */
2752
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2753
+ .vjs-progress-control:hover .vjs-thumbnail,
2754
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2755
+ .vjs-progress-control:active .vjs-thumbnail {
2756
+ opacity: 1;
2757
+ }
2758
+
2759
+ /* ... but hide the thumbnail when hovering directly over it */
2760
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2761
+ .vjs-progress-control:active .vjs-thumbnail:active {
2762
+ opacity: 0;
2763
+ }
2764
+
2733
2765
  .video-js.vjs-quality-menu {
2734
2766
  display: block;
2735
2767
  }
@@ -2809,38 +2841,6 @@
2809
2841
  .video-js.vjs-quality-menu .vjs-quality-menu-wrapper .vjs-menu .vjs-menu-content::-webkit-scrollbar{
2810
2842
  display: none;
2811
2843
  }
2812
- /* a wrapper element that tracks the mouse vertically */
2813
- .vjs-thumbnail-holder {
2814
- position: absolute;
2815
- left: -1000px;
2816
- }
2817
-
2818
- /* the thumbnail image itself */
2819
- .vjs-thumbnail {
2820
- position: absolute;
2821
- left: 0;
2822
- bottom: 1.3em;
2823
- opacity: 0;
2824
- transition: opacity .2s ease;
2825
- -webkit-transition: opacity .2s ease;
2826
- -moz-transition: opacity .2s ease;
2827
- -mz-transition: opacity .2s ease;
2828
- }
2829
-
2830
- /* fade in the thumbnail when hovering over the progress bar */
2831
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2832
- .vjs-progress-control:hover .vjs-thumbnail,
2833
- .vjs-progress-control.fake-active .vjs-thumbnail,
2834
- .vjs-progress-control:active .vjs-thumbnail {
2835
- opacity: 1;
2836
- }
2837
-
2838
- /* ... but hide the thumbnail when hovering directly over it */
2839
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2840
- .vjs-progress-control:active .vjs-thumbnail:active {
2841
- opacity: 0;
2842
- }
2843
-
2844
2844
  .vjs-poster {
2845
2845
  display: inline-block;
2846
2846
  vertical-align: middle;