fix(style): on mobile, main content can scroll up beyond header

aiktb · Oct 23, 2024 · c0d0a2a · c0d0a2a
1 parent 058a958
commit c0d0a2a
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/app/routes/_index.tsx b/app/routes/_index.tsx
@@ -39,9 +39,9 @@ export default function Index() {
   const ast = parse(code);
 
   return (
-    <div className="relative h-screen">
-      <Header className="sticky top-0 z-20 h-12 w-full" />
-      <main className="h-[calc(100%-48px)] overflow-scroll">
+    <div className="relative grid h-dvh grid-rows-[3rem,_1fr]">
+      <Header className="sticky top-0 z-20 w-full" />
+      <main className="overflow-scroll">
         <ResizablePanelGroup direction="horizontal" className="w-full overflow-scroll">
           <ResizablePanel defaultSize={50}>
             <div className="h-full items-center justify-center p-6">