fix(homepage): hero grid layout

ensure hero and recent proposals are in in the centre of each column
within the container

src/routes/+page.svelte

@@ -28,10 +28,11 @@
   </div>
 </div>
 
-<div class="my-8 flex flex-row">
+<Container>
-  <div class="justify-right flex items-center">
+  <div class="mx-auto my-8 grid gap-4 md:grid-cols-2">
+    <div class="items">
       <div class="align-center hero-content text-center">
-      <div class="max-w-md">
+        <div class="max-w-lg">
           <div class="prose">
             <h1 class="mb-2">
               <span class="text-purple-600">git</span><span class="text-white"
@@ -67,13 +68,15 @@
           </div>
           <button
             on:click={() =>
-            alert('install ngit and run `ngit init` your local git repository')}
+              alert(
+                'install ngit and run `ngit init` your local git repository'
+              )}
             class="btn btn-secondary">list your repository</button
           >
         </div>
       </div>
     </div>
-  <div class="hero md:basis-1/2">
+    <div class="hero">
       <ProposalsList
         title="Recent Proposals"
         proposals_or_issues={$proposal_summaries.summaries}
@@ -83,7 +86,9 @@
         allow_more={true}
       />
     </div>
-</div>
+  </div>
+</Container>
+
 <Container>
   <ReposRecent />
 </Container>