@viewlift/player-backup 2.0.350-backup → 2.0.352-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 (3) hide show
  1. package/cjs/bundle.css +433 -433
  2. package/esm/bundle.css +433 -433
  3. package/package.json +28 -25
package/esm/bundle.css CHANGED
@@ -1,6 +1,8 @@
1
1
 
2
2
 
3
3
 
4
+
5
+
4
6
  .video-js.skin_vlone .vjs-control-bar .vjs-progress-control.vjs-control {
5
7
  height: 0.7em !important;
6
8
  position: absolute !important;
@@ -685,26 +687,31 @@
685
687
 
686
688
 
687
689
 
688
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
690
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
689
691
  font-size: 2.2em;
690
692
  line-height: 2.6;
691
693
  }
692
- .video-js.skin_mini{
693
- overflow: hidden;
694
+ .video-js.skin_news .vjs-custom-big-mute.vjs-control{
695
+ background: white;
694
696
  }
695
- .video-js.skin_mini .vjs-control-bar{
697
+ .video-js.skin_news .vjs-control-bar{
696
698
  z-index: 1 !important;
697
- height: 4em !important;
699
+ height: 5em !important;
698
700
  background: black !important;
699
701
  }
702
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
703
+ display: flex;
704
+ align-items: center;
705
+ justify-content: center;
706
+ }
700
707
 
701
- .video-js.skin_mini .vjs-fade>* {
708
+ .video-js.skin_news .vjs-fade>* {
702
709
  visibility: hidden !important;
703
710
  opacity: 0 !important;
704
711
  transition: visibility 1s, opacity 1s !important;
705
712
  }
706
713
 
707
- .video-js.skin_mini .custom-spaced-progress-bar {
714
+ .video-js.skin_news .custom-spaced-progress-bar {
708
715
  position: absolute;
709
716
  width: 100%;
710
717
  display: flex;
@@ -712,7 +719,7 @@
712
719
  top: -0.5em;
713
720
  }
714
721
 
715
- .video-js.skin_mini .vjs-progress-control {
722
+ .video-js.skin_news .vjs-progress-control {
716
723
  /* left: -6px; */
717
724
  position: relative;
718
725
  width: 100%;
@@ -723,19 +730,19 @@
723
730
 
724
731
 
725
732
 
726
- .video-js.skin_mini .vjs-custom-control-spacer {
733
+ .video-js.skin_news .vjs-custom-control-spacer {
727
734
  display: block;
728
735
  flex: 1 1 auto;
729
736
  }
730
737
 
731
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
738
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
732
739
  margin: 0 0px 0 0px;
733
740
  }
734
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
741
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
735
742
  display: none;
736
743
  }
737
744
 
738
- .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
745
+ .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
739
746
  font-size: 14px;
740
747
  font-weight: 500;
741
748
  align-self: center;
@@ -744,158 +751,143 @@
744
751
  border-radius: 8px;
745
752
  }
746
753
 
747
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
748
- height: 5px !important;
754
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
755
+ height: 6px !important;
749
756
  }
750
757
 
751
- .video-js.skin_mini .vjs-play-progress:before {
752
- font-size: 1.3em;
758
+ .video-js.skin_news .vjs-play-progress:before {
759
+ font-size: 1.5em;
753
760
  line-height: unset;
754
761
  top: -0.3333333333em;
755
762
  }
756
763
 
757
- .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
764
+ .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
758
765
  display: none !important;
759
766
  }
760
767
 
761
768
  /* */
762
- .video-js.skin_mini .vjs-mouse-display{
769
+ .video-js.skin_news .vjs-mouse-display{
763
770
  font-size: 1.6666666667em;
764
771
  }
765
772
 
766
- .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
773
+ .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
767
774
  font-size: 1em !important;
768
775
  }
769
776
 
770
- .video-js.skin_mini .vjs-button{
771
- width: 3em;
777
+ .video-js.skin_news .vjs-button{
778
+ width: 5.3em;
772
779
  display: flex;
773
780
  align-items: center;
774
781
  justify-content: center;
775
782
  }
776
783
 
777
784
 
778
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
785
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
779
786
  .icon-maximize {
780
787
  display: block;
781
788
  height: 32px;
782
789
  }
783
790
 
784
- .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
791
+ .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
785
792
  line-height: 4;
786
793
  }
787
794
 
788
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
795
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
789
796
  .icon-minimize {
790
797
  display: none;
791
798
  height: 32px;
792
799
  }
793
800
 
794
- .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
801
+ .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
795
802
  outline: none !important;
796
803
  }
797
- .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
804
+ .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
798
805
  .vjs-icon-fullscreen-enter:before {
799
806
  /* content: '' !important; */
800
807
  }
801
808
 
802
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
809
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
803
810
  display: flex;
804
811
  justify-content: center;
805
812
  align-items: center;
806
813
  /* transform: rotate(90deg); */
807
814
  }
808
815
 
809
- .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
816
+ .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
810
817
  display: none;
811
818
  }
812
- .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
819
+ .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
813
820
  margin-left: -10px;
814
- display: none;
815
- }
816
-
817
- .video-js.skin_mini .vjs-loading-spinner {
818
- position: absolute;
819
- top: 50%;
820
- left: 50%;
821
- transform: translate(-50%, -50%);
822
- opacity: .85;
823
- text-align: left;
824
- border: .2em solid rgba(43, 51, 63, .7);
825
- box-sizing: border-box;
826
- background-clip: padding-box;
827
- width: 3em;
828
- height: 3em;
829
- border-radius: 50%;
830
- visibility: hidden;
831
821
  }
832
822
 
833
- .video-js.skin_mini .skipbtn:hover{
823
+ .video-js.skin_news .skipbtn:hover{
834
824
  cursor: pointer;
835
825
  }
836
826
 
837
- .video-js.skin_mini .rewindbtn:hover{
827
+ .video-js.skin_news .rewindbtn:hover{
838
828
  cursor: pointer;
839
829
  }
840
830
 
841
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
831
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
842
832
  position: relative;
843
833
  padding-left: 0;
844
834
  }
845
835
 
846
- .video-js.skin_mini.vjs-paused .vjs-big-play-button {
847
- width: 40px;
848
- height: 40px;
849
- display: flex;
850
- justify-content: center;
851
- align-items: center;
852
- border: none;
853
- position: absolute;
854
- top: 0;
855
- left: 0;
856
- right: 0;
857
- bottom: 0;
858
- margin: auto;
859
- font-size: 3em;
860
- line-height: 1.3em;
861
- transform: none !important;
862
- border-radius: 1.3em;
836
+ .video-js.skin_news.vjs-seeking .vjs-big-play-button{
837
+ display: none !important;
863
838
  }
864
839
 
865
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
840
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
841
+ width: 90px;
842
+ height: 90px;
843
+ display: flex;
844
+ justify-content: center;
845
+ align-items: center;
846
+ border-radius: 50%;
847
+ position: absolute;
848
+ top: 0;
849
+ left: 0;
850
+ right: 0;
851
+ bottom: 0;
852
+ margin: auto;
853
+ font-size: 6em;
854
+ line-height: 1.4em;
855
+ border: 0.05em solid;
856
+ color: inherit;
857
+ }
858
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
866
859
  font-weight: bold;
867
860
  }
