fix(odin): kill body scroll on immersive mobile (MIUI dvh quirk)
Xiaomi Chrome keeps 100dvh at the large-viewport size while the URL bar overlays the page, so the shell's 100dvh min-height left the document one bar-height taller than the screen (scrollable + a strip under the composer). The immersive route now sizes the document to exactly 100svh with hidden overflow down the chain — body scroll is impossible regardless of the browser's dvh interpretation. Other routes unchanged. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -79,13 +79,22 @@ export default function AppShell() {
|
||||
duration: loggingOut ? 0.4 : 0.25,
|
||||
ease: [0.4, 0, 0.2, 1],
|
||||
}}
|
||||
style={{ minHeight: "100dvh" }}
|
||||
>
|
||||
<Box
|
||||
sx={{
|
||||
display: "flex",
|
||||
minHeight: "100dvh",
|
||||
bgcolor: "background.default",
|
||||
// Immersive mobile pages must make the DOCUMENT exactly the
|
||||
// small-viewport height and clip it: MIUI/Xiaomi Chrome keeps
|
||||
// 100dvh at the large-viewport size while the URL bar overlays,
|
||||
// so a 100dvh min-height leaves the page scrollable by the bar
|
||||
// height (invisible in desktop emulation). svh + hidden overflow
|
||||
// makes body scroll impossible regardless of dvh interpretation.
|
||||
minHeight: immersiveOnMobile ? { xs: 0, md: "100dvh" } : "100dvh",
|
||||
...(immersiveOnMobile && {
|
||||
height: { xs: "100svh", md: "auto" },
|
||||
overflow: { xs: "hidden", md: "visible" },
|
||||
}),
|
||||
}}
|
||||
>
|
||||
<Drawer
|
||||
@@ -128,6 +137,7 @@ export default function AppShell() {
|
||||
sx={{
|
||||
flex: 1,
|
||||
minWidth: 0,
|
||||
minHeight: 0,
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
}}
|
||||
@@ -173,6 +183,10 @@ export default function AppShell() {
|
||||
flex: 1,
|
||||
px: immersiveOnMobile ? { xs: 0, md: 3 } : { xs: 2, md: 3 },
|
||||
pb: immersiveOnMobile ? { xs: 0, md: 4 } : 4,
|
||||
...(immersiveOnMobile && {
|
||||
minHeight: 0,
|
||||
overflow: { xs: "hidden", md: "visible" },
|
||||
}),
|
||||
}}
|
||||
>
|
||||
<Outlet />
|
||||
|
||||
Reference in New Issue
Block a user