From 33f79c2a9ee3cb6bced94399f86a10c366a82cfd Mon Sep 17 00:00:00 2001
From: Cameron Otsuka <cameron@otsuka.haus>
Date: Wed, 10 Dec 2025 16:29:52 -0800
Subject: [PATCH] use serif font for main body text

---
 bun.lock                        | 7 +++++--
 package.json                    | 1 +
 src/components/footer.astro     | 1 +
 src/components/navigation.astro | 1 +
 src/layouts/base.astro          | 1 +
 src/styles/style.css            | 4 ++--
 6 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/bun.lock b/bun.lock
index 28378c5..bf59ce8 100644
--- a/bun.lock
+++ b/bun.lock
@@ -11,17 +11,18 @@
         "@astrojs/sitemap": "3.6.0",
         "@fontsource-variable/public-sans": "^5.2.7",
         "@fontsource-variable/source-code-pro": "^5.2.7",
+        "@fontsource-variable/source-serif-4": "^5.2.9",
         "@iconify-json/mdi": "^1.2.3",
         "@vercel/og": "^0.8.5",
         "astro": "5.16.3",
         "astro-icon": "^1.1.5",
         "react": "^19.2.0",
         "react-dom": "^19.2.0",
-        "recharts": "^3.5.0",
+        "recharts": "^3.5.1",
       },
       "devDependencies": {
         "@types/bun": "^1.3.3",
-        "@types/react": "^19.2.6",
+        "@types/react": "^19.2.7",
         "@types/react-dom": "^19.2.3",
       },
     },
@@ -145,6 +146,8 @@
 
     "@fontsource-variable/source-code-pro": ["@fontsource-variable/source-code-pro@5.2.7", "", {}, "sha512-kZ0VNwnhvSA7vu5MaiO52eicQ4zC+k+8HBLZb+1js0MK/RngLy25NEUFB1y/AKd0ZMwru88T433QBcFf9m/huw=="],
 
+    "@fontsource-variable/source-serif-4": ["@fontsource-variable/source-serif-4@5.2.9", "", {}, "sha512-PPcxjLFk/fS0WHg79pDM2YNvz61kC+oYZ5cWZZyCS0DHpJncmuYOuiZAsvj4tDxlWPBEvxxcRLQQNmSaRbPkqw=="],
+
     "@iconify-json/mdi": ["@iconify-json/mdi@1.2.3", "", { "dependencies": { "@iconify/types": "*" } }, "sha512-O3cLwbDOK7NNDf2ihaQOH5F9JglnulNDFV7WprU2dSoZu3h3cWH//h74uQAB87brHmvFVxIOkuBX2sZSzYhScg=="],
 
     "@iconify/tools": ["@iconify/tools@4.1.4", "", { "dependencies": { "@iconify/types": "^2.0.0", "@iconify/utils": "^2.3.0", "@types/tar": "^6.1.13", "axios": "^1.12.1", "cheerio": "1.0.0", "domhandler": "^5.0.3", "extract-zip": "^2.0.1", "local-pkg": "^0.5.1", "pathe": "^1.1.2", "svgo": "^3.3.2", "tar": "^6.2.1" } }, "sha512-s6BcNUcCxQ3S6cvhlsoWzOuBt8qKXdVyXB9rT57uSJ/ARHD7dVM43+5ERBWn3tmkMWXeJ/s9DPVc3dUasayzeA=="],
diff --git a/package.json b/package.json
index b5ba782..d900be7 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "@astrojs/sitemap": "3.6.0",
     "@fontsource-variable/public-sans": "^5.2.7",
     "@fontsource-variable/source-code-pro": "^5.2.7",
+    "@fontsource-variable/source-serif-4": "^5.2.9",
     "@iconify-json/mdi": "^1.2.3",
     "@vercel/og": "^0.8.5",
     "astro": "5.16.3",
diff --git a/src/components/footer.astro b/src/components/footer.astro
index 4d71806..80ea831 100644
--- a/src/components/footer.astro
+++ b/src/components/footer.astro
@@ -23,6 +23,7 @@ const currentYear = new Date().getFullYear();
 
 <style>
     footer {
+        font-family: "Public Sans Variable", sans-serif;
         text-align: center;
     }
     menu {
diff --git a/src/components/navigation.astro b/src/components/navigation.astro
index a63792e..51cf346 100644
--- a/src/components/navigation.astro
+++ b/src/components/navigation.astro
@@ -13,6 +13,7 @@ import { menuItems } from '@utils/globals.ts';
 
 <style>
     nav {
+        font-family: "Public Sans Variable", sans-serif;
         margin-bottom: 1rem;
     }
     menu {
diff --git a/src/layouts/base.astro b/src/layouts/base.astro
index 421759b..7bf66ad 100644
--- a/src/layouts/base.astro
+++ b/src/layouts/base.astro
@@ -2,6 +2,7 @@
 import '@styles/reset.css';
 import '@fontsource-variable/public-sans';
 import '@fontsource-variable/source-code-pro';
+import '@fontsource-variable/source-serif-4';
 import '@styles/style.css';
 import HeadBase from '@components/head/base.astro';
 import HeadPage from '@components/head/page.astro';
diff --git a/src/styles/style.css b/src/styles/style.css
index 893b7c9..d04206d 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -9,8 +9,7 @@
 html {
   background-color: light-dark(#ffffff, #000000);
   color: light-dark(#000000, #ffffff);
-  font-family: "Public Sans Variable", sans-serif;
-  font-feature-settings: "kern" 1, "kern";
+  font-family: "Source Serif 4 Variable", serif;
   font-kerning: normal;
   font-weight: 400;
   font-size: 100%;
@@ -25,6 +24,7 @@ body {
   line-height: 1.6;
 }
 h1, h2, h3, h4, h5, h6 {
+  font-family: "Public Sans Variable", sans-serif;
   font-weight: 700;
 }
 strong {
-- 
2.52.0