868
861
 
869
- .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
870
- bottom: 1.1em !important;
871
- right: 1em;
862
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
863
+ bottom: 2.4em !important;
864
+ right: -1em;
872
865
  z-index: 1;
873
- font-size: 10px;
874
866
  }
875
867
 
876
- .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
868
+ .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
877
869
  width: 24px !important;
878
870
  height: 24px !important;
879
871
  }
880
- .video-js.skin_mini .settings-selector-icon>svg{
872
+ .settings-selector-icon>svg{
881
873
  height: 19px !important;
882
874
  width: 19px !important;
883
875
  }
884
876
 
885
877
 
886
- .video-js.skin_mini button.vjs-rewind-button{
878
+ .video-js.skin_news button.vjs-rewind-button{
887
879
  cursor: pointer;
888
880
  }
889
881
 
890
- .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
882
+ .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
891
883
  padding-right: 0;
892
884
  }
893
885
 
894
- .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
886
+ .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
895
887
  padding-left: 0;
896
888
  }
897
889
 
898
- .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
890
+ .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
899
891
  padding-left: 0;
900
892
  padding-right: 0;
901
893
  display: flex;
@@ -903,48 +895,46 @@
903
895
  width: min-content;
904
896
  }
905
897
 
906
- .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
898
+ .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
907
899
  display: none
908
900
  }
909
- .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
901
+ .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
910
902
  display: none
911
903
  }
912
904
 
913
- .video-js.skin_mini .vjs-control-bar .vjs-time-control {
914
- display: flex;
915
- align-items: center;
916
- font-weight: 700;
917
- font-size: 9px;
918
- min-width: 0.8em;
919
- padding-left: 0;
905
+ .video-js.skin_news .vjs-control-bar .vjs-time-control {
906
+ display: flex;
907
+ align-items: center;
908
+ font-weight: 700;
909
+ font-size: 12px;
910
+ min-width: 1.2em;
920
911
  }
921
912
 
922
- .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
913
+ .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
923
914
  display: none;
924
915
  font-size: 11px;
925
916
  justify-content: center;
926
917
  align-items: center;
927
918
  user-select: none;
928
919
  }
929
- .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
920
+ .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
930
921
  display: none;
931
922
  }
932
923
 
933
- .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
924
+ .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
934
925
  height: min-content;
935
926
  width: min-content;
936
927
  }
937
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
938
- width: 3em;
939
- margin-right: 4px;
928
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
929
+ width: 6em;
940
930
  }
941
931
 
942
- .video-js.skin_mini .content{
932
+ .video-js.skin_news .content{
943
933
  bottom: 3.4rem !important;
944
934
  right: -4rem !important;
945
935
  }
946
936
 
947
- .video-js.skin_mini .setting-icon > svg{
937
+ .setting-icon > svg{
948
938
  height:18px !important;
949
939
  }
950
940
 
@@ -958,16 +948,15 @@
958
948
  pointer-events:none
959
949
  }
960
950
 
961
- .video-js.skin_mini iframe{
951
+ .video-js.skin_news iframe{
962
952
  width: 100%;
963
953
  height: 100%;
964
954
  }
965
955
 
966
- .video-js.skin_mini .vjs-live-control{
956
+ .video-js.skin_news .vjs-live-control{
967
957
  align-items: center;
968
- max-width: 5em;
969
958
  }
970
- .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
959
+ .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
971
960
  height: 2.2em;
972
961
  display: flex;
973
962
  align-items: center;
@@ -975,214 +964,277 @@
975
964
  width: 4em;
976
965
  justify-content: center;
977
966
  background: red;
978
- margin: 4px 0px 4px 2px;
967
+ margin: 4px 0px 4px 12px;
979
968
  }
980
969
 
981
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
970
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
982
971
  text-shadow: none;
983
972
  }
984
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
973
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
985
974
  display: none;
986
975
  font-size: 12px;
987
976
  }
988
977
 
989
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
990
- height: 1.8em;
978
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
979
+ height: 2.2em;
991
980
  display: inline-flex;
992
981
  align-items: center;
993
- font-family: monospace;
982
+ /* font-family: monospace; */
994
983
  justify-content: center;
995
- border: 1.5px solid;
996
- margin: 4px 0px 4px 2px;
984
+ border: 2px solid;
985
+ margin: 4px 0px 4px 6px;
997
986
  white-space: pre;
998
- padding: 2px 4px;
987
+ padding: 0px 6px;
999
988
  font-size: 1.2em;
1000
989
  font-weight: 500;
1001
990
  color: rgba(255, 255, 2555, 0.7);
991
+
992
+ letter-spacing: -.1px;
993
+ line-height: normal;
994
+ text-transform: uppercase;
995
+ color: #FFFFFF;
996
+ opacity: .7;
997
+ font-family: "Proxima Nova";
1002
998
  }
1003
999
 
1004
- .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1000
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1001
+ opacity: 1;
1002
+ }
1003
+
1004
+ .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1005
1005
  content: "NOT LIVE";
1006
- word-spacing: -4px;
1007
1006
  }
1008
1007
 
1008
+ .settings-selection.vjs-control.vjs-button{
1009
+ display: flex !important;
1010
+ }
1009
1011
 
1010
- @media(max-width:600px){
1012
+ @media(max-width:576px){
1013
+ .settings-selection.vjs-control.vjs-button{
1014
+ display: none !important;
1015
+ }
1016
+ }
1017
+
1018
+
1019
+ @media(max-width:576px){
1011
1020
  .tvProviderImage{
1012
1021
  display: none
1013
1022
  }
1014
- .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1023
+ .video-js.skin_news .vjs-fullscreen .icon-minimize,
1015
1024
  .icon-maximize {
1016
1025
  height: 30px !important;
1017
1026
  }
1018
1027
 
1019
- .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1028
+ .video-js.skin_news .vjs-fullscreen .icon-maximize,
1020
1029
  .icon-minimize {
1021
1030
  height: 30px !important;
1022
1031
  }
1023
- .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1024
- width: 3.5em;
1032
+ .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1033
+ width: 4.5em;
1025
1034
  }
1026
- .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1035
+ .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1027
1036
  height: min-content;
1028
1037
  }
