@viewlift/player-backup 2.0.323-backup → 2.0.325-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 (68) hide show
  1. package/cjs/{autoNextVideo-e243e37b.js → autoNextVideo-c5dd7b63.js} +1 -1
  2. package/cjs/bundle.css +815 -815
  3. package/cjs/{caption-settings-749e3991.js → caption-settings-ca214402.js} +1 -1
  4. package/cjs/captions-c8b5cc66.js +1 -0
  5. package/cjs/{features-db5508ee.js → features-0d81abc6.js} +1 -1
  6. package/cjs/{generic-54cf8a68.js → generic-2f477bae.js} +1 -1
  7. package/cjs/{index-92b1574f.js → index-8031c915.js} +1 -1
  8. package/cjs/index-97959524.js +1 -0
  9. package/cjs/{index-9b471ea5.js → index-d62537f9.js} +1 -1
  10. package/cjs/index.js +1 -1
  11. package/cjs/{multicamv2-75d62bc6.js → multicamv2-1f7c21ce.js} +1 -1
  12. package/cjs/{multicamv2-eb1ae109.js → multicamv2-2e168744.js} +1 -1
  13. package/cjs/{nextEpisodeButton-a0a60ba4.js → nextEpisodeButton-8b080d5c.js} +1 -1
  14. package/cjs/{playlist-3ecdee1e.js → playlist-39827f19.js} +1 -1
  15. package/cjs/{series-ea8c865c.js → series-82e12e45.js} +1 -1
  16. package/cjs/{series-v2-3268a9e4.js → series-v2-08088a22.js} +1 -1
  17. package/cjs/{series-v2-9dd40100.js → series-v2-d145e5d8.js} +1 -1
  18. package/cjs/skin-07c2376e.js +1 -0
  19. package/cjs/{skin-2e66860e.js → skin-534deae0.js} +1 -1
  20. package/cjs/{skin-49c25f7b.js → skin-6e1d2ea4.js} +1 -1
  21. package/cjs/{skin-3d504b6f.js → skin-7079f895.js} +1 -1
  22. package/cjs/{skin-b5f248db.js → skin-8a4d439d.js} +1 -1
  23. package/cjs/{skin-c307c196.js → skin-8ae0e53b.js} +1 -1
  24. package/cjs/skin-9c1b7493.js +1 -0
  25. package/cjs/{skin-72d4ff37.js → skin-9eb790a9.js} +1 -1
  26. package/cjs/skin-bb5825e5.js +1 -0
  27. package/cjs/{skin-671692b8.js → skin-c1eaea7b.js} +1 -1
  28. package/cjs/{videoSelector-ee9b1382.js → videoSelector-1d3cfb5a.js} +1 -1
  29. package/cjs/{videoSelector-698da66d.js → videoSelector-f2550ea3.js} +1 -1
  30. package/esm/{autoNextVideo-b094b4eb.js → autoNextVideo-5bb86272.js} +1 -1
  31. package/esm/bundle.css +815 -815
  32. package/esm/{caption-settings-567b8533.js → caption-settings-34923b35.js} +1 -1
  33. package/esm/captions-92c899aa.js +1 -0
  34. package/esm/core/captions.d.ts +1 -0
  35. package/esm/{features-d1c0969b.js → features-d9bac531.js} +1 -1
  36. package/esm/{generic-279952e4.js → generic-f0a863fe.js} +1 -1
  37. package/esm/{index-7814cd08.js → index-61262432.js} +1 -1
  38. package/esm/index-737f2a9f.js +1 -0
  39. package/esm/{index-ae256416.js → index-f6dc7e2a.js} +1 -1
  40. package/esm/index.js +1 -1
  41. package/esm/{multicamv2-68192e76.js → multicamv2-e21023f6.js} +1 -1
  42. package/esm/{multicamv2-bdfc13c0.js → multicamv2-fa0769b4.js} +1 -1
  43. package/esm/{nextEpisodeButton-a1b670a6.js → nextEpisodeButton-a8cda463.js} +1 -1
  44. package/esm/{playlist-cab0eaa2.js → playlist-2e5e2a51.js} +1 -1
  45. package/esm/{series-ffaee63d.js → series-2977422b.js} +1 -1
  46. package/esm/{series-v2-e27f4583.js → series-v2-27b60661.js} +1 -1
  47. package/esm/{series-v2-5717bfa3.js → series-v2-936a0134.js} +1 -1
  48. package/esm/{skin-5b384947.js → skin-0129f8f3.js} +1 -1
  49. package/esm/{skin-2d147bae.js → skin-02776869.js} +1 -1
  50. package/esm/{skin-ab1fb777.js → skin-196bcadd.js} +1 -1
  51. package/esm/{skin-bb16c3bf.js → skin-5a2bbfd2.js} +1 -1
  52. package/esm/{skin-c27a730c.js → skin-6dea6437.js} +1 -1
  53. package/esm/{skin-71506822.js → skin-710b0363.js} +1 -1
  54. package/esm/{skin-3c5e5bca.js → skin-8420eb31.js} +1 -1
  55. package/esm/{skin-961379a6.js → skin-9582414f.js} +1 -1
  56. package/esm/{skin-51700a89.js → skin-e2bb1195.js} +1 -1
  57. package/esm/{skin-2c35d22d.js → skin-e755071a.js} +1 -1
  58. package/esm/utilities/castCommands.d.ts +12 -0
  59. package/esm/{videoSelector-89ff2577.js → videoSelector-8dcd8e64.js} +1 -1
  60. package/esm/{videoSelector-a3f01f77.js → videoSelector-c52dea5d.js} +1 -1
  61. package/package.json +4 -2
  62. package/cjs/captions-0ca41a03.js +0 -1
  63. package/cjs/index-ebdfbf69.js +0 -1
  64. package/cjs/skin-46f381f0.js +0 -1
  65. package/cjs/skin-c4b71f1f.js +0 -1
  66. package/cjs/skin-e562cdac.js +0 -1
  67. package/esm/captions-15915fce.js +0 -1
  68. package/esm/index-608ce5e5.js +0 -1
package/esm/bundle.css CHANGED
@@ -1,5 +1,8 @@
1
1
 
2
2
 
3
+
4
+
5
+
3
6
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
4
7
  height: 0.7em;
5
8
  position: absolute;
@@ -702,27 +705,31 @@
702
705
 
703
706
 
704
707
 
705
-
706
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
708
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
707
709
  font-size: 2.2em;
708
710
  line-height: 2.6;
709
711
  }
710
- .video-js.skin_mini{
711
- overflow: hidden;
712
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
713
+ background: white;
712
714
  }
713
- .video-js.skin_mini .vjs-control-bar{
715
+ .video-js.skin_news .vjs-control-bar{
714
716
  z-index: 1 !important;
715
- height: 4em !important;
717
+ height: 5em !important;
716
718
  background: black !important;
717
719
  }
720
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
721
+ display: flex;
722
+ align-items: center;
723
+ justify-content: center;
724
+ }
718
725
 
719
- .video-js.skin_mini .vjs-fade>* {
726
+ .video-js.skin_news .vjs-fade>* {
720
727
  visibility: hidden !important;
721
728
  opacity: 0 !important;
722
729
  transition: visibility 1s, opacity 1s !important;
723
730
  }
724
731
 
725
- .video-js.skin_mini .custom-spaced-progress-bar {
732
+ .video-js.skin_news .custom-spaced-progress-bar {
726
733
  position: absolute;
727
734
  width: 100%;
728
735
  display: flex;
@@ -730,7 +737,7 @@
730
737
  top: -0.5em;
731
738
  }
732
739
 
733
- .video-js.skin_mini .vjs-progress-control {
740
+ .video-js.skin_news .vjs-progress-control {
734
741
  /* left: -6px; */
735
742
  position: relative;
736
743
  width: 100%;
@@ -741,19 +748,19 @@
741
748
 
742
749
 
743
750
 
744
- .video-js.skin_mini .vjs-custom-control-spacer {
751
+ .video-js.skin_news .vjs-custom-control-spacer {
745
752
  display: block;
746
753
  flex: 1 1 auto;
747
754
  }
748
755
 
749
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
756
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
750
757
  margin: 0 0px 0 0px;
751
758
  }
752
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
759
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
753
760
  display: none;
754
761
  }
755
762
 
756
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
763
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
757
764
  font-size: 14px;
758
765
  font-weight: 500;
759
766
  align-self: center;
@@ -762,158 +769,143 @@
762
769
  border-radius: 8px;
763
770
  }
764
771
 
765
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
766
- height: 5px !important;
772
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
773
+ height: 6px !important;
767
774
  }
768
775
 
769
- .video-js.skin_mini .vjs-play-progress:before {
770
- font-size: 1.3em;
776
+ .video-js.skin_news .vjs-play-progress:before {
777
+ font-size: 1.5em;
771
778
  line-height: unset;
772
779
  top: -0.3333333333em;
773
780
  }
774
781
 
775
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
782
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
776
783
  display: none !important;
777
784
  }
778
785
 
779
786
  /* */
780
- .video-js.skin_mini .vjs-mouse-display{
787
+ .video-js.skin_news .vjs-mouse-display{
781
788
  font-size: 1.6666666667em;
782
789
  }
783
790
 
784
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
791
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
785
792
  font-size: 1em !important;
786
793
  }
787
794
 
788
- .video-js.skin_mini .vjs-button{
789
- width: 3em;
795
+ .video-js.skin_news .vjs-button{
796
+ width: 5.3em;
790
797
  display: flex;
791
798
  align-items: center;
792
799
  justify-content: center;
793
800
  }
794
801
 
795
802
 
796
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
803
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
797
804
  .icon-maximize {
798
805
  display: block;
799
806
  height: 32px;
800
807
  }
801
808
 
802
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
809
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
803
810
  line-height: 4;
804
811
  }
805
812
 
806
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
813
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
807
814
  .icon-minimize {
808
815
  display: none;
809
816
  height: 32px;
810
817
  }
811
818
 
812
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
819
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
813
820
  outline: none !important;
814
821
  }
