From 00c56b0dd5e441d680e92517ca7075540c40478e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= Date: Wed, 11 Nov 2026 20:43:46 +0100 Subject: [PATCH] fix(pwa): keep the status bar readable in the light theme The installed iOS app uses the `black-translucent` status bar, which always draws white text, and the shell painted the strip behind it in the card colour. In the light theme that is near-white, so the clock and battery vanished. The light theme now paints the strip in its dark ink; the dark theme is unchanged. --- src/app/globals.css | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/app/globals.css b/src/app/globals.css index 979d6311e..2763134c3 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -724,6 +724,16 @@ body, } } + /* + * The installed iOS app runs with `black-translucent` (`layout.tsx`), which + * always draws the clock and battery in white. Over the light theme's card + * colour they disappear, so the light theme paints the strip in its dark + * ink instead. + */ + :root.light .shell-safe-area { + background-image: linear-gradient(var(--foreground), var(--foreground)); + } + /* * The on-screen keyboard. iOS Safari, and Chrome on Android by default, * shrink only the visual viewport when the keyboard opens: everything