zias/kunstenkamp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:mobile hero view

Browse Source
This commit is contained in:
ッ
2026-03-02 15:13:19 +01:00
parent 973b07e177
commit 5d8c3b3e77
1 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
apps/web/src/components/homepage/Hero.tsx
View File

@@ -14,12 +14,18 @@ export default function Hero() {
const scrollToRegistration = () => { const scrollToRegistration = () => {
const registrationSection = document.getElementById("registration"); const registrationSection = document.getElementById("registration");
if (registrationSection) { if (registrationSection) {
// Temporarily disable scroll-snap to prevent snap-back on mobile
document.documentElement.style.scrollSnapType = "none";
registrationSection.scrollIntoView({ behavior: "smooth" }); registrationSection.scrollIntoView({ behavior: "smooth" });
// Re-enable scroll-snap after smooth scroll completes
setTimeout(() => {
document.documentElement.style.scrollSnapType = "";
}, 800);
} }
}; };
return ( return (
<section className="snap-section relative h-screen w-full overflow-hidden bg-white"> <section className="snap-section relative h-[100dvh] w-full overflow-hidden bg-white">
{/* Desktop Layout - hidden on mobile */} {/* Desktop Layout - hidden on mobile */}
<div className="relative hidden h-full w-full flex-col gap-[10px] p-[10px] lg:flex"> <div className="relative hidden h-full w-full flex-col gap-[10px] p-[10px] lg:flex">
{/* Desktop Microphone - positioned on top of top sections, under bottom sections */} {/* Desktop Microphone - positioned on top of top sections, under bottom sections */}
@@ -150,7 +156,7 @@ export default function Hero() {
</div> </div>
{/* Mobile CTA */} {/* Mobile CTA */}
<div className="px-[10px] pb-[10px]"> <div className="px-[10px] pb-[calc(10px+env(safe-area-inset-bottom))]">
<button <button
onClick={scrollToRegistration} onClick={scrollToRegistration}
type="button" type="button"