1029
1038
 
1030
- .video-js.skin_mini button.vjs-slowmo-button{
1039
+ .video-js.skin_news button.vjs-slowmo-button{
1031
1040
  display: none;
1032
1041
  }
1033
- .video-js.skin_mini button.vjs-rewind-button{
1042
+ .video-js.skin_news button.vjs-rewind-button{
1034
1043
  display: none;
1035
1044
  }
1036
- .video-js.skin_mini button.vjs-rewind-button>svg{
1045
+ .video-js.skin_news button.vjs-rewind-button>svg{
1037
1046
  height: 20px;
1038
1047
  }
1039
- .video-js.skin_mini .vjs-button{
1040
- width: 3em;
1048
+ .video-js.skin_news .vjs-button{
1049
+ width: 4.8em;
1041
1050
  }
1042
- .video-js.skin_mini .widget-selection{
1051
+ .video-js.skin_news .widget-selection{
1043
1052
  display: none;
1044
1053
  }
1045
- .video-js.skin_mini .container{
1054
+ .video-js.skin_news .container{
1046
1055
  display: none !important;
1047
1056
  }
1048
- .video-js.skin_mini .vjs-control-bar{
1057
+ .video-js.skin_news .vjs-control-bar{
1049
1058
  height: 4em !important;
1050
1059
  }
1051
- .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1060
+ .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1052
1061
  font-size: 2.5em;
1053
1062
  line-height: 1.5;
1054
1063
  }
1055
- .video-js.skin_mini .vjs-play-progress:before {
1064
+ .video-js.skin_news .vjs-play-progress:before {
1056
1065
  font-size: 1.2em;
1057
1066
  position: absolute;
1058
1067
  right: -0.5em;
1059
1068
  z-index: 1;
1060
1069
  }
1061
- .video-js.skin_mini button.vjs-skip-button>svg{
1070
+ .video-js.skin_news button.vjs-skip-button>svg{
1062
1071
  height: 20px;
1063
1072
  }
1073
+ .video-js.skin_news button.vjs-big-play-button {
1074
+ width: 50px !important;
1075
+ height: 50px !important;
1076
+ font-size: 2.1rem !important;
1077
+ }
1064
1078
 
1065
1079
  .stream-selector-icon>svg{
1066
1080
  width: 24px;
1067
1081
  height: 24px;
1068
1082
  }
1069
- .video-js.skin_mini .vjs-seek-to-live-text{
1083
+ .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1084
+ margin: 0 12px 0 12px;
1085
+ }
1086
+ .video-js.skin_news .vjs-seek-to-live-text{
1070
1087
  font-size: 12px;
1071
1088
  }
1089
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1090
+ margin: 0 12px 0 12px;
1072
1091
  }
1073
-
1074
-
1075
- .video-js.skin_mini .vjs-text-track-display-ttml span {
1076
- background-color: rgba(0, 0, 0, 0.2);
1092
+ }
1093
+ .video-js.skin_news.vjs-paused .vjs-big-play-button {
1094
+ width: 90px;
1095
+ height: 90px;
1096
+ display: flex;
1097
+ justify-content: center;
1098
+ align-items: center;
1099
+ border-radius: 50%;
1100
+ position: absolute;
1101
+ top: 0;
1102
+ left: 0;
1103
+ right: 0;
1104
+ bottom: 0;
1105
+ margin: auto;
1106
+ font-size: 6em;
1107
+ line-height: 1.4em;
1077
1108
  }
1078
1109
 
1079
-
1080
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1110
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1081
1111
  display: flex;
1082
1112
  justify-content: center;
1083
1113
  align-items: center;
1084
1114
  height: 100%;
1085
1115
  transition: width 0.1s;
1086
1116
  }
1087
- .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1088
- margin: 2px;
1089
- }
1090
1117
 
1091
- .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1118
+ .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1092
1119
  display: flex;
1093
1120
  justify-content: center;
1094
1121
  align-items: center;
1095
1122
  height: 100%;
1096
1123
  transition: width 0.1s;
1097
1124
  }
1098
-
1099
- .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1100
- display: block;
1101
- font-size: 10px;
1102
- padding: 6px 10px;
1103
- margin: 0;
1104
- max-height: 100%;
1105
- overflow-y: auto;
1106
- }
1107
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
1108
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
1109
- .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
1110
- display: block;
1111
- width: 100%;
1112
- }
1113
- .video-js.skin_mini .vjs-text-track-settings fieldset{
1114
- margin: 4px 0;
1115
- }
1116
- .video-js.skin_mini .vjs-text-track-settings fieldset span{
1117
- display: block;
1118
- padding: 0 0 6px;
1125
+ .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1126
+ display: none !important;
1119
1127
  }
1120
- .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
1121
- max-width: 100%;
1128
+ .video-js.skin_news .ssai-ad-container{
1129
+ position: absolute;
1130
+ bottom: 14px;
1122
1131
  }
1123
1132
 
1124
- @media (max-width: 600px) {
1125
- .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1133
+ @media (max-width: 576px) {
1134
+ .video-js.skin_news .ssai-ad-container{
1135
+ bottom: 2px;
1136
+ }
1137
+ .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1126
1138
  height: 5px !important;
1127
1139
  }
1140
+ .video-js.skin_news button.vjs-big-play-button {
1141
+ width: 50px !important;
1142
+ height: 50px !important;
1143
+ font-size: 2.1rem !important;
1144
+ }
1128
1145
 
1129
- .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1146
+ .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1130
1147
  display: none;
1131
1148
  }
1149
+ .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1150
+ bottom: 2.4em !important;
1151
+ right: -1em;
1152
+ z-index: 1;
1153
+ }
1154
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1155
+ display: none !important;
1156
+ }
1157
+
1158
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1159
+ color: white;
1160
+ font-size: 13px;
1161
+ background-color: black;
1162
+ }
1163
+ }
1132
1164
 
1165
+ .video-js.skin_news .vjs-text-track-display-ttml span {
1166
+ color: white;
1167
+ font-size: 16px;
1168
+ background-color: black;
1133
1169
  }
1134
1170
 
