Add site footer and switch display font to Sora, bump to 0.5.0

Adds a Footer component (credit line, repo/buttplug.io links) below main content on all app pages, with the layout shell now flex-column so it sticks to the bottom on short pages. Also swaps the display font from Space Grotesk to Sora (after trying Fraunces, a serif, which didn't fit). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-08-26 19:02:09 +02:00
parent c46adf788f
commit 2a3c4ff1f2
4 changed files with 40 additions and 6 deletions
@@ -1,14 +1,16 @@
 import { NavBar } from "@/components/layout/NavBar";
 import { Breadcrumbs } from "@/components/layout/Breadcrumbs";
+import { Footer } from "@/components/layout/Footer";

 export default function AppLayout({ children }: { children: React.ReactNode }) {
  return (
-    <div className="min-h-dvh">
+    <div className="flex min-h-dvh flex-col">
      <NavBar />
-      <main className="mx-auto max-w-6xl px-4 py-8">
+      <main className="mx-auto w-full max-w-6xl flex-1 px-4 py-8">
        <Breadcrumbs />
        {children}
      </main>
+      <Footer />
    </div>
  );
 }
@@ -1,12 +1,12 @@
 import type { Metadata } from "next";
 import "./globals.css";
-import { Inter, Space_Grotesk, JetBrains_Mono } from "next/font/google";
+import { Inter, Sora, JetBrains_Mono } from "next/font/google";
 import { cn } from "@/lib/utils";
 import { ThemeProvider } from "@/components/layout/ThemeProvider";
 import { Toaster } from "@/components/ui/sonner";

 const inter = Inter({ subsets: ["latin"], variable: "--font-sans" });
-const spaceGrotesk = Space_Grotesk({ subsets: ["latin"], variable: "--font-display" });
+const sora = Sora({ subsets: ["latin"], variable: "--font-display" });
 const jetbrainsMono = JetBrains_Mono({ subsets: ["latin"], variable: "--font-mono" });

 export const metadata: Metadata = {
@@ -19,7 +19,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
    <html
      lang="en"
      suppressHydrationWarning
-      className={cn("font-sans", inter.variable, spaceGrotesk.variable, jetbrainsMono.variable)}
+      className={cn("font-sans", inter.variable, sora.variable, jetbrainsMono.variable)}
    >
      <body>
        <ThemeProvider attribute="class" defaultTheme="dark" enableSystem disableTransitionOnChange>
@@ -0,0 +1,32 @@
+export function Footer() {
+  const year = new Date().getFullYear();
+
+  return (
+    <footer className="mx-auto w-full max-w-6xl px-4 py-6">
+      <div className="flex flex-col items-center gap-1 text-center text-xs text-muted-foreground">
+        <p>
+          Made with <span aria-hidden="true">💜</span> by{" "}
+          <a
+            href="https://dev.pivoine.art/valknar/sexy"
+            target="_blank"
+            rel="noreferrer noopener"
+            className="underline underline-offset-2 hover:text-foreground"
+          >
+            Valknar
+          </a>
+        </p>
+        <p>
+          &copy; {year} Sexy · Powered by{" "}
+          <a
+            href="https://buttplug.io/"
+            target="_blank"
+            rel="noreferrer noopener"
+            className="underline underline-offset-2 hover:text-foreground"
+          >
+            Buttplug.io
+          </a>
+        </p>
+      </div>
+    </footer>
+  );
+}
@@ -1,6 +1,6 @@
 {
  "name": "sexy",
-  "version": "0.4.0",
+  "version": "0.5.0",
  "private": true,
  "scripts": {
    "dev": "next dev",