From a51112d87726c2902c06806c11bafcaa2bbb11c7 Mon Sep 17 00:00:00 2001
From: Ben Senescu <44480372+bensenescu@users.noreply.github.com>
Date: Mon, 16 Mar 2026 18:09:06 -0400
Subject: [PATCH] website: fix styling (#34)

* website: apply theme colors to root body

* website: fix privacy page contrast in dark mode
---
 web/src/routes/__root.tsx  | 2 +-
 web/src/routes/privacy.tsx | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)
diff --git a/web/src/routes/__root.tsx b/web/src/routes/__root.tsx
index cbc73a1..98c32a0 100644
--- a/web/src/routes/__root.tsx
+++ b/web/src/routes/__root.tsx
@@ -47,7 +47,7 @@ function RootDocument({ children }: { children: React.ReactNode }) {
           }}
         />
       </head>
-      <body className="flex flex-col min-h-screen bg-white">
+      <body className="flex flex-col min-h-screen bg-fd-background text-fd-foreground">
         <RootProvider>{children}</RootProvider>
         <Scripts />
       </body>
diff --git a/web/src/routes/privacy.tsx b/web/src/routes/privacy.tsx
index 5b5a815..dfa336b 100644
--- a/web/src/routes/privacy.tsx
+++ b/web/src/routes/privacy.tsx
@@ -14,14 +14,14 @@ export const Route = createFileRoute("/privacy")({
 
 function Privacy() {
   return (
-    <div>
-      <header className="px-6 py-4 border-b border-zinc-200">
-        <Link to="/" className="font-semibold text-zinc-900 hover:opacity-80">
+    <div className="bg-fd-background text-fd-foreground min-h-screen">
+      <header className="px-6 py-4 border-b border-fd-border">
+        <Link to="/" className="font-semibold text-fd-foreground hover:opacity-80">
           OpenRank
         </Link>
       </header>
 
-      <article className="max-w-3xl mx-auto px-6 py-12 md:py-24 prose prose-gray text-zinc-900 prose-headings:text-zinc-900 prose-p:text-zinc-700 prose-a:text-zinc-900">
+      <article className="max-w-3xl mx-auto px-6 py-12 md:py-24 prose prose-neutral dark:prose-invert text-fd-foreground prose-headings:text-fd-foreground prose-p:text-fd-muted-foreground prose-a:text-fd-foreground">
         <h1>Privacy Policy</h1>
         <p className="text-fd-muted-foreground">Last updated: March 2026</p>
 