815
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
822
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
816
823
  .vjs-icon-fullscreen-enter:before {
817
824
  /* content: '' !important; */
818
825
  }
819
826
 
820
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
827
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
821
828
  display: flex;
822
829
  justify-content: center;
823
830
  align-items: center;
824
831
  /* transform: rotate(90deg); */
825
832
  }
826
833
 
827
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
834
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
828
835
  display: none;
829
836
  }
830
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
837
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
831
838
  margin-left: -10px;
832
- display: none;
833
- }
834
-
835
- .video-js.skin_mini .vjs-loading-spinner {
836
- position: absolute;
837
- top: 50%;
838
- left: 50%;
839
- transform: translate(-50%, -50%);
840
- opacity: .85;
841
- text-align: left;
842
- border: .2em solid rgba(43, 51, 63, .7);
843
- box-sizing: border-box;
844
- background-clip: padding-box;
845
- width: 3em;
846
- height: 3em;
847
- border-radius: 50%;
848
- visibility: hidden;
849
839
  }
850
840
 
851
- .video-js.skin_mini .skipbtn:hover{
841
+ .video-js.skin_news .skipbtn:hover{
852
842
  cursor: pointer;
853
843
  }
854
844
 
855
- .video-js.skin_mini .rewindbtn:hover{
845
+ .video-js.skin_news .rewindbtn:hover{
856
846
  cursor: pointer;
857
847
  }
858
848
 
859
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
849
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
860
850
  position: relative;
861
851
  padding-left: 0;
862
852
  }
863
853
 
864
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
865
- width: 40px;
866
- height: 40px;
867
- display: flex;
868
- justify-content: center;
869
- align-items: center;
870
- border: none;
871
- position: absolute;
872
- top: 0;
873
- left: 0;
874
- right: 0;
875
- bottom: 0;
876
- margin: auto;
877
- font-size: 3em;
878
- line-height: 1.3em;
879
- transform: none !important;
880
- border-radius: 1.3em;
854
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
855
+ display: none !important;
881
856
  }
882
857
 
883
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
858
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
859
+ width: 90px;
860
+ height: 90px;
861
+ display: flex;
862
+ justify-content: center;
863
+ align-items: center;
864
+ border-radius: 50%;
865
+ position: absolute;
866
+ top: 0;
867
+ left: 0;
868
+ right: 0;
869
+ bottom: 0;
870
+ margin: auto;
871
+ font-size: 6em;
872
+ line-height: 1.4em;
873
+ border: 0.05em solid;
874
+ color: inherit;
875
+ }
876
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
884
877
  font-weight: bold;
885
878
  }
886
879
 
887
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
888
- bottom: 1.1em !important;
889
- right: 1em;
880
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
881
+ bottom: 2.4em !important;
882
+ right: -1em;
890
883
  z-index: 1;
891
- font-size: 10px;
892
884
  }
893
885
 
894
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
886
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
895
887
  width: 24px !important;
896
888
  height: 24px !important;
897
889
  }
898
- .video-js.skin_mini .settings-selector-icon>svg{
890
+ .settings-selector-icon>svg{
899
891
  height: 19px !important;
900
892
  width: 19px !important;
901
893
  }
902
894
 
903
895
 
904
- .video-js.skin_mini button.vjs-rewind-button{
896
+ .video-js.skin_news button.vjs-rewind-button{
905
897
  cursor: pointer;
906
898
  }
907
899
 
908
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
900
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
909
901
  padding-right: 0;
910
902
  }
911
903
 
912
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
904
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
913
905
  padding-left: 0;
914
906
  }
915
907
 
916
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
908
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
917
909
  padding-left: 0;
918
910
  padding-right: 0;
919
911
  display: flex;
@@ -921,48 +913,46 @@
921
913
  width: min-content;
922
914
  }
923
915
 
924
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
916
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
925
917
  display: none
926
918
  }
927
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
919
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
928
920
  display: none
929
921
  }
930
922
 
931
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
932
- display: flex;
933
- align-items: center;
934
- font-weight: 700;
935
- font-size: 9px;
936
- min-width: 0.8em;
937
- padding-left: 0;
923
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
924
+ display: flex;
925
+ align-items: center;
926
+ font-weight: 700;
927
+ font-size: 12px;
928
+ min-width: 1.2em;
938
929
  }
939
930
 
940
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
931
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
941
932
  display: none;
942
933
  font-size: 11px;
943
934
  justify-content: center;
944
935
  align-items: center;
945
936
  user-select: none;
946
937
  }
947
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
938
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
948
939
  display: none;
949
940
  }
950
941
 
951
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
942
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
952
943
  height: min-content;
953
944
  width: min-content;
954
945
  }
955
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
956
- width: 3em;
957
- margin-right: 4px;
946
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
947
+ width: 6em;
958
948
  }
959
949
 
960
- .video-js.skin_mini .content{
950
+ .video-js.skin_news .content{
961
951
  bottom: 3.4rem !important;
962
952
  right: -4rem !important;
963
953
  }
964
954
 
965
- .video-js.skin_mini .setting-icon > svg{
955
+ .setting-icon > svg{
966
956
  height:18px !important;
967
957
  }
968
958
 
@@ -976,16 +966,15 @@
976
966
  pointer-events:none
977
967
  }
978
968
 
979
- .video-js.skin_mini iframe{
969
+ .video-js.skin_news iframe{
980
970
  width: 100%;
981
971
  height: 100%;
982
972
  }
983
973
 
984
- .video-js.skin_mini .vjs-live-control{
974
+ .video-js.skin_news .vjs-live-control{
985
975
  align-items: center;
986
- max-width: 5em;
987
976
  }
988
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
977
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
989
978
  height: 2.2em;
990
979
  display: flex;
991
980
  align-items: center;
@@ -993,1047 +982,1058 @@
993
982
  width: 4em;
994
983
  justify-content: center;
995
984
  background: red;
996
- margin: 4px 0px 4px 2px;
985
+ margin: 4px 0px 4px 12px;
997
986
  }
998
987
 
999
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
988
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1000
989
  text-shadow: none;
1001
990
  }
1002
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
991
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1003
992
  display: none;
1004
993
  font-size: 12px;
1005
994
  }
1006
995
 
1007
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1008
- height: 1.8em;
996
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
997
+ height: 2.2em;
1009
998
  display: inline-flex;
1010
999
  align-items: center;
1011
- font-family: monospace;
1000
+ /* font-family: monospace; */
1012
1001
  justify-content: center;
1013
- border: 1.5px solid;
1014
- margin: 4px 0px 4px 2px;
1002
+ border: 2px solid;
1003
+ margin: 4px 0px 4px 6px;
1015
1004
  white-space: pre;
1016
- padding: 2px 4px;
1005
+ padding: 0px 6px;
1017
1006
  font-size: 1.2em;
1018
1007
  font-weight: 500;
1019
1008
  color: rgba(255, 255, 2555, 0.7);
1009
+
1010
+ letter-spacing: -.1px;
1011
+ line-height: normal;
1012
+ text-transform: uppercase;
1013
+ color: #FFFFFF;
1014
+ opacity: .7;
1015
+ font-family: "Proxima Nova";
1020
1016
  }
1021
1017
 
1022
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1018
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1019
+ opacity: 1;
1020
+ }
1021
+
1022
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1023
1023
  content: "NOT LIVE";
1024
- word-spacing: -4px;
1025
1024
  }
1026
1025
 
1026
+ .settings-selection.vjs-control.vjs-button{
1027
+ display: flex !important;
1028
+ }
1027
1029
 
