@gcorevideo/player 2.28.29 → 2.28.30

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.
package/dist/index.css CHANGED
@@ -122,6 +122,55 @@
122
122
  .gplayer-lite-btn::-moz-focus-inner {
123
123
  border: 0;
124
124
  padding: 0;
125
+ }.big-mute-icon-wrapper[data-big-mute] {
126
+ position: absolute;
127
+ z-index: 9998;
128
+ background-color: transparent;
129
+ display: flex;
130
+ justify-content: center;
131
+ width: 100%;
132
+ height: calc(100% - 50px);
133
+ margin: 0 auto;
134
+ opacity: 0.75;
135
+ transition: opacity 0.1s ease;
136
+ pointer-events: auto;
137
+ }
138
+ .big-mute-icon-wrapper[data-big-mute].hide {
139
+ display: none;
140
+ }
141
+ .big-mute-icon-wrapper[data-big-mute]:hover {
142
+ cursor: pointer;
143
+ }
144
+
145
+ .big-mute-icon[data-big-mute-icon] {
146
+ display: flex;
147
+ align-items: center;
148
+ justify-content: center;
149
+ align-self: center;
150
+ width: 120px;
151
+ height: 120px;
152
+ border: 2px solid white;
153
+ border-radius: 50%;
154
+ filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
155
+ filter: alpha(opacity=60);
156
+ opacity: 1;
157
+ box-shadow: 0 0 1px 0 white;
158
+ background: rgba(240, 243, 247, 0.9411764706);
159
+ z-index: 10000;
160
+ }
161
+ .big-mute-icon[data-big-mute-icon] svg {
162
+ margin-left: 5px;
163
+ width: 80px;
164
+ height: 80px;
165
+ }
166
+ .big-mute-icon[data-big-mute-icon] svg path {
167
+ fill: #1f1e1e !important;
168
+ }
169
+ .big-mute-icon[data-big-mute-icon]:hover {
170
+ background: rgba(240, 243, 247, 0.8784313725);
171
+ }
172
+ .big-mute-icon[data-big-mute-icon]:hover svg path {
173
+ fill: #151515 !important;
125
174
  }.media-control-skin-1 .media-control-item.media-control-gear {
126
175
  order: 99;
127
176
  }
@@ -230,55 +279,6 @@
230
279
  }
231
280
  .gear-wrapper ul.gear-sub-menu li.current a .check-icon svg {
232
281
  display: inline;
233
- }.big-mute-icon-wrapper[data-big-mute] {
234
- position: absolute;
235
- z-index: 9998;
236
- background-color: transparent;
237
- display: flex;
238
- justify-content: center;
239
- width: 100%;
240
- height: calc(100% - 50px);
241
- margin: 0 auto;
242
- opacity: 0.75;
243
- transition: opacity 0.1s ease;
244
- pointer-events: auto;
245
- }
246
- .big-mute-icon-wrapper[data-big-mute].hide {
247
- display: none;
248
- }
249
- .big-mute-icon-wrapper[data-big-mute]:hover {
250
- cursor: pointer;
251
- }
252
-
253
- .big-mute-icon[data-big-mute-icon] {
254
- display: flex;
255
- align-items: center;
256
- justify-content: center;
257
- align-self: center;
258
- width: 120px;
259
- height: 120px;
260
- border: 2px solid white;
261
- border-radius: 50%;
262
- filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
263
- filter: alpha(opacity=60);
264
- opacity: 1;
265
- box-shadow: 0 0 1px 0 white;
266
- background: rgba(240, 243, 247, 0.9411764706);
267
- z-index: 10000;
268
- }
269
- .big-mute-icon[data-big-mute-icon] svg {
270
- margin-left: 5px;
271
- width: 80px;
272
- height: 80px;
273
- }
274
- .big-mute-icon[data-big-mute-icon] svg path {
275
- fill: #1f1e1e !important;
276
- }
277
- .big-mute-icon[data-big-mute-icon]:hover {
278
- background: rgba(240, 243, 247, 0.8784313725);
279
- }
280
- .big-mute-icon[data-big-mute-icon]:hover svg path {
281
- fill: #151515 !important;
282
282
  }:root {
283
283
  --primary-background-color: #000;
284
284
  --secondary-background-color: #262626;
@@ -666,6 +666,76 @@
666
666
  }