1135
- .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1171
+ .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1172
+ margin-bottom: 2rem !important;
1173
+ }
1174
+
1175
+ .video-js.skin_news .vjs-text-track-display-ttml p {
1176
+ font-size: 18px !important;
1177
+ }
1178
+
1179
+
1180
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1181
+ .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1182
+ font-size: 1.2em !important;
1183
+ line-height: 1.5em !important;
1184
+ padding: 0.2em 0.8em !important;
1185
+ }
1186
+
1187
+ .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1136
1188
  content: none !important;
1137
1189
  fill: none !important;
1138
1190
  filter: none !important;
1139
1191
  }
1140
1192
 
1141
1193
  /* svg icons opacity and hover effect */
1142
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1194
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1143
1195
  opacity: 0.7 !important;
1144
1196
  }
1145
1197
 
1146
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1198
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1199
+ opacity: 1 !important;
1200
+ }
1201
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1202
+ opacity: 0.7 !important;
1203
+ }
1204
+ .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1147
1205
  opacity: 1 !important;
1148
1206
  }
1149
1207
 
1150
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1208
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1151
1209
  color: rgba(255, 255, 2555, 0.7)!important;
1152
1210
  }
1153
1211
 
1154
- .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1212
+ .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1155
1213
  color: rgba(255, 255, 2555, 1)!important;
1156
1214
  }
1157
1215
 
1158
1216
 
1159
1217
 