1028
- @media(max-width:600px){
1030
+ @media(max-width:576px){
1031
+ .settings-selection.vjs-control.vjs-button{
1032
+ display: none !important;
1033
+ }
1034
+ }
1035
+
1036
+
1037
+ @media(max-width:576px){
1029
1038
  .tvProviderImage{
1030
1039
  display: none
1031
1040
  }
1032
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1041
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1033
1042
  .icon-maximize {
1034
1043
  height: 30px !important;
1035
1044
  }
1036
1045
 
1037
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1046
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1038
1047
  .icon-minimize {
1039
1048
  height: 30px !important;
1040
1049
  }
1041
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1042
- width: 3.5em;
1050
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1051
+ width: 4.5em;
1043
1052
  }
1044
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1053
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1045
1054
  height: min-content;
1046
1055
  }
1047
1056
 
1048
- .video-js.skin_mini button.vjs-slowmo-button{
1057
+ .video-js.skin_news button.vjs-slowmo-button{
1049
1058
  display: none;
1050
1059
  }
1051
- .video-js.skin_mini button.vjs-rewind-button{
1060
+ .video-js.skin_news button.vjs-rewind-button{
1052
1061
  display: none;
1053
1062
  }
1054
- .video-js.skin_mini button.vjs-rewind-button>svg{
1063
+ .video-js.skin_news button.vjs-rewind-button>svg{
1055
1064
  height: 20px;
1056
1065
  }
1057
- .video-js.skin_mini .vjs-button{
1058
- width: 3em;
1066
+ .video-js.skin_news .vjs-button{
1067
+ width: 4.8em;
1059
1068
  }
1060
- .video-js.skin_mini .widget-selection{
1069
+ .video-js.skin_news .widget-selection{
1061
1070
  display: none;
1062
1071
  }
1063
- .video-js.skin_mini .container{
1072
+ .video-js.skin_news .container{
1064
1073
  display: none !important;
1065
1074
  }
1066
- .video-js.skin_mini .vjs-control-bar{
1075
+ .video-js.skin_news .vjs-control-bar{
1067
1076
  height: 4em !important;
1068
1077
  }
1069
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1078
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1070
1079
  font-size: 2.5em;
1071
1080
  line-height: 1.5;
1072
1081
  }
1073
- .video-js.skin_mini .vjs-play-progress:before {
1082
+ .video-js.skin_news .vjs-play-progress:before {
1074
1083
  font-size: 1.2em;
1075
1084
  position: absolute;
1076
1085
  right: -0.5em;
1077
1086
  z-index: 1;
1078
1087
  }
1079
- .video-js.skin_mini button.vjs-skip-button>svg{
1088
+ .video-js.skin_news button.vjs-skip-button>svg{
1080
1089
  height: 20px;
1081
1090
  }
1091
+ .video-js.skin_news button.vjs-big-play-button {
1092
+ width: 50px !important;
1093
+ height: 50px !important;
1094
+ font-size: 2.1rem !important;
1095
+ }
1082
1096
 
1083
1097
  .stream-selector-icon>svg{
1084
1098
  width: 24px;
1085
1099
  height: 24px;
1086
1100
  }
1087
- .video-js.skin_mini .vjs-seek-to-live-text{
1088
- font-size: 12px;
1101
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1102
+ margin: 0 12px 0 12px;
1089
1103
  }
1090
-
1091
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1092
- color: white !important;
1093
- font-size: 16px !important;
1094
- background-color: rgba(0,0,0,0.2) !important;
1095
- }
1104
+ .video-js.skin_news .vjs-seek-to-live-text{
1105
+ font-size: 12px;
1096
1106
  }
1097
-
1098
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1099
- color: white !important;
1100
- font-size: 16px !important;
1101
- background-color: rgba(0,0,0,0.2) !important;
1107
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1108
+ margin: 0 12px 0 12px;
1102
1109
  }
1103
-
1104
- .video-js.skin_mini .vjs-text-track-display-ttml p {
1105
- font-size: 18px !important;
1106
1110
  }
1107
-
1108
- .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1109
- margin-bottom: 1rem !important;
1111
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1112
+ width: 90px;
1113
+ height: 90px;
1114
+ display: flex;
1115
+ justify-content: center;
1116
+ align-items: center;
1117
+ border-radius: 50%;
1118
+ position: absolute;
1119
+ top: 0;
1120
+ left: 0;
1121
+ right: 0;
1122
+ bottom: 0;
1123
+ margin: auto;
1124
+ font-size: 6em;
1125
+ line-height: 1.4em;
1110
1126
  }
1111
1127
 
1112
-
1113
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1128
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1114
1129
  display: flex;
1115
1130
  justify-content: center;
1116
1131
  align-items: center;
1117
1132
  height: 100%;
1118
1133
  transition: width 0.1s;
1119
1134
  }
1120
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1121
- margin: 2px;
1122
- }
1123
1135
 
1124
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1136
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1125
1137
  display: flex;
1126
1138
  justify-content: center;
1127
1139
  align-items: center;
1128
1140
  height: 100%;
1129
1141
  transition: width 0.1s;
1130
1142
  }
1131
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1132
- display: grid;
1133
- font-size: 10px;
1134
- grid-template-columns: 1fr;
1135
- grid-template-rows: 1fr;
1136
- padding: 1px 0px 0 0px;
1137
- margin: 0;
1143
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1144
+ display: none !important;
1145
+ }
1146
+ .video-js.skin_news .ssai-ad-container{
1147
+ position: absolute;
1148
+ bottom: 14px;
1138
1149
  }
1139
1150
 
1140
- @media (max-width: 600px) {
1141
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1151
+ @media (max-width: 576px) {
1152
+ .video-js.skin_news .ssai-ad-container{
1153
+ bottom: 2px;
1154
+ }
1155
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1142
1156
  height: 5px !important;
1143
1157
  }
1158
+ .video-js.skin_news button.vjs-big-play-button {
1159
+ width: 50px !important;
1160
+ height: 50px !important;
1161
+ font-size: 2.1rem !important;
1162
+ }
1144
1163
 
1145
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1164
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1146
1165
  display: none;
1147
1166
  }
1167
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1168
+ bottom: 2.4em !important;
1169
+ right: -1em;
1170
+ z-index: 1;
1171
+ }
1172
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1173
+ display: none !important;
1174
+ }
1175
+
1176
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1177
+ color: white;
1178
+ font-size: 13px;
1179
+ background-color: black;
1180
+ }
1181
+ }
1182
+
1183
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1184
+ color: white;
1185
+ font-size: 16px;
1186
+ background-color: black;
1187
+ }
1148
1188
 
1189
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1190
+ margin-bottom: 2rem !important;
1149
1191
  }
1150
1192
 
1151
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1193
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1194
+ font-size: 18px !important;
1195
+ }
1196
+
1197
+
1198
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1199
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1200
+ font-size: 1.2em !important;
1201
+ line-height: 1.5em !important;
1202
+ padding: 0.2em 0.8em !important;
1203
+ }
1204
+
1205
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1152
1206
  content: none !important;
1153
1207
  fill: none !important;
1154
1208
  filter: none !important;
1155
1209
  }
1156
1210
 
1157
1211
  /* svg icons opacity and hover effect */
1158
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1212
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1159
1213
  opacity: 0.7 !important;
1160
1214
  }
1161
1215
 
1162
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1216
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1217
+ opacity: 1 !important;
1218
+ }
1219
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1220
+ opacity: 0.7 !important;
1221
+ }
1222
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1163
1223
  opacity: 1 !important;
1164
1224
  }
1165
1225
 
1166
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1226
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1167
1227
  color: rgba(255, 255, 2555, 0.7)!important;
1168
1228
  }
1169
1229
 
1170
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1230
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1171
1231
  color: rgba(255, 255, 2555, 1)!important;
1172
1232
  }
1173
1233
 
1174
1234
 
1175
1235
 
1176
-
1177
- .video-js.skin_cn_news .vjs-control-bar {
1178
- z-index: 1 !important;
1179
- height: auto !important;
1180
- padding: 0.8em 30px 0.6em;
1181
- background: transparent !important;
1182
- display: flex;
1183
- flex-wrap: wrap;
1184
- align-items: center;
1185
- column-gap: 10px;
1236
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1237
+ font-size: 2.2em;
1238
+ line-height: 2.6;
1239
+ }
1240
+ .video-js.skin_mini{
1241
+ overflow: hidden;
1242
+ }
1243
+ .video-js.skin_mini .vjs-control-bar{
1244
+ z-index: 1 !important;
1245
+ height: 4em !important;
1246
+ background: black !important;
1186
1247
  }
1187
1248
 
1249
+ .video-js.skin_mini .vjs-fade>* {
1250
+ visibility: hidden !important;
1251
+ opacity: 0 !important;
1252
+ transition: visibility 1s, opacity 1s !important;
1253
+ }
1188
1254
 