667
667
  .gplayer-mc-clips .gplayer-mc-clips-text.compact {
668
668
  max-width: 100px;
669
+ }.context-menu {
670
+ z-index: 999;
671
+ position: absolute;
672
+ top: 0;
673
+ left: 0;
674
+ text-align: center;
675
+ }
676
+ .context-menu .context-menu-list {
677
+ font-family: "Proxima Nova", sans-serif;
678
+ font-size: 12px;
679
+ line-height: 12px;
680
+ list-style-type: none;
681
+ text-align: left;
682
+ padding: 5px;
683
+ margin-left: auto;
684
+ margin-right: auto;
685
+ background-color: rgba(0, 0, 0, 0.75);
686
+ border: 1px solid #666;
687
+ border-radius: 4px;
688
+ }
689
+ .context-menu .context-menu-list-item button {
690
+ border: none;
691
+ background-color: transparent;
692
+ padding: 0;
693
+ color: white;
694
+ display: flex;
695
+ gap: 8px;
696
+ align-items: center;
697
+ justify-content: center;
698
+ cursor: pointer;
699
+ padding: 5px;
700
+ width: 100%;
701
+ }
702
+ .context-menu .context-menu-list-item_icon {
703
+ width: 20px;
704
+ height: 20px;
705
+ }div.player-error-screen, [data-player] div.player-error-screen {
706
+ color: #CCCACA;
707
+ position: absolute;
708
+ top: 0;
709
+ height: 100%;
710
+ width: 100%;
711
+ background-color: rgba(0, 0, 0, 0.7);
712
+ z-index: 2000;
713
+ display: flex;
714
+ flex-direction: column;
715
+ justify-content: center;
716
+ }
717
+ div.player-error-screen__content[data-error-screen], [data-player] div.player-error-screen__content[data-error-screen] {
718
+ font-size: 14px;
719
+ color: #CCCACA;
720
+ margin-top: 45px;
721
+ }
722
+ div.player-error-screen__title[data-error-screen], [data-player] div.player-error-screen__title[data-error-screen] {
723
+ font-weight: bold;
724
+ line-height: 30px;
725
+ font-size: 18px;
726
+ }
727
+ div.player-error-screen__message[data-error-screen], [data-player] div.player-error-screen__message[data-error-screen] {
728
+ width: 90%;
729
+ margin: 0 auto;
730
+ }
731
+ div.player-error-screen__code[data-error-screen], [data-player] div.player-error-screen__code[data-error-screen] {
732
+ font-size: 13px;
733
+ margin-top: 15px;
734
+ }
735
+ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
736
+ cursor: pointer;
737
+ width: 30px;
738
+ margin: 15px auto 0;
669
739
  }.dvr-controls {
670
740
  --disabled-opacity: 0.3;
671
741
  --circle-radius: 5px;
@@ -723,76 +793,141 @@
723
793
  .dvr-controls .live-button:hover {
724
794
  opacity: 1;
725
795
  text-shadow: rgba(255, 255, 255, 0.75) 0 0 5px;
726
- }div.player-error-screen, [data-player] div.player-error-screen {
727
- color: #CCCACA;
728
- position: absolute;
729
- top: 0;
730
- height: 100%;
731
- width: 100%;
732
- background-color: rgba(0, 0, 0, 0.7);
733
- z-index: 2000;
734
- display: flex;
735
- flex-direction: column;
736
- justify-content: center;
796
+ }*,
797
+ :focus,
798
+ :visited {
799
+ outline: none !important;
737
800
  }
738
- div.player-error-screen__content[data-error-screen], [data-player] div.player-error-screen__content[data-error-screen] {
801
+
802
+ .multicamera[data-multicamera] {
803
+ float: right;
804
+ margin-top: 4px;
805
+ position: relative;
806
+ margin-right: 20px;
807
+ width: 20px;
808
+ }
809
+ .multicamera[data-multicamera] button {
810
+ background-color: transparent;
811
+ color: #fff;
812
+ font-family: Roboto, "Open Sans", Arial, sans-serif;
813
+ -webkit-font-smoothing: antialiased;
814
+ border: none;
739
815
  font-size: 14px;
740
- color: #CCCACA;
741
- margin-top: 45px;
816
+ padding: 0;
742
817
  }
743
- div.player-error-screen__title[data-error-screen], [data-player] div.player-error-screen__title[data-error-screen] {
744
- font-weight: bold;
745
- line-height: 30px;
746
- font-size: 18px;
818
+ .multicamera[data-multicamera] button svg {
819
+ height: 20px;
820
+ position: relative;
821
+ margin-top: 6px;
747
822
  }
748
- div.player-error-screen__message[data-error-screen], [data-player] div.player-error-screen__message[data-error-screen] {
749
- width: 90%;
750
- margin: 0 auto;
823
+ .multicamera[data-multicamera] button:hover {
824
+ color: #c9c9c9;
751
825
  }
752
- div.player-error-screen__code[data-error-screen], [data-player] div.player-error-screen__code[data-error-screen] {
753
- font-size: 13px;
754
- margin-top: 15px;
826
+ .multicamera[data-multicamera] button.changing {
827
+ animation: pulse 0.5s infinite alternate;
755
828
  }
756
- div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
757
- cursor: pointer;
758
- width: 30px;
759
- margin: 15px auto 0;
760
- }.context-menu {
761
- z-index: 999;
762
- position: absolute;
763
- top: 0;
764
- left: 0;
765
- text-align: center;
829
+ .multicamera[data-multicamera] button span.quality-arrow {
830
+ width: 9px;
831
+ height: 6px;
832
+ margin-top: 11px;
833
+ margin-left: 5px;
766
834
  }
767
- .context-menu .context-menu-list {
768
- font-family: "Proxima Nova", sans-serif;
769
- font-size: 12px;
770
- line-height: 12px;
835
+ .multicamera[data-multicamera] > ul {
836
+ padding: 6px 0;
837
+ right: -24px;
838
+ width: 245px;
771
839
  list-style-type: none;
772
- text-align: left;
773
- padding: 5px;
774
- margin-left: auto;
775
- margin-right: auto;
776
- background-color: rgba(0, 0, 0, 0.75);
777
- border: 1px solid #666;
840
+ position: absolute;
841
+ bottom: 48px;
778
842
  border-radius: 4px;
843
+ display: none;
844
+ background-color: rgba(74, 74, 74, 0.9);
779
845
  }
780
- .context-menu .context-menu-list-item button {
781
- border: none;
782
- background-color: transparent;
783
- padding: 0;
784
- color: white;
846
+ .multicamera[data-multicamera] > ul::after {
847
+ content: "";
848
+ position: absolute;
849
+ top: 100%;
850
+ left: 85%;
851
+ margin-left: -10px;
852
+ width: 0;
853
+ height: 0;
854
+ border-top: 10px solid rgba(74, 74, 74, 0.9);
855
+ border-right: 10px solid transparent;
856
+ border-left: 10px solid transparent;
857
+ }
858
+ .multicamera[data-multicamera] li {
859
+ font-size: 10px;
860
+ cursor: pointer;
861
+ }
862
+ .multicamera[data-multicamera] li .multicamera-item {
785
863
  display: flex;
786
- gap: 8px;
787
- align-items: center;
864
+ padding: 10px 0;
788
865
  justify-content: center;
789
- cursor: pointer;
790
- padding: 5px;
791
- width: 100%;
866
+ position: relative;
792
867
  }
793
- .context-menu .context-menu-list-item_icon {
794
- width: 20px;
868
+ .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] .multicamera-screenshot {
869
+ opacity: 0.5;
870
+ }
871
+ .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] .multicamera-text {
872
+ opacity: 0.5;
873
+ }
874
+ .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false]:hover {
875
+ background-color: rgba(0, 0, 0, 0);
876
+ }
877
+ .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] {
878
+ pointer-events: none;
879
+ }
880
+ .multicamera[data-multicamera] li .multicamera-item:hover, .multicamera[data-multicamera] li .multicamera-item.multicamera-active {
881
+ background-color: rgba(0, 0, 0, 0.3);
882
+ }
883
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-screenshot {
884
+ width: 80px;
885
+ height: 60px;
886
+ }
887
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-screenshot img {
888
+ width: 80px;
889
+ height: 60px;
890
+ }
891
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-text {
892
+ width: 120px;
893
+ text-align: left;
894
+ margin-left: 15px;
895
+ }
896
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-title,
897
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-description {
898
+ width: 120px;
795
899
  height: 20px;
900
+ font-family: Roboto, "Open Sans", Arial, sans-serif;
901
+ font-size: 14px;
902
+ font-weight: normal;
903
+ font-style: normal;
904
+ font-stretch: normal;
905
+ line-height: 1.43;
906
+ letter-spacing: normal;
907
+ text-align: left;
908
+ color: #fff;
909
+ text-overflow: ellipsis;
910
+ overflow: hidden;
911
+ }
912
+ .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-description {
913
+ opacity: 0.6;
914
+ }
915
+ .multicamera[data-multicamera] li a {
916
+ color: #444;
917
+ padding: 2px 10px;
918
+ display: block;
919
+ text-decoration: none;
920
+ }
921
+ .multicamera[data-multicamera] li a:hover {
922
+ background-color: #555;
923
+ color: white;
924
+ }
925
+ .multicamera[data-multicamera] li a:hover a {
926
+ color: white;
927
+ text-decoration: none;
928
+ }
929
+ .multicamera[data-multicamera] li.current a {
930
+ color: #f00;
796
931
  }.media-control-skin-1 .media-control-item.media-control-pip {
797
932
  order: 95;
798
933
  }
@@ -1422,141 +1557,6 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1422
1557
  100% {
1423
1558
  color: #B80000;
1424
1559
  }
1425
- }*,
1426
- :focus,
1427
- :visited {
1428
- outline: none !important;
1429
- }
1430
-
1431
- .multicamera[data-multicamera] {
1432
- float: right;
1433
- margin-top: 4px;
1434
- position: relative;
1435
- margin-right: 20px;
1436
- width: 20px;
1437
- }
1438
- .multicamera[data-multicamera] button {
1439
- background-color: transparent;
1440
- color: #fff;
1441
- font-family: Roboto, "Open Sans", Arial, sans-serif;
1442
- -webkit-font-smoothing: antialiased;
1443
- border: none;
1444
- font-size: 14px;
1445
- padding: 0;
1446
- }
1447
- .multicamera[data-multicamera] button svg {
1448
- height: 20px;
1449
- position: relative;
1450
- margin-top: 6px;
1451
- }
1452
- .multicamera[data-multicamera] button:hover {
1453
- color: #c9c9c9;
1454
- }
1455
- .multicamera[data-multicamera] button.changing {
1456
- animation: pulse 0.5s infinite alternate;
1457
- }
1458
- .multicamera[data-multicamera] button span.quality-arrow {
1459
- width: 9px;
1460
- height: 6px;
1461
- margin-top: 11px;
1462
- margin-left: 5px;
1463
- }
1464
- .multicamera[data-multicamera] > ul {
1465
- padding: 6px 0;
1466
- right: -24px;
1467
- width: 245px;
1468
- list-style-type: none;
1469
- position: absolute;
1470
- bottom: 48px;
1471
- border-radius: 4px;
1472
- display: none;
1473
- background-color: rgba(74, 74, 74, 0.9);
1474
- }
1475
- .multicamera[data-multicamera] > ul::after {
1476
- content: "";
1477
- position: absolute;
1478
- top: 100%;
1479
- left: 85%;
1480
- margin-left: -10px;
1481
- width: 0;
1482
- height: 0;
1483
- border-top: 10px solid rgba(74, 74, 74, 0.9);
1484
- border-right: 10px solid transparent;
1485
- border-left: 10px solid transparent;
1486
- }
1487
- .multicamera[data-multicamera] li {
1488
- font-size: 10px;
1489
- cursor: pointer;
1490
- }
1491
- .multicamera[data-multicamera] li .multicamera-item {
1492
- display: flex;
1493
- padding: 10px 0;
1494
- justify-content: center;
1495
- position: relative;
1496
- }
1497
- .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] .multicamera-screenshot {
1498
- opacity: 0.5;
1499
- }
1500
- .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] .multicamera-text {
1501
- opacity: 0.5;
1502
- }
1503
- .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false]:hover {
1504
- background-color: rgba(0, 0, 0, 0);
1505
- }
1506
- .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] {
1507
- pointer-events: none;
1508
- }
1509
- .multicamera[data-multicamera] li .multicamera-item:hover, .multicamera[data-multicamera] li .multicamera-item.multicamera-active {
1510
- background-color: rgba(0, 0, 0, 0.3);
1511
- }
1512
- .multicamera[data-multicamera] li .multicamera-item .multicamera-screenshot {
1513
- width: 80px;
1514
- height: 60px;
1515
- }
1516
- .multicamera[data-multicamera] li .multicamera-item .multicamera-screenshot img {
1517
- width: 80px;
1518
- height: 60px;
1519
- }
1520
- .multicamera[data-multicamera] li .multicamera-item .multicamera-text {
1521
- width: 120px;
1522
- text-align: left;
1523
- margin-left: 15px;
1524
- }
1525
- .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-title,
1526
- .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-description {
1527
- width: 120px;
1528
- height: 20px;
1529
- font-family: Roboto, "Open Sans", Arial, sans-serif;
1530
- font-size: 14px;
1531
- font-weight: normal;
1532
- font-style: normal;
1533
- font-stretch: normal;
1534
- line-height: 1.43;
1535
- letter-spacing: normal;
1536
- text-align: left;
1537
- color: #fff;
1538
- text-overflow: ellipsis;
1539
- overflow: hidden;
1540
- }
1541
- .multicamera[data-multicamera] li .multicamera-item .multicamera-text .multicamera-description {
1542
- opacity: 0.6;
1543
- }
1544
- .multicamera[data-multicamera] li a {
1545
- color: #444;
1546
- padding: 2px 10px;
1547
- display: block;
1548
- text-decoration: none;
1549
- }
1550
- .multicamera[data-multicamera] li a:hover {
1551
- background-color: #555;
1552
- color: white;
1553
- }
1554
- .multicamera[data-multicamera] li a:hover a {
1555
- color: white;
1556
- text-decoration: none;
1557
- }
1558
- .multicamera[data-multicamera] li.current a {
1559
- color: #f00;
1560
1560
  }.player-poster {
1561
1561
  display: flex;
1562
1562
  justify-content: center;
@@ -1591,45 +1591,6 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1591
1591
  }
