refactor(all): complete rewrite

astro.config.ts

@@ -1,25 +1,79 @@
-import sitemap from "@astrojs/sitemap";
-import tailwind from "@astrojs/tailwind";
-import remarkCallout from "@r4ai/remark-callout";
+import { defineConfig } from 'astro/config'
+import mdx from '@astrojs/mdx'
+import react from '@astrojs/react'
+import sitemap from '@astrojs/sitemap'
+import tailwind from '@astrojs/tailwind'
 import umami from "@yeskunall/astro-umami";
-import { defineConfig } from "astro/config";
+import icon from 'astro-icon'
+import { transformerCopyButton } from '@rehype-pretty/transformers'
+import {
+  transformerMetaHighlight,
+  transformerNotationDiff,
+} from '@shikijs/transformers'
+import { rehypeHeadingIds } from '@astrojs/markdown-remark'
+import rehypeKatex from 'rehype-katex'
+import rehypeExternalLinks from 'rehype-external-links'
+import rehypePrettyCode from 'rehype-pretty-code'
+import remarkCallout from "@r4ai/remark-callout";
+import remarkEmoji from 'remark-emoji'
+import remarkMath from 'remark-math'
+import remarkToc from 'remark-toc'
+import sectionize from '@hbsnow/rehype-sectionize'
 
+// https://astro.build/config
 export default defineConfig({
-	site: "https://blog.z0x.ca",
-	integrations: [
-		tailwind({
-			nesting: true,
-		}),
-		umami({
-			id: "b691181e-cad7-4c23-b16a-709872a0a7ab",
-			endpointUrl: "https://umami.z0x.ca",
-		}),
-		sitemap(),
-	],
-	markdown: {
-		shikiConfig: {
-			theme: "css-variables",
-		},
-		remarkPlugins: [remarkCallout],
-	},
-});
+  site: 'https://blog.z0x.ca',
+  integrations: [
+    tailwind({
+      applyBaseStyles: false,
+    }),
+    sitemap(),
+    mdx(),
+    react(),
+    umami({
+      id: "b691181e-cad7-4c23-b16a-709872a0a7ab",
+      endpointUrl: "https://umami.z0x.ca",
+    }),
+    icon(),
+  ],
+  markdown: {
+    syntaxHighlight: false,
+    rehypePlugins: [
+      [
+        rehypeExternalLinks,
+        {
+          target: '_blank',
+          rel: ['nofollow', 'noreferrer', 'noopener'],
+        },
+      ],
+      rehypeHeadingIds,
+      rehypeKatex,
+      sectionize,
+      [
+        rehypePrettyCode,
+        {
+          theme: {
+            light: 'github-light-high-contrast',
+            dark: 'github-dark-high-contrast',
+          },
+          transformers: [
+            transformerNotationDiff(),
+            transformerMetaHighlight(),
+            transformerCopyButton({
+              visibility: 'hover',
+              feedbackDuration: 1000,
+            }),
+          ],
+        },
+      ],
+    ],
+    remarkPlugins: [remarkToc, remarkMath, remarkEmoji, remarkCallout],
+  },
+  server: {
+    port: 4321,
+    host: true,
+  },
+  devToolbar: {
+    enabled: false,
+  },
+})