1189
- .video-js.skin_cn_news .vjs-control-bar::before {
1190
- content: '';
1255
+ .video-js.skin_mini .custom-spaced-progress-bar {
1191
1256
  position: absolute;
1192
- left: 0;
1193
- right: 0;
1194
- bottom: 0;
1195
- top: -3em;
1196
- background: linear-gradient(
1197
- to top,
1198
- rgba(0, 0, 0, 0.85) 0%,
1199
- rgba(0, 0, 0, 0.7) 40%,
1200
- rgba(0, 0, 0, 0.55) 70%,
1201
- rgba(0, 0, 0, 0.38) 86%,
1202
- transparent 100%
1203
- );
1204
- pointer-events: none;
1205
- z-index: -1;
1257
+ width: 100%;
1258
+ display: flex;
1259
+ height: 0.5em;
1260
+ top: -0.5em;
1206
1261
  }
1207
1262
 
1208
- .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1209
- order: -1;
1210
- flex: 0 0 100%;
1211
- width: 80%;
1212
- margin: 0 0 5em;
1263
+ .video-js.skin_mini .vjs-progress-control {
1264
+ /* left: -6px; */
1213
1265
  position: relative;
1266
+ width: 100%;
1267
+ height: 0.5em;
1268
+ transition: height 0.1s, top 0.1s;
1214
1269
  }
1215
1270
 
1216
- .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1217
- .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1218
- width: auto;
1219
- min-width: 0;
1220
- }
1221
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1222
- display: inline-flex;
1223
- align-items: center;
1224
- justify-content: center;
1225
- height: 7em;
1226
- padding: 0 10px;
1227
- color: #fff;
1228
- }
1229
1271
 
1230
- .video-js.skin_cn_news .vjs-svg-icon::before {
1231
- content: none !important;
1232
- }
1233
1272
 
1234
1273
 
1235
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1236
- display: inline-flex;
1237
- align-items: center;
1238
- justify-content: center;
1239
- }
1240
- .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1241
- .video-js.skin_cn_news .vjs-rewind-button svg {
1242
- width: 24px;
1243
- height: 24px;
1274
+ .video-js.skin_mini .vjs-custom-control-spacer {
1244
1275
  display: block;
1276
+ flex: 1 1 auto;
1245
1277
  }
1246
1278
 
1279
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1280
+ margin: 0 0px 0 0px;
1281
+ }
1282
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1283
+ display: none;
1284
+ }
1247
1285
 
1248
-
1249
- .video-js.skin_cn_news .vjs-subs-caps-button {
1250
- opacity: 1;
1286
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1287
+ font-size: 14px;
1288
+ font-weight: 500;
1289
+ align-self: center;
1290
+ height: min-content;
1291
+ padding: 5px 2px;
1292
+ border-radius: 8px;
1251
1293
  }
1252
1294
 
1295
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1296
+ height: 5px !important;
1297
+ }
1253
1298
 
1299
+ .video-js.skin_mini .vjs-play-progress:before {
1300
+ font-size: 1.3em;
1301
+ line-height: unset;
1302
+ top: -0.3333333333em;
1303
+ }
1254
1304
 
1255
- .video-js.skin_cn_news .vjs-volume-panel {
1256
- margin: 0;
1257
- display: inline-flex;
1258
- align-items: center;
1259
- align-self: center;
1260
- height: 2.2em;
1261
- min-width: 7em;
1262
- transition: none;
1305
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1306
+ display: none !important;
1263
1307
  }
1264
- .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1265
- width: 0;
1266
- height: 100%;
1308
+
1309
+ /* */
1310
+ .video-js.skin_mini .vjs-mouse-display{
1311
+ font-size: 1.6666666667em;
1312
+ }
1313
+
1314
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1315
+ font-size: 1em !important;
1316
+ }
1317
+
1318
+ .video-js.skin_mini .vjs-button{
1319
+ width: 3em;
1267
1320
  display: flex;
1268
1321
  align-items: center;
1269
- overflow: hidden;
1270
- opacity: 0;
1271
- transition: width 0.15s ease, opacity 0.15s ease;
1322
+ justify-content: center;
1272
1323
  }
1273
- .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1274
- .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1275
- .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1276
- .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1277
- width: 5em;
1278
- opacity: 1;
1324
+
1325
+
1326
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1327
+ .icon-maximize {
1328
+ display: block;
1329
+ height: 32px;
1279
1330
  }
1280
1331
 
1281
- .video-js.skin_cn_news .vjs-volume-bar {
1282
- width: 4em;
1283
- height: 0.3em;
1284
- margin: 0 0.45em;
1332
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1333
+ line-height: 4;
1285
1334
  }
1286
1335
 
1336
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1337
+ .icon-minimize {
1338
+ display: none;
1339
+ height: 32px;
1340
+ }
1287
1341
 
1288
- .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1289
- display: none !important;
1342
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1343
+ outline: none !important;
1344
+ }
1345
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1346
+ .vjs-icon-fullscreen-enter:before {
1347
+ /* content: '' !important; */
1290
1348
  }
1291
1349
 
1292
- .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1293
- width: 0 !important;
1350
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1351
+ display: flex;
1352
+ justify-content: center;
1353
+ align-items: center;
1354
+ /* transform: rotate(90deg); */
1294
1355
  }
1295
1356
 
1357
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1358
+ display: none;
1359
+ }
1360
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1361
+ margin-left: -10px;
1362
+ display: none;
1363
+ }
1296
1364
 
1297
- .video-js.skin_cn_news .vjs-custom-control-spacer {
1298
- display: block !important;
1299
- flex: 1 1 auto;
1365
+ .video-js.skin_mini .vjs-loading-spinner {
1366
+ position: absolute;
1367
+ top: 50%;
1368
+ left: 50%;
1369
+ transform: translate(-50%, -50%);
1370
+ opacity: .85;
1371
+ text-align: left;
1372
+ border: .2em solid rgba(43, 51, 63, .7);
1373
+ box-sizing: border-box;
1374
+ background-clip: padding-box;
1375
+ width: 3em;
1376
+ height: 3em;
1377
+ border-radius: 50%;
1378
+ visibility: hidden;
1300
1379
  }
1301
1380
 
1381
+ .video-js.skin_mini .skipbtn:hover{
1382
+ cursor: pointer;
1383
+ }
1302
1384
 
1303
- .video-js.skin_cn_news .vjs-big-play-button {
1304
- display: none;
1385
+ .video-js.skin_mini .rewindbtn:hover{
1386
+ cursor: pointer;
1305
1387
  }
1306
- .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1307
- position: relative !important;
1308
- display: flex;
1309
- left: 0;
1310
- top: -1px;
1388
+
1389
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1390
+ position: relative;
1391
+ padding-left: 0;
1311
1392
  }
1312
- .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1393
+
1394
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1395
+ width: 40px;
1396
+ height: 40px;
1313
1397
  display: flex;
1314
1398
  justify-content: center;
1315
1399
  align-items: center;
1400
+ border: none;
1316
1401
  position: absolute;
1317
1402
  top: 0;
1318
1403
  left: 0;
1319
1404
  right: 0;
1320
1405
  bottom: 0;
1321
1406
  margin: auto;
1322
- width: 80px;
1323
- height: 80px;
1324
- border: none;
1325
- border-radius: 50%;
1326
- background: rgba(0, 0, 0, 0.55);
1327
- font-size: 5em;
1407
+ font-size: 3em;
1328
1408
  line-height: 1.3em;
1329
1409
  transform: none !important;
1410
+ border-radius: 1.3em;
1330
1411
  }
1331
1412
 
1332
-
1333
- .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1334
- height: 4px !important;
1335
- margin: 0;
1336
- border-radius: 20px;
1337
- background-color: #393944;
1413
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1414
+ font-weight: bold;
1338
1415
  }
1339
1416
 
1340
- .video-js.skin_cn_news .vjs-play-progress {
1341
- background-color: #ffffff;
1342
- border-radius: 20px;
1417
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1418
+ bottom: 1.1em !important;
1419
+ right: 1em;
1420
+ z-index: 1;
1421
+ font-size: 10px;
1343
1422
  }
1344
1423
 
1345
- .video-js.skin_cn_news .vjs-load-progress,
1346
- .video-js.skin_cn_news .vjs-load-progress div {
1347
- background: rgba(255, 255, 255, 0.15);
1348
- border-radius: 20px;
1424
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1425
+ width: 24px !important;
1426
+ height: 24px !important;
1427
+ }
1428
+ .video-js.skin_mini .settings-selector-icon>svg{
1429
+ height: 19px !important;
1430
+ width: 19px !important;
1349
1431
  }
1350
1432
 
1351
1433
 
1352
- .video-js.skin_cn_news .vjs-play-progress:before {
1353
- content: '';
1354
- width: 16px;
1355
- height: 16px;
1356
- border-radius: 50%;
1357
- background: #ffffff;
1358
- border: 2px solid rgba(0, 0, 0, 0.6);
1359
- box-sizing: border-box;
1360
- box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1361
- top: -6px;
1362
- right: -8px;
1363
- position: absolute;
1434
+ .video-js.skin_mini button.vjs-rewind-button{
1435
+ cursor: pointer;
1364
1436
  }
1365
- .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1366
- display: none !important;
1437
+
1438
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1439
+ padding-right: 0;
1367
1440
  }
1368
1441
 
