Web frontend: phone header glass and full-height stage

On an iPhone the sticky group switch sat on a fixed teal fade, which was the
wrong colour as soon as the ambience took on another album's tint (brown for
Conni). It is now a neutral frosted blur that fades out, so it suits whatever
is playing, and it reaches up under the status bar so scrolled content never
shows behind the clock.

After the search keyboard had been up, 100dvh in the home-screen app came back
a status bar short and the white page showed as a strip along the bottom. On
phones the stage is pinned to the viewport edges instead, with the sea colour
behind it.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-02 22:45:52 +02:00
parent 6981890be0
commit 21d65cad9e
2 changed files with 49 additions and 7 deletions

View File

@@ -446,6 +446,7 @@ export function App() {
return (
<div
className="stage"
data-phone={phone || undefined}
data-blur={SHOW_GLASS_BLUR ? undefined : "off"}
data-cardblur={SHOW_CARD_BLUR ? undefined : "off"}
>