Improve blog post rendering

sites/poetry/astro.config.mjs

@@ -1,17 +1,27 @@
 // @ts-check
 import { defineConfig } from "astro/config";
 import mdx from "@astrojs/mdx";
+import rehypeKatex from "rehype-katex";
+import remarkMath from "remark-math";
 import sitemap from "@astrojs/sitemap";
 
 import react from "@astrojs/react";
 // @ts-ignore - TailwindCSS v4 Vite plugin has type compatibility issues with Astro
 import tailwindcss from "@tailwindcss/vite";
+import remarkCallouts from "../../src/remark-callouts.mjs";
 import { ACTIVE_BLOG_SITE } from "./src/blog-sites.js";
 
+const remarkPlugins = [remarkMath, remarkCallouts];
+const rehypePlugins = [rehypeKatex];
+
 // https://astro.build/config
 export default defineConfig({
   site: ACTIVE_BLOG_SITE.url,
-  integrations: [mdx(), sitemap(), react()],
+  integrations: [mdx({ remarkPlugins, rehypePlugins }), sitemap(), react()],
+  markdown: {
+    remarkPlugins,
+    rehypePlugins,
+  },
   output: "static",
   outDir: "dist",
 

sites/poetry/src/styles/global.css

@@ -1,4 +1,6 @@
 @import "tailwindcss";
+@import "katex/dist/katex.min.css";
+@import "../../../../src/styles/article.css";
 
 @plugin 'tailwindcss-animate';
 @plugin '@tailwindcss/typography';