1592
1592
  .player-poster .play-wrapper svg path {
1593
1593
  fill: #fff;
1594
- }.quality-levels li.disabled {
1595
- opacity: 0.5;
1596
- pointer-events: none;
1597
- }
1598
- .quality-levels li.current {
1599
- background-color: #000;
1600
- }.seek-time {
1601
- position: absolute;
1602
- white-space: nowrap;
1603
- height: 20px;
1604
- line-height: 20px;
1605
- font-size: 0;
1606
- left: -100%;
1607
- bottom: 55px;
1608
- background-color: rgba(2, 2, 2, 0.5);
1609
- z-index: 9999;
1610
- transition: opacity 0.1s ease;
1611
- }
1612
- .seek-time.hidden {
1613
- opacity: 0;
1614
- }
1615
- .seek-time .seek-time__pos {
1616
- display: inline-block;
1617
- color: white;
1618
- font-size: 10px;
1619
- padding-left: 7px;
1620
- padding-right: 7px;
1621
- vertical-align: top;
1622
- }
1623
- .seek-time .seek-time__duration {
1624
- display: inline-block;
1625
- color: rgba(255, 255, 255, 0.5);
1626
- font-size: 10px;
1627
- padding-right: 7px;
1628
- vertical-align: top;
1629
- }
1630
- .seek-time .seek-time__duration::before {
1631
- content: "|";
1632
- margin-right: 7px;
1633
1594
  }.share_plugin[data-share] {
1634
1595
  pointer-events: auto;
1635
1596
  z-index: 5;
@@ -1713,27 +1674,39 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1713
1674
  display: inline-block;
1714
1675
  margin-right: 5px;
1715
1676
  cursor: pointer;
1716
- }.container-with-poster-clickable .mc-skip-time {
1717
- height: 0;
1718
- }
1719
-
1720
- .mc-skip-time {
1677
+ }.seek-time {
1721
1678
  position: absolute;
1722
- width: 100%;
1723
- height: calc(100% - 50px);
1724
- z-index: 9998;
1725
- background-color: transparent;
1726
- font-family: Roboto, "Open Sans", Arial, sans-serif;
1679
+ white-space: nowrap;
1680
+ height: 20px;
1681
+ line-height: 20px;
1682
+ font-size: 0;
1683
+ left: -100%;
1684
+ bottom: 55px;
1685
+ background-color: rgba(2, 2, 2, 0.5);
1686
+ z-index: 9999;
1687
+ transition: opacity 0.1s ease;
1727
1688
  }
