Merge pull request #98 from primev/infinite-scroll

fix: use dynamic viewport height to prevent mobile infinite scroll

Author: passandscore

src/app/(app)/layout.tsx

@@ -164,9 +164,9 @@ function AppLayoutContent({ children }: { children: React.ReactNode }) {
 
   if (hideLayout) {
     return (
-      <div className="relative min-h-screen">
+      <div className="relative h-dvh overflow-hidden">
         <AnimatedBackground />
-        <div className="relative z-10">{children}</div>
+        <div className="relative z-10 h-full">{children}</div>
       </div>
     )
   }

src/components/landing/Page.tsx

@@ -176,7 +176,7 @@ const IndexPage = ({
   }, [isConnected, address, tokenId, isLoadingTokenId, router])
 
   return (
-    <div className="relative h-screen flex flex-col overflow-hidden bg-background">
+    <div className="relative h-dvh flex flex-col overflow-hidden bg-background">
       <AnimatedBackground />
       <div className="relative z-10 w-full px-4 flex-1 flex flex-col justify-between py-4 sm:py-6 tablet:py-8 lg:py-6">
         <div className="max-w-6xl mx-auto w-full text-center flex-1 flex flex-col justify-between">