From 96f80753fa47f1ae978063b9762d186f92dad377 Mon Sep 17 00:00:00 2001
From: Broque Thomas <26755000+Nezreka@users.noreply.github.com>
Date: Fri, 3 Apr 2026 13:51:18 -0700
Subject: [PATCH] Fix media player collapsing in sidebar on short viewports and
 mobile

Added min-height and flex-shrink: 0 to prevent the sidebar flex layout
from compressing the player to zero height. Desktop 120px, tablet 100px,
phone 90px. The sidebar-spacer absorbs compression instead.
---
 webui/static/mobile.css | 7 ++++++-
 webui/static/style.css  | 2 ++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/webui/static/mobile.css b/webui/static/mobile.css
index a94575bf..38dba241 100644
--- a/webui/static/mobile.css
+++ b/webui/static/mobile.css
@@ -113,7 +113,8 @@
     }
 
     #media-player {
-        min-height: fit-content;
+        min-height: 110px;
+        flex-shrink: 0;
     }
 
     .tool-help-button {
@@ -1915,6 +1916,8 @@
         margin: 8px 10px;
         padding: 14px;
         border-radius: 12px;
+        min-height: 100px;
+        flex-shrink: 0;
     }
 
     .media-header {
@@ -2275,6 +2278,8 @@
     .media-player {
         margin: 6px 8px;
         padding: 10px;
+        min-height: 90px;
+        flex-shrink: 0;
     }
 
     .media-player .track-title {
diff --git a/webui/static/style.css b/webui/static/style.css
index 1fe6435e..459f847c 100644
--- a/webui/static/style.css
+++ b/webui/static/style.css
@@ -523,6 +523,8 @@ body {
         0 2px 8px rgba(0, 0, 0, 0.3),
         inset 0 1px 0 rgba(255, 255, 255, 0.07);
     position: relative;
+    min-height: 120px;
+    flex-shrink: 0;
 }
 
 .media-player:hover {