@gcorevideo/player 2.28.14 → 2.28.17

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,64 +122,55 @@
122
122
  .gplayer-lite-btn::-moz-focus-inner {
123
123
  border: 0;
124
124
  padding: 0;
125
- }*, :focus, :visited {
126
- outline: none !important;
127
- }
128
-
129
- .gear-wrapper .go-back {
130
- font-weight: 600;
131
- font-size: 14px;
132
- line-height: 20px;
133
- width: 100%;
134
- text-align: left;
135
- padding: 12px;
136
- }
137
- .gear-wrapper .go-back .arrow-left-icon {
138
- float: left;
139
- padding-top: 2px;
140
- padding-right: 2px;
141
- }
142
- .gear-wrapper .go-back .arrow-left-icon svg {
143
- height: 16px;
144
- }
145
- .gear-wrapper ul.gear-sub-menu {
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;
146
131
  width: 100%;
147
- list-style-type: none;
148
- min-width: 60px;
149
- border-top: 2px solid rgb(36, 36, 36);
150
- overflow-y: auto;
132
+ height: calc(100% - 50px);
133
+ margin: 0 auto;
134
+ opacity: 0.75;
135
+ transition: opacity 0.1s ease;
136
+ pointer-events: auto;
151
137
  }
152
- .gear-wrapper ul.gear-sub-menu li {
153
- font-size: 12px;
154
- text-align: left;
138
+ .big-mute-icon-wrapper[data-big-mute].hide {
139
+ display: none;
155
140
  }
156
- .gear-wrapper ul.gear-sub-menu li a {
157
- display: block;
158
- text-decoration: none;
159
- height: 30px;
160
- padding: 5px 10px;
161
- line-height: 22px;
162
- color: var(--gplayer-mc-text-dim-color);
141
+ .big-mute-icon-wrapper[data-big-mute]:hover {
142
+ cursor: pointer;
163
143
  }
164
- .gear-wrapper ul.gear-sub-menu li a:hover {
165
- color: var(--gplayer-mc-text-color);
166
- background-color: rgba(0, 0, 0, 0.4);
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;
167
160
  }
168
- .gear-wrapper ul.gear-sub-menu li a:hover a {
169
- color: var(--gplayer-mc-text-color);
170
- text-decoration: none;
161
+ .big-mute-icon[data-big-mute-icon] svg {
162
+ margin-left: 5px;
163
+ width: 80px;
164
+ height: 80px;
171
165
  }
172
- .gear-wrapper ul.gear-sub-menu li a .check-icon {
173
- width: 30px;
174
- height: 20px;
175
- float: left;
176
- display: block;
166
+ .big-mute-icon[data-big-mute-icon] svg path {
167
+ fill: #1f1e1e !important;
177
168
  }
178
- .gear-wrapper ul.gear-sub-menu li a .check-icon svg {
179
- display: none;
169
+ .big-mute-icon[data-big-mute-icon]:hover {
170
+ background: rgba(240, 243, 247, 0.8784313725);
180
171
  }
181
- .gear-wrapper ul.gear-sub-menu li.current a .check-icon svg {
182
- display: inline;
172
+ .big-mute-icon[data-big-mute-icon]:hover svg path {
173
+ fill: #151515 !important;
183
174
  }.media-control-skin-1 .media-control-item.media-control-gear {
184
175
  order: 99;
185
176
  }
@@ -225,55 +216,69 @@
225
216
  }
226
217
  .media-control-skin-1 .media-control-item.media-control-gear .gear-option_value {
227
218
  flex: 1 0 auto;
228
- }.big-mute-icon-wrapper[data-big-mute] {
229
- position: absolute;
230
- z-index: 9998;
231
- background-color: transparent;
232
- display: flex;
233
- justify-content: center;
219
+ }*,
220
+ :focus,
221
+ :visited {
222
+ outline: none !important;
223
+ }
224
+
225
+ .gear-wrapper .go-back {
226
+ font-weight: 600;
227
+ font-size: 14px;
228
+ line-height: 20px;
234
229
  width: 100%;
235
- height: calc(100% - 50px);
236
- margin: 0 auto;
237
- opacity: 0.75;
238
- transition: opacity 0.1s ease;
239
- pointer-events: auto;
230
+ text-align: left;
231
+ padding: 12px;
240
232
  }
241
- .big-mute-icon-wrapper[data-big-mute].hide {
242
- display: none;
233
+ .gear-wrapper .go-back .arrow-left-icon {
234
+ float: left;
235
+ padding-top: 2px;
236
+ padding-right: 2px;
243
237
  }
244
- .big-mute-icon-wrapper[data-big-mute]:hover {
245
- cursor: pointer;
238
+ .gear-wrapper .go-back .arrow-left-icon svg {
239
+ height: 16px;
246
240
  }
247
-
248
- .big-mute-icon[data-big-mute-icon] {
249
- display: flex;
250
- align-items: center;
251
- justify-content: center;
252
- align-self: center;
253
- width: 120px;
254
- height: 120px;
255
- border: 2px solid white;
256
- border-radius: 50%;
257
- filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
258
- filter: alpha(opacity=60);
259
- opacity: 1;
260
- box-shadow: 0 0 1px 0 white;
261
- background: rgba(240, 243, 247, 0.9411764706);
262
- z-index: 10000;
241
+ .gear-wrapper .gear-options-list,
242
+ .gear-wrapper .gear-sub-menu {
243
+ list-style-type: none;
263
244
  }
264
- .big-mute-icon[data-big-mute-icon] svg {
265
- margin-left: 5px;
266
- width: 80px;
267
- height: 80px;
245
+ .gear-wrapper ul.gear-sub-menu {
246
+ width: 100%;
247
+ min-width: 60px;
248
+ border-top: 2px solid rgb(36, 36, 36);
249
+ overflow-y: auto;
268
250
  }
269
- .big-mute-icon[data-big-mute-icon] svg path {
270
- fill: #1f1e1e !important;
251
+ .gear-wrapper ul.gear-sub-menu li {
252
+ font-size: 12px;
253
+ text-align: left;
271
254
  }
272
- .big-mute-icon[data-big-mute-icon]:hover {
273
- background: rgba(240, 243, 247, 0.8784313725);
255
+ .gear-wrapper ul.gear-sub-menu li a {
256
+ display: block;
257
+ text-decoration: none;
258
+ height: 30px;
259
+ padding: 5px 10px;
260
+ line-height: 22px;
261
+ color: var(--gplayer-mc-text-dim-color);
274
262
  }
275
- .big-mute-icon[data-big-mute-icon]:hover svg path {
276
- fill: #151515 !important;
263
+ .gear-wrapper ul.gear-sub-menu li a:hover {
264
+ color: var(--gplayer-mc-text-color);
265
+ background-color: rgba(0, 0, 0, 0.4);
266
+ }
267
+ .gear-wrapper ul.gear-sub-menu li a:hover a {
268
+ color: var(--gplayer-mc-text-color);
269
+ text-decoration: none;
270
+ }
271
+ .gear-wrapper ul.gear-sub-menu li a .check-icon {
272
+ width: 30px;
273
+ height: 20px;
274
+ float: left;
275
+ display: block;
276
+ }
277
+ .gear-wrapper ul.gear-sub-menu li a .check-icon svg {
278
+ display: none;
279
+ }
280
+ .gear-wrapper ul.gear-sub-menu li.current a .check-icon svg {
281
+ display: inline;
277
282
  }:root {
278
283
  --primary-background-color: #000;
279
284
  --secondary-background-color: #262626;
@@ -661,6 +666,42 @@
661
666
  }
662
667
  .gplayer-mc-clips .gplayer-mc-clips-text.compact {
663
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;
664
705
  }.dvr-controls {
665
706
  --disabled-opacity: 0.3;
666
707
  --circle-radius: 5px;
@@ -718,42 +759,6 @@
718
759
  .dvr-controls .live-button:hover {
719
760
  opacity: 1;
720
761
  text-shadow: rgba(255, 255, 255, 0.75) 0 0 5px;
721
- }.context-menu {
722
- z-index: 999;
723
- position: absolute;
724
- top: 0;
725
- left: 0;
726
- text-align: center;
727
- }
728
- .context-menu .context-menu-list {
729
- font-family: "Proxima Nova", sans-serif;
730
- font-size: 12px;
731
- line-height: 12px;
732
- list-style-type: none;
733
- text-align: left;
734
- padding: 5px;
735
- margin-left: auto;
736
- margin-right: auto;
737
- background-color: rgba(0, 0, 0, 0.75);
738
- border: 1px solid #666;
739
- border-radius: 4px;
740
- }
741
- .context-menu .context-menu-list-item button {
742
- border: none;
743
- background-color: transparent;
744
- padding: 0;
745
- color: white;
746
- display: flex;
747
- gap: 8px;
748
- align-items: center;
749
- justify-content: center;
750
- cursor: pointer;
751
- padding: 5px;
752
- width: 100%;
753
- }
754
- .context-menu .context-menu-list-item_icon {
755
- width: 20px;
756
- height: 20px;
757
762
  }div.player-error-screen, [data-player] div.player-error-screen {
758
763
  color: #CCCACA;
759
764
  position: absolute;
@@ -796,6 +801,40 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
796
801
  }
797
802
  .media-control-skin-1 .media-control-item.media-control-pip button svg {
798
803
  height: 20px;
804
+ }.player-poster {
805
+ display: flex;
806
+ justify-content: center;
807
+ align-items: center;
808
+ position: absolute;
809
+ height: 100%;
810
+ width: 100%;
811
+ z-index: 998;
812
+ top: 0;
813
+ left: 0;
814
+ background-color: #000;
815
+ background-size: cover;
816
+ background-repeat: no-repeat;
817
+ background-position: 50% 50%;
818
+ }
819
+ .player-poster.clickable {
820
+ cursor: pointer;
821
+ }
822
+ .player-poster:hover .play-wrapper {
823
+ opacity: 1;
824
+ }
825
+ .player-poster .play-wrapper {
826
+ width: 100%;
827
+ height: 25%;
828
+ margin: 0 auto;
829
+ opacity: 0.75;
830
+ transition: opacity 0.1s ease;
831
+ }
832
+ .player-poster .play-wrapper svg {
833
+ height: 100%;
834
+ display: inline;
835
+ }
836
+ .player-poster .play-wrapper svg path {
837
+ fill: #fff;
799
838
  }[data-player] {
800
839
  --bottom-panel: 40px;
801
840
  }
@@ -1142,16 +1181,16 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1142
1181
  .media-control-skin-1 .media-control-indicator[data-position] {
1143
1182
  margin: 1px 0 0 7px;
1144
1183
  }
1184
+ .media-control-skin-1 .media-control-indicator[data-duration]::before {
1185
+ content: "|";
1186
+ margin-right: 7px;
1187
+ }
1145
1188
  .media-control-skin-1 .media-control-indicator[data-duration] {
1146
1189
  color: rgb(255, 255, 255);
1147
1190
  opacity: 0.5;
1148
1191
  margin-top: 1px;
1149
1192
  margin-right: 6px;
1150
1193
  }
1151
- .media-control-skin-1 .media-control-indicator[data-duration]::before {
1152
- content: "|";
1153
- margin-right: 7px;
1154
- }
1155
1194
  .media-control-skin-1 .bar-container[data-seekbar] {
1156
1195
  position: absolute;
1157
1196
  top: -11px;
@@ -1489,9 +1528,6 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1489
1528
  justify-content: center;
1490
1529
  position: relative;
1491
1530
  }
1492
- .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] {
1493
- pointer-events: none;
1494
- }
1495
1531
  .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] .multicamera-screenshot {
1496
1532
  opacity: 0.5;
1497
1533
  }
@@ -1501,6 +1537,9 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1501
1537
  .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false]:hover {
1502
1538
  background-color: rgba(0, 0, 0, 0);
1503
1539
  }
1540
+ .multicamera[data-multicamera] li .multicamera-item[data-mulitcamera-selector-live=false] {
1541
+ pointer-events: none;
1542
+ }
1504
1543
  .multicamera[data-multicamera] li .multicamera-item:hover, .multicamera[data-multicamera] li .multicamera-item.multicamera-active {
1505
1544
  background-color: rgba(0, 0, 0, 0.3);
1506
1545
  }
@@ -1552,40 +1591,6 @@ div.player-error-screen__reload, [data-player] div.player-error-screen__reload {
1552
1591
  }
1553
1592
  .multicamera[data-multicamera] li.current a {
1554
1593
  color: #f00;
1555
- }.player-poster {
1556
- display: flex;
1557
- justify-content: center;
1558
- align-items: center;
1559
- position: absolute;
1560
- height: 100%;
1561
- width: 100%;
1562
- z-index: 998;
1563
- top: 0;
1564
- left: 0;
1565
- background-color: #000;
1566
- background-size: cover;
1567
- background-repeat: no-repeat;
1568
- background-position: 50% 50%;
1569
- }
1570
- .player-poster.clickable {
1571
- cursor: pointer;
1572
- }
1573
- .player-poster:hover .play-wrapper {
1574
- opacity: 1;
1575
- }
1576
- .player-poster .play-wrapper {
1577
- width: 100%;
1578
- height: 25%;
1579
- margin: 0 auto;
1580
- opacity: 0.75;
1581
- transition: opacity 0.1s ease;
1582
- }
1583
- .player-poster .play-wrapper svg {
1584
- height: 100%;
1585
- display: inline;
1586
- }
1587
- .player-poster .play-wrapper svg path {
1588
- fill: #fff;
1589
1594
  }.quality-levels li.disabled {
1590
1595
  opacity: 0.5;
1591
1596
  pointer-events: none;