diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/routes/+layout.svelte | 37 |
1 files changed, 15 insertions, 22 deletions
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 76db8abe..4317a6a2 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -16,16 +16,6 @@ ? `http://${PUBLIC_DOMAIN}` : `https://${PUBLIC_DOMAIN}`; - function getSafeInsetTop() { - const div = document.createElement("div"); - div.style.cssText = "position:absolute;top:0;padding-top:env(safe-area-inset-top);"; - document.body.appendChild(div); - const computed = getComputedStyle(div).paddingTop; - document.body.removeChild(div); - const px = parseInt(computed, 10); - return isNaN(px) ? 24 : px; - } - onMount(() => { if (!browser) return; @@ -35,11 +25,18 @@ $installPrompt = event; }); - // Fix: Apply top padding manually for Android WebView - const insetTop = getSafeInsetTop(); - const main = document.querySelector("main"); - if (main && insetTop > 0) { - main.style.paddingTop = `${insetTop}px`; + if (typeof window.AndroidNotch !== "undefined") { + window.AndroidNotch.getInsetTop( + (px) => { + document.documentElement.style.setProperty( + "--safe-area-inset-top", + px + "px", + ); + }, + (err) => { + console.error("Failed to get notch inset:", err); + }, + ); } }); </script> @@ -75,15 +72,11 @@ --toastContainerBottom: 8rem; --toastContainerLeft: calc(50vw - 8rem); --toastBackground: #292929; - } - main { - padding-top: env(safe-area-inset-top, 24px); + --safe-area-inset-top: 24px; } - @supports not (padding-top: env(safe-area-inset-top)) { - main { - padding-top: 24px; - } + main { + padding-top: var(--safe-area-inset-top); } </style> |