fix(web): add safe-area-inset-top padding to prevent statusbar overlap on iOS PWA

This fixes an issue where viewport-fit=cover and black-translucent statusbar
configuration allowed content to extend under the iOS statusbar. Added env(safe-area-inset-top)
CSS handling to all main layout components:
- SessionHeader with pt-[env(safe-area-inset-top)]
- SessionsPage, MachinesPage, SpawnPage with safe-area padding
- FilesPage and FilePage headers with safe-area padding
This commit is contained in:
weishu
2025-12-21 18:50:40 +08:00
parent 4f03f29ac3
commit a665386f05
4 changed files with 6 additions and 6 deletions
+1 -1
View File
@@ -49,7 +49,7 @@ export function SessionHeader(props: {
}
return (
<div className="bg-[var(--app-bg)]">
<div className="bg-[var(--app-bg)] pt-[env(safe-area-inset-top)]">
<div className="mx-auto w-full max-w-[720px] flex items-center gap-2 p-3">
{/* Back button */}
<button