From 6e9d26fbeb160a4048fad96001efbcf72b4e0a47 Mon Sep 17 00:00:00 2001
From: Evan Reichard <evan@reichard.io>
Date: Fri, 6 Feb 2026 09:01:32 -0500
Subject: [PATCH] fix(frontend): add tailwind typography plugin for markdown
 styling

Install @tailwindcss/typography package and configure it in
tailwind.config.js to properly style rendered markdown content.
The prose class now applies correct styles to headings, lists,
code blocks, and other markdown elements.
---
 frontend/package-lock.json  | 28 ++++++++++++++++++++++++++++
 frontend/package.json       | 15 ++++++++-------
 frontend/tailwind.config.js |  4 +++-
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index afc91ba..b36eae7 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -15,6 +15,7 @@
         "remark-gfm": "^4.0.0"
       },
       "devDependencies": {
+        "@tailwindcss/typography": "^0.5.19",
         "@testing-library/jest-dom": "^6.4.2",
         "@testing-library/react": "^15.0.6",
         "@testing-library/user-event": "^14.5.2",
@@ -1508,6 +1509,33 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@tailwindcss/typography": {
+      "version": "0.5.19",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz",
+      "integrity": "sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "postcss-selector-parser": "6.0.10"
+      },
+      "peerDependencies": {
+        "tailwindcss": ">=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1"
+      }
+    },
+    "node_modules/@tailwindcss/typography/node_modules/postcss-selector-parser": {
+      "version": "6.0.10",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz",
+      "integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssesc": "^3.0.0",
+        "util-deprecate": "^1.0.2"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/@testing-library/dom": {
       "version": "10.4.1",
       "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index c623307..6f26c5a 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -11,13 +11,17 @@
     "lint": "eslint src --ext ts,tsx"
   },
   "dependencies": {
+    "lucide-react": "^0.263.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-markdown": "^9.0.1",
-    "remark-gfm": "^4.0.0",
-    "lucide-react": "^0.263.1"
+    "remark-gfm": "^4.0.0"
   },
   "devDependencies": {
+    "@tailwindcss/typography": "^0.5.19",
+    "@testing-library/jest-dom": "^6.4.2",
+    "@testing-library/react": "^15.0.6",
+    "@testing-library/user-event": "^14.5.2",
     "@types/react": "^18.3.1",
     "@types/react-dom": "^18.3.0",
     "@typescript-eslint/eslint-plugin": "^7.0.0",
@@ -27,14 +31,11 @@
     "eslint": "^8.57.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.6",
+    "jsdom": "^24.0.0",
     "postcss": "^8.4.38",
     "tailwindcss": "^3.4.3",
     "typescript": "^5.4.5",
     "vite": "^5.2.8",
-    "vitest": "^1.5.0",
-    "jsdom": "^24.0.0",
-    "@testing-library/react": "^15.0.6",
-    "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/user-event": "^14.5.2"
+    "vitest": "^1.5.0"
   }
 }
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 9121d4e..5fb7967 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -8,5 +8,7 @@ export default {
   theme: {
     extend: {},
   },
-  plugins: [],
+  plugins: [
+    require('@tailwindcss/typography'),
+  ],
 }