Adjust stats header layout

packages/stats/app/src/routes/index.css

@@ -72,7 +72,6 @@
   min-height: 100vh;
   display: flex;
   flex-direction: column;
-  gap: 4rem;
   font-synthesis: none;
   overflow-x: clip;
   padding-bottom: 5rem;
@@ -89,10 +88,8 @@
 [data-page="stats"] [data-component="container"] {
   box-sizing: border-box;
   width: 100%;
-  max-width: calc(80rem + 2px);
+  max-width: 80rem;
   margin: 0 auto;
-  border-left: 1px solid var(--stats-line);
-  border-right: 1px solid var(--stats-line);
 }
 
 [data-page="stats"] [data-component="top"] {
@@ -377,6 +374,7 @@
   display: flex;
   justify-content: center;
   gap: 32px;
+  margin-top: 4rem;
   color: var(--stats-faint);
   text-align: center;
   font-family:
@@ -1515,12 +1513,6 @@
   }
 }
 
-@media (max-width: 80rem) {
-  [data-page="stats"] [data-component="container"] {
-    border: 0;
-  }
-}
-
 @media (min-width: 48rem) {
   [data-page="stats"] [data-slot="header-button"][data-variant="neutral"] {
     display: inline-flex;

packages/stats/app/src/routes/index.tsx

@@ -72,8 +72,8 @@ export default function StatsHome() {
       <Link rel="preload" href={ibmPlexMonoMediumLatin1} as="font" type="font/woff2" crossorigin="anonymous" />
       <Link rel="preload" href={ibmPlexMonoSemiBoldLatin1} as="font" type="font/woff2" crossorigin="anonymous" />
       <Link rel="preload" href={ibmPlexMonoBoldLatin1} as="font" type="font/woff2" crossorigin="anonymous" />
+      <Header />
       <div data-component="container">
-        <Header />
         <div data-component="content">
           <Show when={data()} fallback={<StatsLoading />}>
             {(stats) => (