1369
- .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1370
- background: #ffffff;
1371
- color: #0a0e17;
1372
- font-weight: 700;
1373
- border-radius: 3px;
1442
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1443
+ padding-left: 0;
1374
1444
  }
1375
1445
 
1376
- .video-js.skin_cn_news .vjs-live-control {
1377
- display: none !important;
1446
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1447
+ padding-left: 0;
1448
+ padding-right: 0;
1449
+ display: flex;
1450
+ justify-content: center;
1451
+ width: min-content;
1378
1452
  }
1379
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1380
- display: inline-flex;
1381
- align-items: center;
1382
- align-self: center;
1383
- height: 2.2em;
1384
- gap: 5px;
1385
- width: auto;
1386
- padding: 0 10px;
1387
- border: 1px solid rgba(255, 255, 255, 0.45);
1388
- border-radius: 4px;
1389
- cursor: pointer;
1453
+
1454
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1455
+ display: none
1456
+ }
1457
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1458
+ display: none
1390
1459
  }
1391
1460
 
1392
- .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1393
- display: none;
1461
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1462
+ display: flex;
1463
+ align-items: center;
1464
+ font-weight: 700;
1465
+ font-size: 9px;
1466
+ min-width: 0.8em;
1467
+ padding-left: 0;
1394
1468
  }
1395
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1396
- display: inline-flex;
1469
+
1470
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1471
+ display: none;
1472
+ font-size: 11px;
1473
+ justify-content: center;
1397
1474
  align-items: center;
1475
+ user-select: none;
1398
1476
  }
1399
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1400
- content: '';
1401
- display: inline-block;
1402
- width: 8px;
1403
- height: 8px;
1404
- border-radius: 50%;
1405
- background: #ff2d2d; /* red live dot */
1406
- }
1407
- .video-js.skin_cn_news .vjs-seek-to-live-text {
1408
- color: #ffffff;
1409
- font-weight: 700;
1410
- font-size: 12px;
1411
- letter-spacing: 0.03em;
1477
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1478
+ display: none;
1412
1479
  }
1413
1480
 
1414
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1415
- border-color: transparent;
1481
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1482
+ height: min-content;
1483
+ width: min-content;
1416
1484
  }
1417
- .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1418
- color: #ff2d2d;
1485
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1486
+ width: 3em;
1487
+ margin-right: 4px;
1419
1488
  }
1420
1489
 
1421
- /* ---- time controls ---- */
1422
- .video-js.skin_cn_news .vjs-current-time,
1423
- .video-js.skin_cn_news .vjs-duration,
1424
- .video-js.skin_cn_news .vjs-time-divider {
1425
- display: none !important;
1426
- }
1427
- .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1428
- display: none;
1429
- align-items: center;
1430
- justify-content: center;
1431
- font-size: 11px;
1432
- font-weight: 700;
1433
- color: #fff;
1434
- padding: 0 6px;
1435
- user-select: none;
1490
+ .video-js.skin_mini .content{
1491
+ bottom: 3.4rem !important;
1492
+ right: -4rem !important;
1436
1493
  }
1437
1494
 
1495
+ .video-js.skin_mini .setting-icon > svg{
1496
+ height:18px !important;
1497
+ }
1438
1498
 
1439
- .video-js.skin_cn_news .vjs-chapter-marker {
1440
- z-index: 2;
1441
- width: var(--vl-chapter-size, 8px);
1442
- height: var(--vl-chapter-size, 8px);
1443
- top: 50%;
1444
- bottom: auto;
1445
- background: var(--vl-chapter-color, #ffffff);
1446
- opacity: var(--vl-chapter-opacity, 1);
1447
- border-radius: 50%;
1448
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1449
- transform: translate(-50%, -50%) scale(1);
1450
- transition: background-color 0.12s ease;
1451
- }
1452
- .video-js.skin_cn_news .vjs-chapter-marker:hover {
1453
- background: var(--vl-chapter-hover, #0a5cff);
1454
- }
1455
- .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1456
- background: var(--vl-chapter-active, #0a5cff);
1457
- }
1458
-
1459
-
1460
- .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1461
- width: 16px;
1462
- height: 16px;
1463
- bottom: 160%;
1464
- filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
1465
- }
1466
-
1467
-
1468
- .video-js.skin_cn_news .vjs-chapter-preview {
1469
- background: var(--vl-chapter-tooltip, #0a5cff);
1470
- border-radius: 6px;
1471
- padding: 8px 10px;
1472
- width: max-content;
1473
- max-width: 300px;
1474
- text-align: left;
1475
- box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
1476
- }
1477
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
1478
- color: #ffffff;
1479
- font-size: 13px;
1480
- font-weight: 400;
1481
- margin-bottom: 2px;
1482
- }
1483
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
1484
- color: #ffffff;
1485
- font-size: 13px;
1486
- font-weight: 400;
1487
- line-height: 1.3;
1488
- white-space: normal;
1489
- text-align: left;
1490
- }
1491
- .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
1492
- border-top-color: var(--vl-chapter-tooltip, #0a5cff);
1499
+ .output-overlay{
1500
+ position: absolute;
1501
+ bottom: 0;
1502
+ height: 100%;
1503
+ width: 100%;
1504
+ z-index: 0;
1505
+ border: 0;
1506
+ pointer-events:none
1493
1507
  }
1494
1508
 
1495
- /* ---- responsive ---- */
1496
- @media (max-width: 576px) {
1497
- .video-js.skin_cn_news .vjs-control-bar {
1498
- height: 3.2em !important;
1499
- padding: 0 8px;
1500
- }
1501
- .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1502
- padding: 0 6px;
1503
- }
1504
- .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
1505
- display: none !important;
1506
- }
1509
+ .video-js.skin_mini iframe{
1510
+ width: 100%;
1511
+ height: 100%;
1507
1512
  }
1508
1513
 
1509
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1510
- font-size: 2.2em;
1511
- line-height: 2.6;
1512
- }
1513
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1514
- background: white;
1515
- }
1516
- .video-js.skin_news .vjs-control-bar{
1517
- z-index: 1 !important;
1518
- height: 5em !important;
1519
- background: black !important;
1514
+ .video-js.skin_mini .vjs-live-control{
1515
+ align-items: center;
1516
+ max-width: 5em;
1520
1517
  }
1521
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1518
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1519
+ height: 2.2em;
1522
1520
  display: flex;
1523
1521
  align-items: center;
1522
+ font-family: monospace;
1523
+ width: 4em;
1524
1524
  justify-content: center;
1525
+ background: red;
1526
+ margin: 4px 0px 4px 2px;
1525
1527
  }
1526
1528
 
1527
- .video-js.skin_news .vjs-fade>* {
1528
- visibility: hidden !important;
1529
- opacity: 0 !important;
1530
- transition: visibility 1s, opacity 1s !important;
1529
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1530
+ text-shadow: none;
1531
1531
  }
1532
-
1533
- .video-js.skin_news .custom-spaced-progress-bar {
1534
- position: absolute;
1535
- width: 100%;
1536
- display: flex;
1537
- height: 0.5em;
1538
- top: -0.5em;
1532
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1533
+ display: none;
1534
+ font-size: 12px;
1539
1535
  }
1540
1536
 
1541
- .video-js.skin_news .vjs-progress-control {
1542
- /* left: -6px; */
1543
- position: relative;
1544
- width: 100%;
1545
- height: 0.5em;
1546
- transition: height 0.1s, top 0.1s;
1537
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1538
+ height: 1.8em;
1539
+ display: inline-flex;
1540
+ align-items: center;
1541
+ font-family: monospace;
1542
+ justify-content: center;
1543
+ border: 1.5px solid;
1544
+ margin: 4px 0px 4px 2px;
1545
+ white-space: pre;
1546
+ padding: 2px 4px;
1547
+ font-size: 1.2em;
1548
+ font-weight: 500;
1549
+ color: rgba(255, 255, 2555, 0.7);
1547
1550
  }
1548
1551
 
1549
-
1550
-
1551
-
1552
- .video-js.skin_news .vjs-custom-control-spacer {
1553
- display: block;
1554
- flex: 1 1 auto;
1552
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1553
+ content: "NOT LIVE";
1554
+ word-spacing: -4px;
1555
1555
  }
1556
1556
 
1557
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1558
- margin: 0 0px 0 0px;
1559
- }
1560
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1561
- display: none;
1562
- }
1563
1557
 
1564
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1565
- font-size: 14px;
1566
- font-weight: 500;
1567
- align-self: center;
1568
- height: min-content;
1569
- padding: 5px 2px;
1570
- border-radius: 8px;
1571
- }
1558
+ @media(max-width:600px){
1559
+ .tvProviderImage{
1560
+ display: none
1561
+ }
1562
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1563
+ .icon-maximize {
1564
+ height: 30px !important;
1565
+ }
1572
1566
 
1573
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1574
- height: 6px !important;
1575
- }
1567
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1568
+ .icon-minimize {
1569
+ height: 30px !important;
1570
+ }
1571
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1572
+ width: 3.5em;
1573
+ }
1574
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1575
+ height: min-content;
1576
+ }
1576
1577
 
