fix(routes/index): do not center map to viewport

This patch updates the homepage to simply follow standard HTML flow and
avoid centering the map to the user's entire viewport height. Instead,
it is only centered along the x-axis and the position of the hero text
aligns with the positioning of the login and join pages.

Author: nicholaschiang

app/routes/_index/route.tsx

@@ -66,17 +66,17 @@ export async function loader() {
 
 export default function HomePage() {
   return (
-    <main className='flex flex-col w-screen h-screen overflow-hidden'>
-      <Header className='flex-none' />
-      <section className='h-0 grow flex flex-col items-center justify-center p-6 mx-auto max-w-screen-xl w-full'>
-        <header className='flex items-center gap-1.5 text-lg tracking-tighter'>
+    <>
+      <Header />
+      <section className='p-6 mt-6 mx-auto max-w-screen-xl w-full'>
+        <header className='flex items-center justify-center gap-1.5 sm:gap-2 text-xl sm:text-2xl tracking-tighter'>
           <h1>dolce</h1>
           <span aria-hidden>·</span>
           <h2>the worldwide fashion database</h2>
         </header>
         <Map className='w-full' />
       </section>
-    </main>
+    </>
   )
 }