rework home page

src/components/Footer.astro

@@ -11,7 +11,7 @@
     color: var(--text-secondary);
     font-size: .8em;
     margin: 1em auto;
-    max-width: 1400px;
+    max-width: var(--wrap);
     padding: 1em 2em;
     text-align: center;
     width: 100%;

src/components/Header.astro

@@ -9,7 +9,7 @@ const { current = '' } = Astro.props;
   header {
     display: flex;
     margin: 0 auto;
-    max-width: 1400px;
+    max-width: var(--wrap);
     padding: 1em;
     width: 100%;
   }

src/components/Logo.astro

@@ -6,7 +6,7 @@ const { width, height } = Astro.props;
 ---
 
 <a href="/">
-  <Image src={logoImage} alt="Logo displaying a stylized character with brown hair wearing purple hoodie on a light blue circle background" width={width} height={height}/>
+  <Image src={logoImage} alt="Logo displaying a stylized character with brown hair wearing purple hoodie on a light blue circle background" width={width} height={height} loading="eager"/>
 </a>
 
 <style>

src/components/Nav.astro

@@ -76,7 +76,6 @@ const { current = '' } = Astro.props;
 <nav>
   <div class="nav-buttons">
     <a data-astro-prefetch class={current === "" ? "selected" : ""} href='/'>home</a>
-    <a data-astro-prefetch class={current === "about" ? "selected" : ""} href='/about'>about</a>
     <a data-astro-prefetch class={current === "projects" ? "selected" : ""} href='/projects'>projects</a>
     <a data-astro-prefetch class={current === "blog" ? "selected" : ""} href='/blog'>blog</a>
   </div>