1577
- .video-js.skin_news .vjs-play-progress:before {
1578
- font-size: 1.5em;
1579
- line-height: unset;
1580
- top: -0.3333333333em;
1578
+ .video-js.skin_mini button.vjs-slowmo-button{
1579
+ display: none;
1580
+ }
1581
+ .video-js.skin_mini button.vjs-rewind-button{
1582
+ display: none;
1583
+ }
1584
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1585
+ height: 20px;
1586
+ }
1587
+ .video-js.skin_mini .vjs-button{
1588
+ width: 3em;
1589
+ }
1590
+ .video-js.skin_mini .widget-selection{
1591
+ display: none;
1592
+ }
1593
+ .video-js.skin_mini .container{
1594
+ display: none !important;
1595
+ }
1596
+ .video-js.skin_mini .vjs-control-bar{
1597
+ height: 4em !important;
1598
+ }
1599
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1600
+ font-size: 2.5em;
1601
+ line-height: 1.5;
1602
+ }
1603
+ .video-js.skin_mini .vjs-play-progress:before {
1604
+ font-size: 1.2em;
1605
+ position: absolute;
1606
+ right: -0.5em;
1607
+ z-index: 1;
1581
1608
  }
1582
-
1583
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1584
- display: none !important;
1609
+ .video-js.skin_mini button.vjs-skip-button>svg{
1610
+ height: 20px;
1585
1611
  }
1586
1612
 
1587
- /* */
1588
- .video-js.skin_news .vjs-mouse-display{
1589
- font-size: 1.6666666667em;
1613
+ .stream-selector-icon>svg{
1614
+ width: 24px;
1615
+ height: 24px;
1590
1616
  }
1591
-
1592
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1593
- font-size: 1em !important;
1617
+ .video-js.skin_mini .vjs-seek-to-live-text{
1618
+ font-size: 12px;
1594
1619
  }
1595
1620
 
1596
- .video-js.skin_news .vjs-button{
1597
- width: 5.3em;
1598
- display: flex;
1599
- align-items: center;
1600
- justify-content: center;
1621
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1622
+ color: white !important;
1623
+ font-size: 16px !important;
1624
+ background-color: rgba(0,0,0,0.2) !important;
1625
+ }
1601
1626
  }
1602
1627
 
1603
-
1604
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1605
- .icon-maximize {
1606
- display: block;
1607
- height: 32px;
1628
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1629
+ color: white !important;
1630
+ font-size: 16px !important;
1631
+ background-color: rgba(0,0,0,0.2) !important;
1608
1632
  }
1609
1633
 
1610
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1611
- line-height: 4;
1634
+ .video-js.skin_mini .vjs-text-track-display-ttml p {
1635
+ font-size: 18px !important;
1612
1636
  }
1613
1637
 
1614
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1615
- .icon-minimize {
1616
- display: none;
1617
- height: 32px;
1638
+ .video-js.skin_mini.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1639
+ margin-bottom: 1rem !important;
1618
1640
  }
1619
1641
 
1620
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1621
- outline: none !important;
1622
- }
1623
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1624
- .vjs-icon-fullscreen-enter:before {
1625
- /* content: '' !important; */
1626
- }
1627
1642
 
1628
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1643
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1629
1644
  display: flex;
1630
1645
  justify-content: center;
1631
1646
  align-items: center;
1632
- /* transform: rotate(90deg); */
1633
- }
1634
-
1635
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1636
- display: none;
1637
- }
1638
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1639
- margin-left: -10px;
1640
- }
1641
-
1642
- .video-js.skin_news .skipbtn:hover{
1643
- cursor: pointer;
1644
- }
1645
-
1646
- .video-js.skin_news .rewindbtn:hover{
1647
- cursor: pointer;
1648
- }
1649
-
1650
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1651
- position: relative;
1652
- padding-left: 0;
1653
- }
1654
-
1655
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1656
- display: none !important;
1657
- }
1658
-
1659
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1660
- width: 90px;
1661
- height: 90px;
1662
- display: flex;
1663
- justify-content: center;
1664
- align-items: center;
1665
- border-radius: 50%;
1666
- position: absolute;
1667
- top: 0;
1668
- left: 0;
1669
- right: 0;
1670
- bottom: 0;
1671
- margin: auto;
1672
- font-size: 6em;
1673
- line-height: 1.4em;
1674
- border: 0.05em solid;
1675
- color: inherit;
1676
- }
1677
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1678
- font-weight: bold;
1647
+ height: 100%;
1648
+ transition: width 0.1s;
1679
1649
  }
1680
-
1681
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1682
- bottom: 2.4em !important;
1683
- right: -1em;
1684
- z-index: 1;
1650
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1651
+ margin: 2px;
1685
1652
  }
1686
1653
 
1687
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1688
- width: 24px !important;
1689
- height: 24px !important;
1654
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1655
+ display: flex;
1656
+ justify-content: center;
1657
+ align-items: center;
1658
+ height: 100%;
1659
+ transition: width 0.1s;
1690
1660
  }
1691
- .settings-selector-icon>svg{
1692
- height: 19px !important;
1693
- width: 19px !important;
1661
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1662
+ display: grid;
1663
+ font-size: 10px;
1664
+ grid-template-columns: 1fr;
1665
+ grid-template-rows: 1fr;
1666
+ padding: 1px 0px 0 0px;
1667
+ margin: 0;
1694
1668
  }
1695
1669
 
1670
+ @media (max-width: 600px) {
1671
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1672
+ height: 5px !important;
1673
+ }
1696
1674
 
1697
- .video-js.skin_news button.vjs-rewind-button{
1698
- cursor: pointer;
1699
- }
1700
-
1701
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1702
- padding-right: 0;
1703
- }
1675
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1676
+ display: none;
1677
+ }
1704
1678
 
1705
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1706
- padding-left: 0;
1707
1679
  }
1708
1680
 
1709
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1710
- padding-left: 0;
1711
- padding-right: 0;
1712
- display: flex;
1713
- justify-content: center;
1714
- width: min-content;
1681
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1682
+ content: none !important;
1683
+ fill: none !important;
1684
+ filter: none !important;
1715
1685
  }
1716
1686
 
1717
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1718
- display: none
1719
- }
1720
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1721
- display: none
1687
+ /* svg icons opacity and hover effect */
1688
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1689
+ opacity: 0.7 !important;
1722
1690
  }
1723
1691
 
1724
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
1725
- display: flex;
1726
- align-items: center;
1727
- font-weight: 700;
1728
- font-size: 12px;
1729
- min-width: 1.2em;
1692
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1693
+ opacity: 1 !important;
1730
1694
  }
1731
1695
 
1732
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1733
- display: none;
1734
- font-size: 11px;
1735
- justify-content: center;
1736
- align-items: center;
1737
- user-select: none;
1738
- }
1739
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1740
- display: none;
1696
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1697
+ color: rgba(255, 255, 2555, 0.7)!important;
1741
1698
  }
1742
1699
 
1743
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1744
- height: min-content;
1745
- width: min-content;
1746
- }
1747
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1748
- width: 6em;
1700
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1701
+ color: rgba(255, 255, 2555, 1)!important;
1749
1702
  }
1750
1703
 
1751
- .video-js.skin_news .content{
1752
- bottom: 3.4rem !important;
1753
- right: -4rem !important;
1754
- }
1755
1704
 
