refactor: redesign home page, remove old video pages, migrate to @tailwindcss/typography

- Replace root page with new (home) route featuring a project showcase (Domainstack, Sofa, Versioneer, Snoozle)
- Remove /birthday and /hillary video pages
- Replace custom hand-rolled .prose styles with @tailwindcss/typography via a .markdown utility class
- Remove heading-anchor component and .nvmrc

components/layout/footer.tsx

@@ -3,7 +3,7 @@ import Link from "next/link";
 import siteConfig from "@/lib/config/site";
 
 const Footer = () => (
-  <footer className="text-muted-foreground mt-8 w-full py-6 text-center text-[13px] leading-loose">
+  <footer className="text-muted-foreground border-border mt-8 w-full border-t py-6 text-xs leading-loose">
     All content is licensed under{" "}
     <Link href="/license" className="underline underline-offset-4">
       {siteConfig.license}

components/layout/header.tsx

@@ -39,11 +39,11 @@ const Header = ({ className }: { className?: string }) => {
         "motion-safe:transition-[background-color,backdrop-filter,border-color] motion-safe:duration-200",
         "bg-background/0 backdrop-blur-none",
         "data-[scrolled=true]:bg-background/80 data-[scrolled=true]:backdrop-blur-md",
-        "data-[scrolled=true]:border-border/50 data-[scrolled=true]:border-b",
+        "data-[scrolled=true]:border-border/70 data-[scrolled=true]:border-b",
         className,
       )}
     >
-      <header className="mx-auto mt-2 flex w-full max-w-[720px] items-center justify-between px-5 py-4">
+      <header className="mt-2 flex w-full items-center justify-between py-4">
         <div className="flex items-center gap-3">
           <Link
             href="/"
@@ -64,14 +64,14 @@ const Header = ({ className }: { className?: string }) => {
               {siteConfig.name}
             </span>
           </Link>
-          <Separator orientation="vertical" className="!h-6" />
+          <Separator orientation="vertical" className="!h-7" />
           <Menu />
         </div>
 
         <div className="flex items-center gap-2.5">
           <Button
             variant="ghost"
-            size="sm"
+            size="icon"
             nativeButton={false}
             aria-label="Email Me"
             render={<a href={`mailto:${authorConfig.email}`} />}
@@ -80,7 +80,7 @@ const Header = ({ className }: { className?: string }) => {
           </Button>
           <Button
             variant="ghost"
-            size="sm"
+            size="icon"
             nativeButton={false}
             aria-label="Open GitHub profile"
             render={
@@ -95,7 +95,7 @@ const Header = ({ className }: { className?: string }) => {
           </Button>
           <Button
             variant="ghost"
-            size="sm"
+            size="icon"
             onClick={() => setTheme(theme === "light" ? "dark" : "light")}
             aria-label="Toggle theme"
             className="group"

components/layout/menu.tsx

@@ -32,7 +32,7 @@ const Menu = () => {
             nativeButton={false}
             aria-label={item.text}
             data-current={isCurrent || undefined}
-            className="data-current:bg-accent/60 data-current:text-accent-foreground text-[15px] leading-none"
+            className="data-current:bg-accent/60 data-current:text-accent-foreground text-sm leading-none"
             render={<Link href={item.href} />}
           >
             {item.text}