e89e65e1f5
- use built-in videojs font icon instead - remove button clickhandler override to make button work on mobile
67 lines
1.2 KiB
CSS
67 lines
1.2 KiB
CSS
video.video-js {
|
|
width: 100%;
|
|
height: 100%;
|
|
display: block;
|
|
min-height: 100%
|
|
}
|
|
|
|
/* show big play button when paused */
|
|
.vjs-has-started.vjs-paused .vjs-big-play-button{
|
|
display: block;
|
|
}
|
|
|
|
.vjs-airplay .vjs-icon-placeholder::before {
|
|
content: url("../img/airplay.png");
|
|
}
|
|
|
|
.vjs-quality-selector .vjs-icon-placeholder {
|
|
font-family: VideoJS;
|
|
font-weight: 400;
|
|
font-style: normal;
|
|
}
|
|
.vjs-quality-selector .vjs-icon-placeholder::before {
|
|
content: "\f110";
|
|
}
|
|
|
|
.vjs-big-play-button {
|
|
z-index: 48;
|
|
}
|
|
|
|
.vjs-loading-spinner {
|
|
z-index: 49;
|
|
}
|
|
|
|
/*
|
|
videojs hack!!
|
|
for some reason, there are cases where a <video class="vjs-tech"> element gets embedded twice.
|
|
we only want the first one. the second obstructs the layout.
|
|
Some context here:
|
|
https://github.com/owncast/owncast/issues/165
|
|
*/
|
|
video.vjs-tech:not([src]) {
|
|
display: none;
|
|
}
|
|
|
|
|
|
#oc-custom-poster {
|
|
position: absolute;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Animation time for crossfading between poster thumbs */
|
|
.custom-thumbnail-image {
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
transition: opacity 2s;
|
|
}
|
|
|