feat(mdx): add MDX support and migrate markdown files to MDX

- Add @astrojs/mdx integration to enable MDX support
- Migrate all markdown files (.md) to MDX (.mdx) format
- Create HighlightBox component for enhanced content styling
- Update astro config to include MDX integration
- Add documentation guide for MDX integration

astro.config.mjs

@@ -6,6 +6,8 @@ import react from "@astrojs/react";
 
 import sitemap from "@astrojs/sitemap";
 
+import mdx from '@astrojs/mdx';
+
 // https://astro.build/config
 export default defineConfig({
   site: 'https://zhaoguiyang.com',
@@ -14,6 +16,19 @@ export default defineConfig({
       theme: 'dracula',
     },
   },
+  integrations: [
+    react(), 
+    sitemap({
+      i18n: {
+        defaultLocale: 'en',
+        locales: {
+          en: 'en',
+          zh: 'zh'
+        },
+      },
+    }),
+    mdx()
+  ],
   vite: {
       plugins: [tailwindcss()],
   },
@@ -22,18 +37,10 @@ export default defineConfig({
     defaultLocale: "en",
     // A list of all locales supported by the site
     locales: ["en", "zh"],
+    // Enable routing strategy for detecting the locale from the URL path
     routing: {
       // URLs for the defaultLocale (en) will not have a /en/ prefix
       prefixDefaultLocale: false,
     }
   },
-  integrations: [react(), sitemap({
-    i18n: {
-      defaultLocale: 'en',
-      locales: {
-        en: 'en',
-        zh: 'zh'
-      },
-    },
-  })]
 });