From ec00ee3c04c075f18113178d6e34b4ad4bbf494d Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Sat, 8 Oct 2022 16:35:28 -0400
Subject: [PATCH] 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.
---
 src/renderer/videoJS.css | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/renderer/videoJS.css b/src/renderer/videoJS.css
index 7d56c1e27..f23db964a 100644
--- a/src/renderer/videoJS.css
+++ b/src/renderer/videoJS.css
@@ -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;
+  }
+}
\ No newline at end of file