Hiding two vjs controls when the screen is narrow (#2688)

- If picture and picture is disabled, the control can be hidden
when the available screen real estate is small.
- If the width is under 680, the video is already
almost the width of the entire window, so it makes sense
to hide it.
This commit is contained in:
Emma 2022-10-08 16:35:28 -04:00 committed by GitHub
parent 0f2fe16583
commit ec00ee3c04
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 0 deletions

View File

@ -2192,3 +2192,13 @@ video::-webkit-media-text-track-display {
height: 100%;
}
}
@media screen and (max-width: 680px) {
.vjs-control.vjs-disabled.vjs-picture-in-picture-control,
.vjs-control.vjs-button.vjs-button-fullwindow {
display: none;
}
.vjs-full-window .video-js.vjs-full-screen .vjs-control.vjs-button.vjs-button-fullwindow {
display: initial;
}
}