1728
- .mc-skip-time .skip-container {
1729
- width: 100%;
1730
- height: 100%;
1731
- display: flex;
1732
- justify-content: space-between;
1689
+ .seek-time.hidden {
1690
+ opacity: 0;
1733
1691
  }
1734
- .mc-skip-time .skip-container .skip-item {
1735
- flex: 1 0 0px;
1736
- height: 100%;
1692
+ .seek-time .seek-time__pos {
1693
+ display: inline-block;
1694
+ color: white;
1695
+ font-size: 10px;
1696
+ padding-left: 7px;
1697
+ padding-right: 7px;
1698
+ vertical-align: top;
1699
+ }
1700
+ .seek-time .seek-time__duration {
1701
+ display: inline-block;
1702
+ color: rgba(255, 255, 255, 0.5);
1703
+ font-size: 10px;
1704
+ padding-right: 7px;
1705
+ vertical-align: top;
1706
+ }
1707
+ .seek-time .seek-time__duration::before {
1708
+ content: "|";
1709
+ margin-right: 7px;
1737
1710
  }.spinner-three-bounce[data-spinner] {
1738
1711
  position: absolute;
1739
1712
  width: 70px;
@@ -1772,63 +1745,33 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1772
1745
  40% {
1773
1746
  transform: scale(1);
1774
1747
  }
1775
- }.media-control-skin-1 .media-control-cc button.media-control-button {
1776
- display: flex;
1777
- justify-content: center;
1778
- padding: 0;
1779
- align-items: center;
1780
- vertical-align: top;
1781
- }
1782
- .media-control-skin-1 .media-control-cc button.media-control-button:hover {
1783
- color: white;
1784
- }
1785
- .media-control-skin-1 .media-control-cc ul li {
1786
- text-align: center;
1787
- }
1788
- .media-control-skin-1 .media-control-cc ul li a {
1789
- height: 30px;
1790
- padding: 5px 10px;
1791
- color: #fffffe;
1792
- }
1793
- .media-control-skin-1 .media-control-cc ul li a:hover {
1794
- background-color: rgba(0, 0, 0, 0.4);
1795
- }
1796
- .media-control-skin-1 .media-control-cc ul li.current a {
1797
- background-color: rgba(0, 0, 0, 0.4);
1798
- }
1799
- .media-control-skin-1 .media-control-cc ul li:first-child a {
1800
- border-bottom-left-radius: 4px;
1801
- border-bottom-right-radius: 4px;
1802
- }
1803
- .media-control-skin-1 .media-control-cc ul li:last-child a {
1804
- border-top-left-radius: 4px;
1805
- border-top-right-radius: 4px;
1806
- }
1807
- .media-control-skin-1 .media-control-cc {
1808
- position: relative;
1809
- order: 85;
1810
- }
1811
-
1812
- ::cue {
1813
- visibility: hidden !important;
1814
- font-size: 0 !important;
1748
+ }.quality-levels li.disabled {
1749
+ opacity: 0.5;
1750
+ pointer-events: none;
1815
1751
  }
1816
-
1817
- .ios-fullscreen::cue {
1818
- visibility: visible !important;
1819
- font-size: 1em !important;
1752
+ .quality-levels li.current {
1753
+ background-color: #000;
1754
+ }.container-with-poster-clickable .mc-skip-time {
1755
+ height: 0;
1820
1756
  }
1821
1757
 
1822
- .container .gplayer-cc-line {
1758
+ .mc-skip-time {
1823
1759
  position: absolute;
1824
- bottom: calc(var(--bottom-panel) + 5px);
1825
1760
  width: 100%;
1761
+ height: calc(100% - 50px);
1762
+ z-index: 9998;
1763
+ background-color: transparent;
1764
+ font-family: Roboto, "Open Sans", Arial, sans-serif;
1826
1765
  }
1827
- .container .gplayer-cc-line p {
1828
- width: auto;
1829
- background-color: rgba(0, 0, 0, 0.4);
1830
- color: white;
1831
- display: inline-block;
1766
+ .mc-skip-time .skip-container {
1767
+ width: 100%;
1768
+ height: 100%;
1769
+ display: flex;
1770
+ justify-content: space-between;
1771
+ }
1772
+ .mc-skip-time .skip-container .skip-item {
1773
+ flex: 1 0 0px;
1774
+ height: 100%;
1832
1775
  }.scrub-thumbnails {
1833
1776
  position: absolute;
1834
1777
  bottom: 52px;
@@ -1892,6 +1835,63 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1892
1835
  }
1893
1836
  .scrub-thumbnails .backdrop .carousel img {
1894
1837
  width: auto;
1838
+ }.media-control-skin-1 .media-control-cc button.media-control-button {
1839
+ display: flex;
1840
+ justify-content: center;
1841
+ padding: 0;
1842
+ align-items: center;
1843
+ vertical-align: top;
1844
+ }
1845
+ .media-control-skin-1 .media-control-cc button.media-control-button:hover {
1846
+ color: white;
1847
+ }
1848
+ .media-control-skin-1 .media-control-cc ul li {
1849
+ text-align: center;
1850
+ }
1851
+ .media-control-skin-1 .media-control-cc ul li a {
1852
+ height: 30px;
1853
+ padding: 5px 10px;
1854
+ color: #fffffe;
1855
+ }
1856
+ .media-control-skin-1 .media-control-cc ul li a:hover {
1857
+ background-color: rgba(0, 0, 0, 0.4);
1858
+ }
1859
+ .media-control-skin-1 .media-control-cc ul li.current a {
1860
+ background-color: rgba(0, 0, 0, 0.4);
1861
+ }
1862
+ .media-control-skin-1 .media-control-cc ul li:first-child a {
1863
+ border-bottom-left-radius: 4px;
1864
+ border-bottom-right-radius: 4px;
1865
+ }
1866
+ .media-control-skin-1 .media-control-cc ul li:last-child a {
1867
+ border-top-left-radius: 4px;
1868
+ border-top-right-radius: 4px;
1869
+ }
1870
+ .media-control-skin-1 .media-control-cc {
1871
+ position: relative;
1872
+ order: 85;
1873
+ }
1874
+
1875
+ ::cue {
1876
+ visibility: hidden !important;
1877
+ font-size: 0 !important;
1878
+ }
1879
+
1880
+ .ios-fullscreen::cue {
1881
+ visibility: visible !important;
1882
+ font-size: 1em !important;
1883
+ }
1884
+
1885
+ .container .gplayer-cc-line {
1886
+ position: absolute;
1887
+ bottom: calc(var(--bottom-panel) + 5px);
1888
+ width: 100%;
1889
+ }
1890
+ .container .gplayer-cc-line p {
1891
+ width: auto;
1892
+ background-color: rgba(0, 0, 0, 0.4);
1893
+ color: white;
1894
+ display: inline-block;
1895
1895
  }.player-logo[data-logo] {
1896
1896
  position: absolute;
1897
1897
  z-index: 2;