1756
- .setting-icon > svg{
1757
- height:18px !important;
1705
+
1706
+ .video-js.skin_cn_news .vjs-control-bar {
1707
+ z-index: 1 !important;
1708
+ height: auto !important;
1709
+ padding: 0.8em 30px 0.6em;
1710
+ background: transparent !important;
1711
+ display: flex;
1712
+ flex-wrap: wrap;
1713
+ align-items: center;
1714
+ column-gap: 10px;
1758
1715
  }
1759
1716
 
1760
- .output-overlay{
1717
+
1718
+ .video-js.skin_cn_news .vjs-control-bar::before {
1719
+ content: '';
1761
1720
  position: absolute;
1721
+ left: 0;
1722
+ right: 0;
1762
1723
  bottom: 0;
1763
- height: 100%;
1764
- width: 100%;
1765
- z-index: 0;
1766
- border: 0;
1767
- pointer-events:none
1724
+ top: -3em;
1725
+ background: linear-gradient(
1726
+ to top,
1727
+ rgba(0, 0, 0, 0.85) 0%,
1728
+ rgba(0, 0, 0, 0.7) 40%,
1729
+ rgba(0, 0, 0, 0.55) 70%,
1730
+ rgba(0, 0, 0, 0.38) 86%,
1731
+ transparent 100%
1732
+ );
1733
+ pointer-events: none;
1734
+ z-index: -1;
1768
1735
  }
1769
1736
 
1770
- .video-js.skin_news iframe{
1771
- width: 100%;
1772
- height: 100%;
1737
+ .video-js.skin_cn_news .vjs-control-bar .vjs-progress-control {
1738
+ order: -1;
1739
+ flex: 0 0 100%;
1740
+ width: 80%;
1741
+ margin: 0 0 5em;
1742
+ position: relative;
1773
1743
  }
1774
1744
 
1775
- .video-js.skin_news .vjs-live-control{
1776
- align-items: center;
1745
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-control,
1746
+ .video-js.skin_cn_news .vjs-control-bar > .vjs-button {
1747
+ width: auto;
1748
+ min-width: 0;
1777
1749
  }
1778
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1779
- height: 2.2em;
1780
- display: flex;
1750
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
1751
+ display: inline-flex;
1781
1752
  align-items: center;
1782
- font-family: monospace;
1783
- width: 4em;
1784
1753
  justify-content: center;
1785
- background: red;
1786
- margin: 4px 0px 4px 12px;
1754
+ height: 7em;
1755
+ padding: 0 10px;
1756
+ color: #fff;
1787
1757
  }
1788
1758
 
1789
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1790
- text-shadow: none;
1791
- }
1792
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1793
- display: none;
1794
- font-size: 12px;
1759
+ .video-js.skin_cn_news .vjs-svg-icon::before {
1760
+ content: none !important;
1795
1761
  }
1796
1762
 
1797
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1798
- height: 2.2em;
1763
+
1764
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon {
1799
1765
  display: inline-flex;
1800
1766
  align-items: center;
1801
- /* font-family: monospace; */
1802
1767
  justify-content: center;
1803
- border: 2px solid;
1804
- margin: 4px 0px 4px 6px;
1805
- white-space: pre;
1806
- padding: 0px 6px;
1807
- font-size: 1.2em;
1808
- font-weight: 500;
1809
- color: rgba(255, 255, 2555, 0.7);
1810
-
1811
- letter-spacing: -.1px;
1812
- line-height: normal;
1813
- text-transform: uppercase;
1814
- color: #FFFFFF;
1815
- opacity: .7;
1816
- font-family: "Proxima Nova";
1817
1768
  }
1818
-
1819
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1820
- opacity: 1;
1769
+ .video-js.skin_cn_news .vjs-control-bar .vjs-svg-icon svg,
1770
+ .video-js.skin_cn_news .vjs-rewind-button svg {
1771
+ width: 24px;
1772
+ height: 24px;
1773
+ display: block;
1821
1774
  }
1822
1775
 
1823
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1824
- content: "NOT LIVE";
1825
- }
1826
1776
 
1827
- .settings-selection.vjs-control.vjs-button{
1828
- display: flex !important;
1829
- }
1830
1777
 
1831
- @media(max-width:576px){
1832
- .settings-selection.vjs-control.vjs-button{
1833
- display: none !important;
1834
- }
1778
+ .video-js.skin_cn_news .vjs-subs-caps-button {
1779
+ opacity: 1;
1835
1780
  }
1836
1781
 
1837
1782
 
1838
- @media(max-width:576px){
1839
- .tvProviderImage{
1840
- display: none
1841
- }
1842
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1843
- .icon-maximize {
1844
- height: 30px !important;
1845
- }
1846
-
1847
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1848
- .icon-minimize {
1849
- height: 30px !important;
1850
- }
1851
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1852
- width: 4.5em;
1853
- }
1854
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1855
- height: min-content;
1856
- }
1857
1783
 
1858
- .video-js.skin_news button.vjs-slowmo-button{
1859
- display: none;
1860
- }
1861
- .video-js.skin_news button.vjs-rewind-button{
1862
- display: none;
1863
- }
1864
- .video-js.skin_news button.vjs-rewind-button>svg{
1865
- height: 20px;
1866
- }
1867
- .video-js.skin_news .vjs-button{
1868
- width: 4.8em;
1869
- }
1870
- .video-js.skin_news .widget-selection{
1871
- display: none;
1872
- }
1873
- .video-js.skin_news .container{
1874
- display: none !important;
1875
- }
1876
- .video-js.skin_news .vjs-control-bar{
1877
- height: 4em !important;
1878
- }
1879
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1880
- font-size: 2.5em;
1881
- line-height: 1.5;
1882
- }
1883
- .video-js.skin_news .vjs-play-progress:before {
1884
- font-size: 1.2em;
1885
- position: absolute;
1886
- right: -0.5em;
1887
- z-index: 1;
1784
+ .video-js.skin_cn_news .vjs-volume-panel {
1785
+ margin: 0;
1786
+ display: inline-flex;
1787
+ align-items: center;
1788
+ align-self: center;
1789
+ height: 2.2em;
1790
+ min-width: 7em;
1791
+ transition: none;
1888
1792
  }
1889
- .video-js.skin_news button.vjs-skip-button>svg{
1890
- height: 20px;
1793
+ .video-js.skin_cn_news .vjs-volume-panel .vjs-volume-control.vjs-volume-horizontal {
1794
+ width: 0;
1795
+ height: 100%;
1796
+ display: flex;
1797
+ align-items: center;
1798
+ overflow: hidden;
1799
+ opacity: 0;
1800
+ transition: width 0.15s ease, opacity 0.15s ease;
1891
1801
  }
1892
- .video-js.skin_news button.vjs-big-play-button {
1893
- width: 50px !important;
1894
- height: 50px !important;
1895
- font-size: 2.1rem !important;
1802
+ .video-js.skin_cn_news .vjs-volume-panel:hover .vjs-volume-control.vjs-volume-horizontal,
1803
+ .video-js.skin_cn_news .vjs-volume-panel:active .vjs-volume-control.vjs-volume-horizontal,
1804
+ .video-js.skin_cn_news .vjs-volume-panel.vjs-hover .vjs-volume-control.vjs-volume-horizontal,
1805
+ .video-js.skin_cn_news .vjs-volume-panel:focus-within .vjs-volume-control.vjs-volume-horizontal {
1806
+ width: 5em;
1807
+ opacity: 1;
1896
1808
  }
1897
1809
 
1898
- .stream-selector-icon>svg{
1899
- width: 24px;
1900
- height: 24px;
1810
+ .video-js.skin_cn_news .vjs-volume-bar {
1811
+ width: 4em;
1812
+ height: 0.3em;
1813
+ margin: 0 0.45em;
1901
1814
  }
1902
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1903
- margin: 0 12px 0 12px;
1815
+
1816
+
1817
+ .video-js.skin_cn_news .vjs-volume-control .vjs-mouse-display {
1818
+ display: none !important;
1904
1819
  }
1905
- .video-js.skin_news .vjs-seek-to-live-text{
1906
- font-size: 12px;
1820
+
1821
+ .video-js.skin_cn_news .vjs-mute-control.vjs-vol-0 ~ .vjs-volume-control .vjs-volume-level {
1822
+ width: 0 !important;
1823
+ }
1824
+
1825
+
1826
+ .video-js.skin_cn_news .vjs-custom-control-spacer {
1827
+ display: block !important;
1828
+ flex: 1 1 auto;
1907
1829
  }
1908
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1909
- margin: 0 12px 0 12px;
1830
+
1831
+
1832
+ .video-js.skin_cn_news .vjs-big-play-button {
1833
+ display: none;
1910
1834
  }
1835
+ .video-js.skin_cn_news .vjs-big-play-button .vjs-icon-placeholder:before {
1836
+ position: relative !important;
1837
+ display: flex;
1838
+ left: 0;
1839
+ top: -1px;
1911
1840
  }
1912
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1913
- width: 90px;
1914
- height: 90px;
1841
+ .video-js.skin_cn_news.vjs-paused:not(.vjs-seeking):not(.vjs-ended) .vjs-big-play-button {
1915
1842
  display: flex;
1916
1843
  justify-content: center;
1917
1844
  align-items: center;
1918
- border-radius: 50%;
1919
1845
  position: absolute;
1920
1846
  top: 0;
1921
1847
  left: 0;
1922
1848
  right: 0;
1923
1849
  bottom: 0;
1924
1850
  margin: auto;
1925
- font-size: 6em;
1926
- line-height: 1.4em;
1851
+ width: 80px;
1852
+ height: 80px;
1853
+ border: none;
1854
+ border-radius: 50%;
1855
+ background: rgba(0, 0, 0, 0.55);
1856
+ font-size: 5em;
1857
+ line-height: 1.3em;
1858
+ transform: none !important;
1927
1859
  }
1928
1860
 
1929
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1930
- display: flex;
1931
- justify-content: center;
1932
- align-items: center;
1933
- height: 100%;
1934
- transition: width 0.1s;
1935
- }
1936
1861
 
1937
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1938
- display: flex;
1939
- justify-content: center;
1940
- align-items: center;
1941
- height: 100%;
1942
- transition: width 0.1s;
1862
+ .video-js.skin_cn_news .vjs-progress-control .vjs-progress-holder {
1863
+ height: 4px !important;
1864
+ margin: 0;
1865
+ border-radius: 20px;
1866
+ background-color: #393944;
1943
1867
  }
1944
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1945
- display: none !important;
1868
+
1869
+ .video-js.skin_cn_news .vjs-play-progress {
1870
+ background-color: #ffffff;
1871
+ border-radius: 20px;
1946
1872
  }
1947
- .video-js.skin_news .ssai-ad-container{
1948
- position: absolute;
1949
- bottom: 14px;
1873
+
1874
+ .video-js.skin_cn_news .vjs-load-progress,
1875
+ .video-js.skin_cn_news .vjs-load-progress div {
1876
+ background: rgba(255, 255, 255, 0.15);
1877
+ border-radius: 20px;
1950
1878
  }
1951
1879
 
1952
- @media (max-width: 576px) {
1953
- .video-js.skin_news .ssai-ad-container{
1954
- bottom: 2px;
1955
- }
1956
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1957
- height: 5px !important;
1958
- }
1959
- .video-js.skin_news button.vjs-big-play-button {
1960
- width: 50px !important;
1961
- height: 50px !important;
1962
- font-size: 2.1rem !important;
1963
- }
1964
1880
 
1965
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1966
- display: none;
1967
- }
1968
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1969
- bottom: 2.4em !important;
1970
- right: -1em;
1971
- z-index: 1;
1881
+ .video-js.skin_cn_news .vjs-play-progress:before {
1882
+ content: '';
1883
+ width: 16px;
1884
+ height: 16px;
1885
+ border-radius: 50%;
1886
+ background: #ffffff;
1887
+ border: 2px solid rgba(0, 0, 0, 0.6);
1888
+ box-sizing: border-box;
1889
+ box-shadow: 0 0 0 2px #ffffff, 0 0 3px rgba(0, 0, 0, 0.45);
1890
+ top: -6px;
1891
+ right: -8px;
1892
+ position: absolute;
1972
1893
  }
1973
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1974
- display: none !important;
1975
- }
1976
-
1977
- .video-js.skin_news .vjs-text-track-display-ttml span {
1978
- color: white;
1979
- font-size: 13px;
1980
- background-color: black;
1981
- }
1894
+ .video-js.skin_cn_news .vjs-play-progress .vjs-time-tooltip {
1895
+ display: none !important;
1982
1896
  }
1983
1897
 
1984
- .video-js.skin_news .vjs-text-track-display-ttml span {
1985
- color: white;
1986
- font-size: 16px;
1987
- background-color: black;
1898
+ .video-js.skin_cn_news .vjs-mouse-display .vjs-time-tooltip {
1899
+ background: #ffffff;
1900
+ color: #0a0e17;
1901
+ font-weight: 700;
1902
+ border-radius: 3px;
1988
1903
  }
1989
1904
 
1990
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1991
- margin-bottom: 2rem !important;
1905
+ .video-js.skin_cn_news .vjs-live-control {
1906
+ display: none !important;
1992
1907
  }
1993
-
1994
- .video-js.skin_news .vjs-text-track-display-ttml p {
1995
- font-size: 18px !important;
1908
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-control {
1909
+ display: inline-flex;
1910
+ align-items: center;
1911
+ align-self: center;
1912
+ height: 2.2em;
1913
+ gap: 5px;
1914
+ width: auto;
1915
+ padding: 0 10px;
1916
+ border: 1px solid rgba(255, 255, 255, 0.45);
1917
+ border-radius: 4px;
1918
+ cursor: pointer;
1996
1919
  }
1997
1920
 
1998
-
1999
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
2000
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
2001
- font-size: 1.2em !important;
2002
- line-height: 1.5em !important;
2003
- padding: 0.2em 0.8em !important;
1921
+ .video-js.skin_cn_news .vjs-seek-to-live-control .vjs-icon-placeholder {
1922
+ display: none;
1923
+ }
1924
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder {
1925
+ display: inline-flex;
1926
+ align-items: center;
1927
+ }
1928
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-icon-placeholder::before {
1929
+ content: '';
1930
+ display: inline-block;
1931
+ width: 8px;
1932
+ height: 8px;
1933
+ border-radius: 50%;
1934
+ background: #ff2d2d; /* red live dot */
1935
+ }
1936
+ .video-js.skin_cn_news .vjs-seek-to-live-text {
1937
+ color: #ffffff;
1938
+ font-weight: 700;
1939
+ font-size: 12px;
1940
+ letter-spacing: 0.03em;
2004
1941
  }
2005
1942
 
2006
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
2007
- content: none !important;
2008
- fill: none !important;
2009
- filter: none !important;
1943
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge {
1944
+ border-color: transparent;
1945
+ }
1946
+ .video-js.skin_cn_news .vjs-seek-to-live-control.vjs-at-live-edge .vjs-seek-to-live-text {
1947
+ color: #ff2d2d;
2010
1948
  }
2011
1949
 
2012
- /* svg icons opacity and hover effect */
2013
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
2014
- opacity: 0.7 !important;
1950
+ /* ---- time controls ---- */
1951
+ .video-js.skin_cn_news .vjs-current-time,
1952
+ .video-js.skin_cn_news .vjs-duration,
1953
+ .video-js.skin_cn_news .vjs-time-divider {
1954
+ display: none !important;
1955
+ }
1956
+ .video-js.skin_cn_news .vjs-remaining-time.vjs-time-control.vjs-control {
1957
+ display: none;
1958
+ align-items: center;
1959
+ justify-content: center;
1960
+ font-size: 11px;
1961
+ font-weight: 700;
1962
+ color: #fff;
1963
+ padding: 0 6px;
1964
+ user-select: none;
2015
1965
  }
2016
1966
 
2017
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
2018
- opacity: 1 !important;
1967
+
1968
+ .video-js.skin_cn_news .vjs-chapter-marker {
1969
+ z-index: 2;
1970
+ width: var(--vl-chapter-size, 8px);
1971
+ height: var(--vl-chapter-size, 8px);
1972
+ top: 50%;
1973
+ bottom: auto;
1974
+ background: var(--vl-chapter-color, #ffffff);
1975
+ opacity: var(--vl-chapter-opacity, 1);
1976
+ border-radius: 50%;
1977
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.6); /* keep white dots visible on the white bar */
1978
+ transform: translate(-50%, -50%) scale(1);
1979
+ transition: background-color 0.12s ease;
2019
1980
  }
2020
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
2021
- opacity: 0.7 !important;
1981
+ .video-js.skin_cn_news .vjs-chapter-marker:hover {
1982
+ background: var(--vl-chapter-hover, #0a5cff);
2022
1983
  }
2023
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
2024
- opacity: 1 !important;
1984
+ .video-js.skin_cn_news .vjs-chapter-marker.vjs-chapter-marker--active {
1985
+ background: var(--vl-chapter-active, #0a5cff);
2025
1986
  }
2026
1987
 
2027
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
2028
- color: rgba(255, 255, 2555, 0.7)!important;
2029
- }
2030
1988
 
2031
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
2032
- color: rgba(255, 255, 2555, 1)!important;
1989
+ .video-js.skin_cn_news .vjs-chapter-marker .vjs-chapter-marker__icon {
1990
+ width: 16px;
1991
+ height: 16px;
1992
+ bottom: 160%;
1993
+ filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.6));
2033
1994
  }
2034
1995
 
2035
1996
 
1997
+ .video-js.skin_cn_news .vjs-chapter-preview {
1998
+ background: var(--vl-chapter-tooltip, #0a5cff);
1999
+ border-radius: 6px;
2000
+ padding: 8px 10px;
2001
+ width: max-content;
2002
+ max-width: 300px;
2003
+ text-align: left;
2004
+ box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
2005
+ }
2006
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__time {
2007
+ color: #ffffff;
2008
+ font-size: 13px;
2009
+ font-weight: 400;
2010
+ margin-bottom: 2px;
2011
+ }
2012
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__label {
2013
+ color: #ffffff;
2014
+ font-size: 13px;
2015
+ font-weight: 400;
2016
+ line-height: 1.3;
2017
+ white-space: normal;
2018
+ text-align: left;
2019
+ }
2020
+ .video-js.skin_cn_news .vjs-chapter-preview .vjs-chapter-preview__pointer {
2021
+ border-top-color: var(--vl-chapter-tooltip, #0a5cff);
2022
+ }
2036
2023
 
2024
+ /* ---- responsive ---- */
2025
+ @media (max-width: 576px) {
2026
+ .video-js.skin_cn_news .vjs-control-bar {
2027
+ height: 3.2em !important;
2028
+ padding: 0 8px;
2029
+ }
2030
+ .video-js.skin_cn_news .vjs-control-bar .vjs-button {
2031
+ padding: 0 6px;
2032
+ }
2033
+ .video-js.skin_cn_news .vjs-control.vjs-button.vjs-picture-in-picture-control {
2034
+ display: none !important;
2035
+ }
2036
+ }
2037
2037
 
2038
2038
  /* CSS for videojs-dvr-seekbar */
2039
2039