josh/ytplayer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Floor the party panel and rail above the bottom nav in CSS so a bad measurement cannot hide their controls

Browse Source
This commit is contained in:
Jonathan Sykes
2026-09-22 14:44:30 +08:00
parent aa92fb1f05
commit f411e49e4c
1 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/styles.css
View File

@@ -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;
}
}