fix fonts and text sizes

earth-walker · earth-walker · commit 3aef49c577dc · 2026-01-29T20:26:36.000-05:00
diff --git a/website/package-lock.json b/website/package-lock.json
diff --git a/website/package.json b/website/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@astrojs/svelte": "^7.2.3",
+    "@fontsource/inter": "^5.2.8",
     "@fontsource/open-sans": "^5.2.7",
     "@fontsource/ramaraja": "^5.2.8",
     "@tailwindcss/vite": "^4.1.17",
diff --git a/website/src/components/Contact.astro b/website/src/components/Contact.astro
@@ -40,7 +40,7 @@ import wedge from "../assets/backgrounds/wedge.svg";
               placeholder="Your message"></textarea>
           </div>
           <input
-            class="px-6 py-2 pt-3 mt-3 font-serif bg-green-300 rounded-full text-lg cursor-pointer"
+            class="px-6 py-2 pt-3 mt-3 font-serif bg-green-300 rounded-full text-xl cursor-pointer"
             type="submit"
             value="Submit"
             size=""
diff --git a/website/src/components/Footer.astro b/website/src/components/Footer.astro
@@ -1,7 +1,5 @@
 <footer class="py-12 text-center flex flex-col gap-3 bg-green-300">
-  <a class="underline text-lg" href=`${import.meta.env.BASE_URL}/#top`
-    >Return to top</a
-  >
-  <p class="text-2xl! font-serif">Benefit Decision Toolkit</p>
+  <a class="underline" href=`${import.meta.env.BASE_URL}/#top`>Return to top</a>
+  <p class="text-2xl! font-serif mt-2">Benefit Decision Toolkit</p>
   <p>With ❤️ from Philly</p>
 </footer>
diff --git a/website/src/components/Hero.astro b/website/src/components/Hero.astro
@@ -8,16 +8,16 @@ import { Content } from "../assets/copy/Hero.md";
 >
   <div class="max-w-[130ch] mx-auto mt-20">
     <div
-      class="prose prose-p:text-slate-100 prose-headings:text-slate-100 prose-headings:text-left max-w-120 prose-p:text-shadow-sm/35 prose-p:text-2xl! prose-p:leading-8! prose-headings:text-shadow-lg/15"
+      class="prose prose-p:text-slate-100 prose-headings:text-slate-100 prose-headings:text-left max-w-120 prose-p:text-shadow-sm/35 prose-p:text-xl! prose-p:leading-7! prose-headings:text-shadow-lg/15"
     >
       <Content />
     </div>
     <a href=`${import.meta.env.BASE_URL}/#projects`>
-      <p
-        class="mt-6 w-fit px-6 py-2 pt-3 bg-white border-2 border-sky-500 rounded-full text-sky-700! font-serif"
+      <div
+        class="mt-6 w-fit px-6 py-2 pt-3 bg-white border-2 border-sky-500 rounded-full text-sky-700 font-serif text-xl"
       >
-        See what we can do
-      </p>
+        <span>See what we can do</span>
+      </div>
     </a>
   </div>
 </section>
diff --git a/website/src/components/Projects.astro b/website/src/components/Projects.astro
@@ -18,7 +18,7 @@ const projects = await getCollection("projects");
           const { Content } = await render(project);
           return (
             <li class="bg-white/50 p-6 rounded-2xl md:w-1/2">
-              <div class="prose">
+              <div class="prose prose-a:font-semibold">
                 <Content />
               </div>
             </li>
diff --git a/website/src/layouts/Layout.astro b/website/src/layouts/Layout.astro
@@ -2,7 +2,7 @@
 import "../styles/global.css";
 import Header from "../components/Header.astro";
 import Footer from "../components/Footer.astro";
-import "@fontsource/open-sans";
+import "@fontsource/inter";
 import "@fontsource/ramaraja";
 ---
 
@@ -15,7 +15,7 @@ import "@fontsource/ramaraja";
     <title>Benefit Decision Toolkit</title>
   </head>
   <body
-    class="prose-headings:font-serif prose-headings:font-normal prose-headings:text-center prose-p:text-black prose-p:leading-6 prose-a:font-semibold prose-h2:text-4xl prose-h3:text-3xl prose-p:text-lg"
+    class="prose-headings:font-serif prose-headings:font-normal prose-headings:text-center prose-p:text-black prose-p:leading-6 prose-h2:text-4xl prose-h3:text-3xl prose-p:text-lg"
   >
     <div id="top"></div>
     <Header />
diff --git a/website/src/styles/global.css b/website/src/styles/global.css
@@ -2,6 +2,6 @@
 @plugin "@tailwindcss/typography";
 
 @theme {
-  --font-sans: "Open Sans", sans;
+  --font-sans: "Inter", sans;
   --font-serif: "Ramaraja", serif;
 }

Original file line number	Diff line number	Diff line change
`@@ -2,6 +2,6 @@`
`2`	`2`	`@plugin "@tailwindcss/typography";`
`3`	`3`
`4`	`4`	`@theme {`
`5`		`- --font-sans: "Open Sans", sans;`
	`5`	`+ --font-sans: "Inter", sans;`
`6`	`6`	`--font-serif: "Ramaraja", serif;`
`7`	`7`	`}`