Fix mobile flyout

This commit is contained in:
2026-03-22 19:51:02 +01:00
parent 00074e408f
commit 7e4cf8f06b
2 changed files with 9 additions and 8 deletions

View File

@@ -14,9 +14,7 @@ const positionFlyover = (trigger) => {
const panelHeight = flyoverPanel.offsetHeight; const panelHeight = flyoverPanel.offsetHeight;
if (isMobile) { if (isMobile) {
const maxTop = Math.max(gap, window.innerHeight - panelHeight - gap); flyover.style.removeProperty("--flyover-top");
const top = Math.min(rect.bottom + gap, maxTop);
flyover.style.setProperty("--flyover-top", `${Math.max(gap, top)}px`);
flyover.style.removeProperty("--flyover-left"); flyover.style.removeProperty("--flyover-left");
return; return;
} }

View File

@@ -889,13 +889,16 @@ button {
} }
.contact-flyover__panel { .contact-flyover__panel {
top: var(--flyover-top, auto); top: auto;
right: auto; right: 1rem;
bottom: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
left: 1rem; left: 1rem;
width: auto; width: calc(100vw - 2rem);
max-height: calc(100dvh - 2rem); max-width: calc(100vw - 2rem);
max-height: calc(100dvh - 7rem - env(safe-area-inset-bottom, 0px));
padding: 1.5rem; padding: 1.5rem;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
} }
.contact-item { .contact-item {