1160
-
1161
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before {
1218
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before {
1162
1219
  font-size: 2.2em;
1163
1220
  line-height: 2.6;
1164
1221
  }
1165
- .video-js.skin_news .vjs-custom-big-mute.vjs-control{
1166
- background: white;
1222
+ .video-js.skin_mini{
1223
+ overflow: hidden;
1167
1224
  }
1168
- .video-js.skin_news .vjs-control-bar{
1225
+ .video-js.skin_mini .vjs-control-bar{
1169
1226
  z-index: 1 !important;
1170
- height: 5em !important;
1227
+ height: 4em !important;
1171
1228
  background: black !important;
1172
1229
  }
1173
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1174
- display: flex;
1175
- align-items: center;
1176
- justify-content: center;
1177
- }
1178
1230
 
1179
- .video-js.skin_news .vjs-fade>* {
1231
+ .video-js.skin_mini .vjs-fade>* {
1180
1232
  visibility: hidden !important;
1181
1233
  opacity: 0 !important;
1182
1234
  transition: visibility 1s, opacity 1s !important;
1183
1235
  }
1184
1236
 
1185
- .video-js.skin_news .custom-spaced-progress-bar {
1237
+ .video-js.skin_mini .custom-spaced-progress-bar {
1186
1238
  position: absolute;
1187
1239
  width: 100%;
1188
1240
  display: flex;
@@ -1190,7 +1242,7 @@
1190
1242
  top: -0.5em;
1191
1243
  }
1192
1244
 
1193
- .video-js.skin_news .vjs-progress-control {
1245
+ .video-js.skin_mini .vjs-progress-control {
1194
1246
  /* left: -6px; */
1195
1247
  position: relative;
1196
1248
  width: 100%;
@@ -1201,19 +1253,19 @@
1201
1253
 
1202
1254
 
1203
1255
 
1204
- .video-js.skin_news .vjs-custom-control-spacer {
1256
+ .video-js.skin_mini .vjs-custom-control-spacer {
1205
1257
  display: block;
1206
1258
  flex: 1 1 auto;
1207
1259
  }
1208
1260
 
1209
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1261
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder {
1210
1262
  margin: 0 0px 0 0px;
1211
1263
  }
1212
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control{
1264
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control{
1213
1265
  display: none;
1214
1266
  }
1215
1267
 
1216
- .video-js.skin_news button.vjs-control.vjs-button.vjs-slowmo-button {
1268
+ .video-js.skin_mini button.vjs-control.vjs-button.vjs-slowmo-button {
1217
1269
  font-size: 14px;
1218
1270
  font-weight: 500;
1219
1271
  align-self: center;
@@ -1222,143 +1274,158 @@
1222
1274
  border-radius: 8px;
1223
1275
  }
1224
1276
 
1225
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1226
- height: 6px !important;
1277
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1278
+ height: 5px !important;
1227
1279
  }
1228
1280
 
1229
- .video-js.skin_news .vjs-play-progress:before {
1230
- font-size: 1.5em;
1281
+ .video-js.skin_mini .vjs-play-progress:before {
1282
+ font-size: 1.3em;
1231
1283
  line-height: unset;
1232
1284
  top: -0.3333333333em;
1233
1285
  }
1234
1286
 
1235
- .video-js.skin_news .vjs-play-progress .vjs-time-tooltip {
1287
+ .video-js.skin_mini .vjs-play-progress .vjs-time-tooltip {
1236
1288
  display: none !important;
1237
1289
  }
1238
1290
 
1239
1291
  /* */
1240
- .video-js.skin_news .vjs-mouse-display{
1292
+ .video-js.skin_mini .vjs-mouse-display{
1241
1293
  font-size: 1.6666666667em;
1242
1294
  }
1243
1295
 
1244
- .video-js.skin_news .vjs-progress-control:hover .vjs-progress-holder {
1296
+ .video-js.skin_mini .vjs-progress-control:hover .vjs-progress-holder {
1245
1297
  font-size: 1em !important;
1246
1298
  }
1247
1299
 
1248
- .video-js.skin_news .vjs-button{
1249
- width: 5.3em;
1300
+ .video-js.skin_mini .vjs-button{
1301
+ width: 3em;
1250
1302
  display: flex;
1251
1303
  align-items: center;
1252
1304
  justify-content: center;
1253
1305
  }
1254
1306
 
1255
1307
 
1256
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1308
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1257
1309
  .icon-maximize {
1258
1310
  display: block;
1259
1311
  height: 32px;
1260
1312
  }
1261
1313
 
1262
- .video-js.skin_news .vjs-playback-rate .vjs-playback-rate-value{
1314
+ .video-js.skin_mini .vjs-playback-rate .vjs-playback-rate-value{
1263
1315
  line-height: 4;
1264
1316
  }
1265
1317
 
1266
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1318
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1267
1319
  .icon-minimize {
1268
1320
  display: none;
1269
1321
  height: 32px;
1270
1322
  }
1271
1323
 
1272
- .video-js.skin_news button.vjs-play-control.vjs-control.vjs-button{
1324
+ .video-js.skin_mini button.vjs-play-control.vjs-control.vjs-button{
1273
1325
  outline: none !important;
1274
1326
  }
1275
- .video-js.skin_news .vjs-fullscreen-control .vjs-icon-placeholder:before,
1327
+ .video-js.skin_mini .vjs-fullscreen-control .vjs-icon-placeholder:before,
1276
1328
  .vjs-icon-fullscreen-enter:before {
1277
1329
  /* content: '' !important; */
1278
1330
  }
1279
1331
 
1280
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button {
1332
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button {
1281
1333
  display: flex;
1282
1334
  justify-content: center;
1283
1335
  align-items: center;
1284
1336
  /* transform: rotate(90deg); */
1285
1337
  }
1286
1338
 
1287
- .video-js.skin_news .vjs-subs-caps-button .vjs-icon-placeholder:before{
1339
+ .video-js.skin_mini .vjs-subs-caps-button .vjs-icon-placeholder:before{
1288
1340
  display: none;
1289
1341
  }
1290
- .video-js.skin_news .vjs-volume-panel .vjs-volume-control{
1342
+ .video-js.skin_mini .vjs-volume-panel .vjs-volume-control{
1291
1343
  margin-left: -10px;
1344
+ display: none;
1292
1345
  }
1293
1346
 
1294
- .video-js.skin_news .skipbtn:hover{
1347
+ .video-js.skin_mini .vjs-loading-spinner {
1348
+ position: absolute;
1349
+ top: 50%;
1350
+ left: 50%;
1351
+ transform: translate(-50%, -50%);
1352
+ opacity: .85;
1353
+ text-align: left;
1354
+ border: .2em solid rgba(43, 51, 63, .7);
1355
+ box-sizing: border-box;
1356
+ background-clip: padding-box;
1357
+ width: 3em;
1358
+ height: 3em;
1359
+ border-radius: 50%;
1360
+ visibility: hidden;
1361
+ }
1362
+
1363
+ .video-js.skin_mini .skipbtn:hover{
1295
1364
  cursor: pointer;
1296
1365
  }
1297
1366
 
1298
- .video-js.skin_news .rewindbtn:hover{
1367
+ .video-js.skin_mini .rewindbtn:hover{
1299
1368
  cursor: pointer;
1300
1369
  }
1301
1370
 
1302
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control{
1371
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control{
1303
1372
  position: relative;
1304
1373
  padding-left: 0;
1305
1374
  }
1306
1375
 
1307
- .video-js.skin_news.vjs-seeking .vjs-big-play-button{
1308
- display: none !important;
1376
+ .video-js.skin_mini.vjs-paused .vjs-big-play-button {
1377
+ width: 40px;
1378
+ height: 40px;
1379
+ display: flex;
1380
+ justify-content: center;
1381
+ align-items: center;
1382
+ border: none;
1383
+ position: absolute;
1384
+ top: 0;
1385
+ left: 0;
1386
+ right: 0;
1387
+ bottom: 0;
1388
+ margin: auto;
1389
+ font-size: 3em;
1390
+ line-height: 1.3em;
1391
+ transform: none !important;
1392
+ border-radius: 1.3em;
1309
1393
  }
1310
1394
 
1311
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1312
- width: 90px;
1313
- height: 90px;
1314
- display: flex;
1315
- justify-content: center;
1316
- align-items: center;
1317
- border-radius: 50%;
1318
- position: absolute;
1319
- top: 0;
1320
- left: 0;
1321
- right: 0;
1322
- bottom: 0;
1323
- margin: auto;
1324
- font-size: 6em;
1325
- line-height: 1.4em;
1326
- border: 0.05em solid;
1327
- color: inherit;
1328
- }
1329
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1395
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control.vjs-at-live-edge{
1330
1396
  font-weight: bold;
1331
1397
  }
1332
1398
 
1333
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content{
1334
- bottom: 2.4em !important;
1335
- right: -1em;
1399
+ .video-js.skin_mini .vjs-menu > ul.vjs-menu-content{
1400
+ bottom: 1.1em !important;
1401
+ right: 1em;
1336
1402
  z-index: 1;
1403
+ font-size: 10px;
1337
1404
  }
1338
1405
 
1339
- .video-js.skin_news .vjs-chromecast-button .vjs-icon-placeholder {
1406
+ .video-js.skin_mini .vjs-chromecast-button .vjs-icon-placeholder {
1340
1407
  width: 24px !important;
1341
1408
  height: 24px !important;
1342
1409
  }
1343
- .settings-selector-icon>svg{
1410
+ .video-js.skin_mini .settings-selector-icon>svg{
1344
1411
  height: 19px !important;
1345
1412
  width: 19px !important;
1346
1413
  }
1347
1414
 
1348
1415
 
1349
- .video-js.skin_news button.vjs-rewind-button{
1416
+ .video-js.skin_mini button.vjs-rewind-button{
1350
1417
  cursor: pointer;
1351
1418
  }
1352
1419
 
1353
- .video-js.skin_news .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1420
+ .video-js.skin_mini .vjs-control-bar .vjs-current-time.vjs-time-control.vjs-control {
1354
1421
  padding-right: 0;
1355
1422
  }
1356
1423
 
1357
- .video-js.skin_news .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1424
+ .video-js.skin_mini .vjs-control-bar .vjs-duration.vjs-time-control.vjs-control {
1358
1425
  padding-left: 0;
1359
1426
  }
1360
1427
 
1361
- .video-js.skin_news .vjs-control-bar .vjs-time-control.vjs-time-divider {
1428
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control.vjs-time-divider {
1362
1429
  padding-left: 0;
1363
1430
  padding-right: 0;
1364
1431
  display: flex;
@@ -1366,46 +1433,48 @@
1366
1433
  width: min-content;
1367
1434
  }
1368
1435
 
1369
- .video-js.skin_news.vjs-live .vjs-control-bar .vjs-time-control {
1436
+ .video-js.skin_mini.vjs-live .vjs-control-bar .vjs-time-control {
1370
1437
  display: none
1371
1438
  }
1372
- .video-js.skin_news.vjs-liveui .vjs-control-bar .vjs-time-control {
1439
+ .video-js.skin_mini.vjs-liveui .vjs-control-bar .vjs-time-control {
1373
1440
  display: none
1374
1441
  }
1375
1442
 
1376
- .video-js.skin_news .vjs-control-bar .vjs-time-control {
1377
- display: flex;
1378
- align-items: center;
1379
- font-weight: 700;
1380
- font-size: 12px;
1381
- min-width: 1.2em;
1443
+ .video-js.skin_mini .vjs-control-bar .vjs-time-control {
1444
+ display: flex;
1445
+ align-items: center;
1446
+ font-weight: 700;
1447
+ font-size: 9px;
1448
+ min-width: 0.8em;
1449
+ padding-left: 0;
1382
1450
  }
1383
1451
 
1384
- .video-js.skin_news .vjs-remaining-time.vjs-time-control.vjs-control {
1452
+ .video-js.skin_mini .vjs-remaining-time.vjs-time-control.vjs-control {
1385
1453
  display: none;
1386
1454
  font-size: 11px;
1387
1455
  justify-content: center;
1388
1456
  align-items: center;
1389
1457
  user-select: none;
1390
1458
  }
1391
- .video-js.skin_news.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1459
+ .video-js.skin_mini.vjs-live .vjs-remaining-time.vjs-time-control.vjs-control{
1392
1460
  display: none;
1393
1461
  }
1394
1462
 
1395
- .video-js.skin_news button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1463
+ .video-js.skin_mini button.vjs-subs-caps-button.vjs-menu-button.vjs-menu-button-popup.vjs-button{
1396
1464
  height: min-content;
1397
1465
  width: min-content;
1398
1466
  }
1399
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1400
- width: 6em;
1467
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1468
+ width: 3em;
1469
+ margin-right: 4px;
1401
1470
  }
1402
1471
 
1403
- .video-js.skin_news .content{
1472
+ .video-js.skin_mini .content{
1404
1473
  bottom: 3.4rem !important;
1405
1474
  right: -4rem !important;
1406
1475
  }
1407
1476
 
1408
- .setting-icon > svg{
1477
+ .video-js.skin_mini .setting-icon > svg{
1409
1478
  height:18px !important;
1410
1479
  }
1411
1480
 
@@ -1419,15 +1488,16 @@
1419
1488
  pointer-events:none
1420
1489
  }
1421
1490
 
1422
- .video-js.skin_news iframe{
1491
+ .video-js.skin_mini iframe{
1423
1492
  width: 100%;
1424
1493
  height: 100%;
1425
1494
  }
1426
1495
 
1427
- .video-js.skin_news .vjs-live-control{
1496
+ .video-js.skin_mini .vjs-live-control{
1428
1497
  align-items: center;
1498
+ max-width: 5em;
1429
1499
  }
1430
- .video-js.skin_news .vjs-live-control.vjs-control .vjs-live-display{
1500
+ .video-js.skin_mini .vjs-live-control.vjs-control .vjs-live-display{
1431
1501
  height: 2.2em;
1432
1502
  display: flex;
1433
1503
  align-items: center;
@@ -1435,258 +1505,188 @@
1435
1505
  width: 4em;
1436
1506
  justify-content: center;
1437
1507
  background: red;
1438
- margin: 4px 0px 4px 12px;
1508
+ margin: 4px 0px 4px 2px;
1439
1509
  }
1440
1510
 
1441
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:focus{
1511
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:focus{
1442
1512
  text-shadow: none;
1443
1513
  }
1444
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1514
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-seek-to-live-text {
1445
1515
  display: none;
1446
1516
  font-size: 12px;
1447
1517
  }
1448
1518
 
1449
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1450
- height: 2.2em;
1519
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder {
1520
+ height: 1.8em;
1451
1521
  display: inline-flex;
1452
1522
  align-items: center;
1453
- /* font-family: monospace; */
1523
+ font-family: monospace;
1454
1524
  justify-content: center;
1455
- border: 2px solid;
1456
- margin: 4px 0px 4px 6px;
1457
- white-space: pre;
1458
- padding: 0px 6px;
1459
- font-size: 1.2em;
1460
- font-weight: 500;
1461
- color: rgba(255, 255, 2555, 0.7);
1462
-
1463
- letter-spacing: -.1px;
1464
- line-height: normal;
1465
- text-transform: uppercase;
1466
- color: #FFFFFF;
1467
- opacity: .7;
1468
- font-family: "Proxima Nova";
1469
- }
1470
-
1471
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder:hover{
1472
- opacity: 1;
1525
+ border: 1.5px solid;
1526
+ margin: 4px 0px 4px 2px;
1527
+ white-space: pre;
1528
+ padding: 2px 4px;
1529
+ font-size: 1.2em;
1530
+ font-weight: 500;
1531
+ color: rgba(255, 255, 2555, 0.7);
1473
1532
  }
1474
1533
 
1475
- .video-js.skin_news .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1534
+ .video-js.skin_mini .vjs-seek-to-live-control.vjs-control:not(.vjs-at-live-edge) .vjs-icon-placeholder::before {
1476
1535
  content: "NOT LIVE";
1477
- }
1478
-
1479
- .settings-selection.vjs-control.vjs-button{
1480
- display: flex !important;
1481
- }
1482
-
1483
- @media(max-width:576px){
1484
- .settings-selection.vjs-control.vjs-button{
1485
- display: none !important;
1486
- }
1536
+ word-spacing: -4px;
1487
1537
  }
1488
1538
 
1489
1539
 
1490
- @media(max-width:576px){
1540
+ @media(max-width:600px){
1491
1541
  .tvProviderImage{
1492
1542
  display: none
1493
1543
  }
1494
- .video-js.skin_news .vjs-fullscreen .icon-minimize,
1544
+ .video-js.skin_mini .vjs-fullscreen .icon-minimize,
1495
1545
  .icon-maximize {
1496
1546
  height: 30px !important;
1497
1547
  }
1498
1548
 
1499
- .video-js.skin_news .vjs-fullscreen .icon-maximize,
1549
+ .video-js.skin_mini .vjs-fullscreen .icon-maximize,
1500
1550
  .icon-minimize {
1501
1551
  height: 30px !important;
1502
1552
  }
1503
- .video-js.skin_news .vjs-volume-panel.vjs-volume-panel-vertical{
1504
- width: 4.5em;
1553
+ .video-js.skin_mini .vjs-volume-panel.vjs-volume-panel-vertical{
1554
+ width: 3.5em;
1505
1555
  }
1506
- .video-js.skin_news button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1556
+ .video-js.skin_mini button.vjs-fullscreen-control.vjs-control.vjs-button>span.vjs-icon-placeholder::before {
1507
1557
  height: min-content;
1508
1558
  }
1509
1559
 
1510
- .video-js.skin_news button.vjs-slowmo-button{
1560
+ .video-js.skin_mini button.vjs-slowmo-button{
1511
1561
  display: none;
1512
1562
  }
1513
- .video-js.skin_news button.vjs-rewind-button{
1563
+ .video-js.skin_mini button.vjs-rewind-button{
1514
1564
  display: none;
1515
1565
  }
1516
- .video-js.skin_news button.vjs-rewind-button>svg{
1566
+ .video-js.skin_mini button.vjs-rewind-button>svg{
1517
1567
  height: 20px;
1518
1568
  }
1519
- .video-js.skin_news .vjs-button{
1520
- width: 4.8em;
1569
+ .video-js.skin_mini .vjs-button{
1570
+ width: 3em;
1521
1571
  }
1522
- .video-js.skin_news .widget-selection{
1572
+ .video-js.skin_mini .widget-selection{
1523
1573
  display: none;
1524
1574
  }
1525
- .video-js.skin_news .container{
1575
+ .video-js.skin_mini .container{
1526
1576
  display: none !important;
1527
1577
  }
1528
- .video-js.skin_news .vjs-control-bar{
1578
+ .video-js.skin_mini .vjs-control-bar{
1529
1579
  height: 4em !important;
1530
1580
  }
1531
- .video-js.skin_news .vjs-button>.vjs-icon-placeholder:before{
1581
+ .video-js.skin_mini .vjs-button>.vjs-icon-placeholder:before{
1532
1582
  font-size: 2.5em;
1533
1583
  line-height: 1.5;
1534
1584
  }
1535
- .video-js.skin_news .vjs-play-progress:before {
1585
+ .video-js.skin_mini .vjs-play-progress:before {
1536
1586
  font-size: 1.2em;
1537
1587
  position: absolute;
1538
1588
  right: -0.5em;
1539
1589
  z-index: 1;
1540
1590
  }
1541
- .video-js.skin_news button.vjs-skip-button>svg{
1591
+ .video-js.skin_mini button.vjs-skip-button>svg{
1542
1592
  height: 20px;
1543
1593
  }
1544
- .video-js.skin_news button.vjs-big-play-button {
1545
- width: 50px !important;
1546
- height: 50px !important;
1547
- font-size: 2.1rem !important;
1548
- }
1549
1594
 
1550
1595
  .stream-selector-icon>svg{
1551
1596
  width: 24px;
1552
1597
  height: 24px;
1553
1598
  }
1554
- .video-js.skin_news.vjs-live .vjs-progress-control .vjs-progress-holder{
1555
- margin: 0 12px 0 12px;
1556
- }
1557
- .video-js.skin_news .vjs-seek-to-live-text{
1599
+ .video-js.skin_mini .vjs-seek-to-live-text{
1558
1600
  font-size: 12px;
1559
1601
  }
1560
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder {
1561
- margin: 0 12px 0 12px;
1562
- }
1563
1602
  }
1564
- .video-js.skin_news.vjs-paused .vjs-big-play-button {
1565
- width: 90px;
1566
- height: 90px;
1567
- display: flex;
1568
- justify-content: center;
1569
- align-items: center;
1570
- border-radius: 50%;
1571
- position: absolute;
1572
- top: 0;
1573
- left: 0;
1574
- right: 0;
1575
- bottom: 0;
1576
- margin: auto;
1577
- font-size: 6em;
1578
- line-height: 1.4em;
1603
+
1604
+
1605
+ .video-js.skin_mini .vjs-text-track-display-ttml span {
1606
+ background-color: rgba(0, 0, 0, 0.2);
1579
1607
  }
1580
1608
 
1581
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1609
+
1610
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:hover .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1582
1611
  display: flex;
1583
1612
  justify-content: center;
1584
1613
  align-items: center;
1585
1614
  height: 100%;
1586
1615
  transition: width 0.1s;
1587
1616
  }
1617
+ .video-js.skin_mini .vjs-track-settings-colors fieldset.vjs-fg.vjs-track-setting{
1618
+ margin: 2px;
1619
+ }
1588
1620
 
1589
- .video-js.skin_news .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1621
+ .video-js.skin_mini .vjs-volume-panel.vjs-control.vjs-volume-panel-horizontal:active .vjs-volume-control.vjs-control.vjs-volume-horizontal {
1590
1622
  display: flex;
1591
1623
  justify-content: center;
1592
1624
  align-items: center;
1593
1625
  height: 100%;
1594
1626
  transition: width 0.1s;
1595
1627
  }
1596
- .video-js.skin_news.vjs-fullscreen .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1597
- display: none !important;
1628
+
1629
+ .video-js.skin_mini .vjs-text-track-settings .vjs-modal-dialog-content{
1630
+ display: block;
1631
+ font-size: 10px;
1632
+ padding: 6px 10px;
1633
+ margin: 0;
1634
+ max-height: 100%;
1635
+ overflow-y: auto;
1598
1636
  }
1599
- .video-js.skin_news .ssai-ad-container{
1600
- position: absolute;
1601
- bottom: 14px;
1637
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-colors,
1638
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-font,
1639
+ .video-js.skin_mini .vjs-text-track-settings .vjs-track-settings-controls{
1640
+ display: block;
1641
+ width: 100%;
1642
+ }
1643
+ .video-js.skin_mini .vjs-text-track-settings fieldset{
1644
+ margin: 4px 0;
1645
+ }
1646
+ .video-js.skin_mini .vjs-text-track-settings fieldset span{
1647
+ display: block;
1648
+ padding: 0 0 6px;
1649
+ }
1650
+ .video-js.skin_mini .vjs-text-track-settings fieldset span > select{
1651
+ max-width: 100%;
1602
1652
  }
1603
1653
 
1604
- @media (max-width: 576px) {
1605
- .video-js.skin_news .ssai-ad-container{
1606
- bottom: 2px;
1607
- }
1608
- .video-js.skin_news .vjs-progress-control .vjs-progress-holder{
1654
+ @media (max-width: 600px) {
1655
+ .video-js.skin_mini .vjs-progress-control .vjs-progress-holder{
1609
1656
  height: 5px !important;
1610
1657
  }
1611
- .video-js.skin_news button.vjs-big-play-button {
1612
- width: 50px !important;
1613
- height: 50px !important;
1614
- font-size: 2.1rem !important;
1615
- }
1616
1658
 
1617
- .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1659
+ .video-js.skin_mini .vjs-playback-rate.vjs-menu-button.vjs-menu-button-popup.vjs-control.vjs-button{
1618
1660
  display: none;
1619
1661
  }
1620
- .video-js.skin_news .vjs-menu > ul.vjs-menu-content {
1621
- bottom: 2.4em !important;
1622
- right: -1em;
1623
- z-index: 1;
1624
- }
1625
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button.vjs-picture-in-picture-control {
1626
- display: none !important;
1627
- }
1628
-
1629
- .video-js.skin_news .vjs-text-track-display-ttml span {
1630
- color: white;
1631
- font-size: 13px;
1632
- background-color: black;
1633
- }
1634
- }
1635
-
1636
- .video-js.skin_news .vjs-text-track-display-ttml span {
1637
- color: white;
1638
- font-size: 16px;
1639
- background-color: black;
1640
- }
1641
-
1642
- .video-js.skin_news.vjs-has-started.vjs-user-active.vjs-controls-enabled .vjs-text-track-display-ttml p {
1643
- margin-bottom: 2rem !important;
1644
- }
1645
-
1646
- .video-js.skin_news .vjs-text-track-display-ttml p {
1647
- font-size: 18px !important;
1648
- }
1649
-
1650
1662
 
1651
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-default-button,
1652
- .video-js.skin_news .vjs-text-track-settings .vjs-track-settings-controls .vjs-done-button {
1653
- font-size: 1.2em !important;
1654
- line-height: 1.5em !important;
1655
- padding: 0.2em 0.8em !important;
1656
1663
  }
1657
1664
 
1658
- .video-js.skin_news .vjs-control-bar .vjs-svg-icon{
1665
+ .video-js.skin_mini .vjs-control-bar .vjs-svg-icon{
1659
1666
  content: none !important;
1660
1667
  fill: none !important;
1661
1668
  filter: none !important;
1662
1669
  }
1663
1670
 
1664
1671
  /* svg icons opacity and hover effect */
1665
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button svg {
1672
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button svg {
1666
1673
  opacity: 0.7 !important;
1667
1674
  }
1668
1675
 
1669
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover svg {
1670
- opacity: 1 !important;
1671
- }
1672
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control{
1673
- opacity: 0.7 !important;
1674
- }
1675
- .video-js.skin_news .vjs-control-bar .vjs-remaining-time.vjs-time-control.vjs-control:hover{
1676
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover svg {
1676
1677
  opacity: 1 !important;
1677
1678
  }
1678
1679
 
1679
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1680
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button .vjs-button.vjs-menu-button {
1680
1681
  color: rgba(255, 255, 2555, 0.7)!important;
1681
1682
  }
1682
1683
 
1683
- .video-js.skin_news .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1684
+ .video-js.skin_mini .vjs-control-bar .vjs-control.vjs-button:hover .vjs-button.vjs-menu-button {
1684
1685
  color: rgba(255, 255, 2555, 1)!important;
1685
1686
  }
1686
1687
 
1687
1688
 
1688
1689
 
1689
-
1690
1690
  .video-js.skin_cn_news .vjs-control-bar {
1691
1691
  z-index: 1 !important;
1692
1692
  height: auto !important;
@@ -2200,6 +2200,7 @@
2200
2200
 
2201
2201
 
2202
2202
 
2203
+
2203
2204
  .video-js .multicamera-parent.default{
2204
2205
  height: 345px;
2205
2206
  position: absolute;
@@ -2278,9 +2279,6 @@
2278
2279
  align-content: baseline;
2279
2280
  }
2280
2281
 
2281
-
2282
-
2283
-
2284
2282
  .vjs-custom-big-mute.vjs-control{
2285
2283
  position: absolute;
2286
2284
  align-items: center;
@@ -2330,6 +2328,8 @@
2330
2328
  }
2331
2329
 
2332
2330
 
2331
+
2332
+
2333
2333
  /* nextep — up-next card (centered in player, scales with player size) */
2334
2334
  .video-js:has(.next-ep-preview),
2335
2335
  .video-js:has(.next-ep-preview-player-thumb) {
@@ -2612,6 +2612,38 @@
2612
2612
  z-index: 30 !important;
2613
2613
  }
2614
2614
 
2615
+ /* a wrapper element that tracks the mouse vertically */
2616
+ .vjs-thumbnail-holder {
2617
+ position: absolute;
2618
+ left: -1000px;
2619
+ }
2620
+
2621
+ /* the thumbnail image itself */
2622
+ .vjs-thumbnail {
2623
+ position: absolute;
2624
+ left: 0;
2625
+ bottom: 1.3em;
2626
+ opacity: 0;
2627
+ transition: opacity .2s ease;
2628
+ -webkit-transition: opacity .2s ease;
2629
+ -moz-transition: opacity .2s ease;
2630
+ -mz-transition: opacity .2s ease;
2631
+ }
2632
+
2633
+ /* fade in the thumbnail when hovering over the progress bar */
2634
+ /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2635
+ .vjs-progress-control:hover .vjs-thumbnail,
2636
+ .vjs-progress-control.fake-active .vjs-thumbnail,
2637
+ .vjs-progress-control:active .vjs-thumbnail {
2638
+ opacity: 1;
2639
+ }
2640
+
2641
+ /* ... but hide the thumbnail when hovering directly over it */
2642
+ .vjs-progress-control:hover .vjs-thumbnail:hover,
2643
+ .vjs-progress-control:active .vjs-thumbnail:active {
2644
+ opacity: 0;
2645
+ }
2646
+
2615
2647
  .video-js.vjs-quality-menu {
2616
2648
  display: block;
2617
2649
  }
@@ -2682,38 +2714,6 @@
2682
2714
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2683
2715
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite;
2684
2716
  }
2685
- /* a wrapper element that tracks the mouse vertically */
2686
- .vjs-thumbnail-holder {
2687
- position: absolute;
2688
- left: -1000px;
2689
- }
2690
-
2691
- /* the thumbnail image itself */
2692
- .vjs-thumbnail {
2693
- position: absolute;
2694
- left: 0;
2695
- bottom: 1.3em;
2696
- opacity: 0;
2697
- transition: opacity .2s ease;
2698
- -webkit-transition: opacity .2s ease;
2699
- -moz-transition: opacity .2s ease;
2700
- -mz-transition: opacity .2s ease;
2701
- }
2702
-
2703
- /* fade in the thumbnail when hovering over the progress bar */
2704
- /* .fake-active is needed for Android only. It's removed on touchend/touchecancel */
2705
- .vjs-progress-control:hover .vjs-thumbnail,
2706
- .vjs-progress-control.fake-active .vjs-thumbnail,
2707
- .vjs-progress-control:active .vjs-thumbnail {
2708
- opacity: 1;
2709
- }
2710
-
2711
- /* ... but hide the thumbnail when hovering directly over it */
2712
- .vjs-progress-control:hover .vjs-thumbnail:hover,
2713
- .vjs-progress-control:active .vjs-thumbnail:active {
2714
- opacity: 0;
2715
- }
2716
-
2717
2717
  .vjs-poster {
2718
2718
  display: inline-block;
2719
2719
  vertical-align: middle;