From f411e49e4c4c9685e96999456f95f371d46e3891 Mon Sep 17 00:00:00 2001 From: Jonathan Sykes Date: Tue, 22 Sep 2026 14:44:30 +0800 Subject: [PATCH] Floor the party panel and rail above the bottom nav in CSS so a bad measurement cannot hide their controls --- frontend/styles.css | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/frontend/styles.css b/frontend/styles.css index 0a0a1c5..5748552 100755 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -4076,9 +4076,21 @@ body.landscape-fs .player-stage { touch-action: none; } /* fullscreen (real or t the panel inside the viewport instead of growing off the top. */ .party-panel { left: 8px; right: 8px; width: auto; top: auto; - bottom: calc(var(--bottom-chrome, 88px) + 8px); + /* NEVER trust the measurement alone: take whichever is larger, the value + SectionRail measured (it also covers the mini player) or a CSS floor of + one bottom-nav plus the home-indicator inset. A JS value that is stale, + zero, or from a cached old shell can then no longer hide the panel's + tail behind the nav — which is what kept eating "End the party". */ + bottom: calc(max(var(--bottom-chrome, 0px), 96px + env(safe-area-inset-bottom)) + 8px); height: auto; - max-height: min(62vh, calc(100vh - var(--bottom-chrome, 88px) - 96px)); + max-height: min(62vh, calc(100vh - max(var(--bottom-chrome, 0px), 96px + env(safe-area-inset-bottom)) - 96px)); + /* Safety net: without this the body's children render OUTSIDE the panel + box when the measurement is off, and the bottom nav (z-index 310) paints + over them — which is exactly how "End the party" went missing. Clipping + here forces the overflow into .pt-body, which scrolls. The fallback is + deliberately generous (a nav + home indicator) so an unmeasured phone + errs on the safe side. */ + overflow: hidden; } .party-panel.min { height: auto; max-height: none; } /* Whatever the content, the panel scrolls rather than hiding its own tail. */ @@ -4248,7 +4260,7 @@ body.landscape-fs .player-stage { touch-action: none; } /* fullscreen (real or t them and overrides --rail-bottom; this is only the pre-measure default. */ .sec-rail { top: auto; - bottom: var(--rail-bottom, calc(var(--bottom-chrome, 88px) + 14px)); + bottom: max(var(--rail-bottom, 0px), calc(96px + env(safe-area-inset-bottom) + 14px)); transform: none; } }