Build the Astro site UI

src/components/Footer.astro

@@ -0,0 +1,32 @@
+---
+import { navItems, site } from '../lib/site';
+
+const year = new Date().getFullYear();
+
+// Footer shows all nav items except Home (which is implicit via the site title).
+const footerNavItems = navItems.filter((item) => item.href !== '/');
+---
+
+<footer class="site-footer">
+  <nav aria-label="Footer">
+    <ul class="footer-links">
+      {
+        footerNavItems.map((item) => (
+          <li>
+            <a href={item.href}>{item.label}</a>
+          </li>
+        ))
+      }
+    </ul>
+  </nav>
+  <div class="footer-meta">
+    <span>© {year} {site.name}</span>
+    {/* address wraps only the author's contact details, per HTML spec. */}
+    <address class="footer-contact">
+      <a href={`mailto:${site.email}`}>Email</a>
+      <a href={site.cv} rel="noopener">CV</a>
+      <a href={site.github} rel="noopener me">GitHub</a>
+      <a href={site.linkedin} rel="noopener me">LinkedIn</a>
+    </address>
+  </div>
+</footer>