feat(评论): 改进Giscus评论区的主题切换功能

重构Giscus评论区加载逻辑，支持动态切换主题并适配暗黑模式
添加MutationObserver监听主题变化，实时更新评论界面
支持Swup页面切换时的评论组件重新加载
更新文章文档中的注意事项说明

src/content/posts/warden-worker.md

@@ -97,4 +97,6 @@ Build结束，全绿
 
 > [!CAUTION]
 >  ~~值得注意的是，该项目似乎仅实现了手机端的大部分API，而针对于电脑浏览器插件使用的API暂未支持，我们目前正在尝试用AI补全... Just a moment...~~
->  已支持电脑端浏览器插件
+>  更多注意事项请参阅仓库README
+>  已支持电脑端浏览器插件
+>  

src/pages/posts/[...slug].astro

@@ -166,21 +166,64 @@ const jsonLd = {
 
             
             <!-- Giscus 评论区 -->
-            <script src="https://giscus.app/client.js"
+            <div id="giscus-container"></div>
-                    data-repo="afoim/giscus-fuwari"
+            <script is:inline>
-                    data-repo-id="R_kgDOOi8quw"
+                function loadGiscus() {
-                    data-category="Announcements"
+                    const theme = document.documentElement.classList.contains('dark') ? 'dark' : 'light';
-                    data-category-id="DIC_kwDOOi8qu84CprDV"
+                    
-                    data-mapping="pathname"
+                    const script = document.createElement('script');
-                    data-strict="0"
+                    script.src = "https://giscus.app/client.js";
-                    data-reactions-enabled="1"
+                    script.setAttribute("data-repo", "afoim/giscus-fuwari");
-                    data-emit-metadata="0"
+                    script.setAttribute("data-repo-id", "R_kgDOOi8quw");
-                    data-input-position="top"
+                    script.setAttribute("data-category", "Announcements");
-                    data-theme="preferred_color_scheme"
+                    script.setAttribute("data-category-id", "DIC_kwDOOi8qu84CprDV");
-                    data-lang="zh-CN"
+                    script.setAttribute("data-mapping", "pathname");
-                    data-loading="lazy"
+                    script.setAttribute("data-strict", "0");
-                    crossorigin="anonymous"
+                    script.setAttribute("data-reactions-enabled", "1");
-                    async>
+                    script.setAttribute("data-emit-metadata", "0");
+                    script.setAttribute("data-input-position", "top");
+                    script.setAttribute("data-theme", theme);
+                    script.setAttribute("data-lang", "zh-CN");
+                    script.setAttribute("data-loading", "lazy");
+                    script.setAttribute("crossorigin", "anonymous");
+                    script.async = true;
+                    
+                    const container = document.getElementById('giscus-container');
+                    if (container) {
+                        container.innerHTML = '';
+                        container.appendChild(script);
+                    }
+                }
+
+                // 监听主题变化
+                const observer = new MutationObserver((mutations) => {
+                    mutations.forEach((mutation) => {
+                        if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
+                            const iframe = document.querySelector('iframe.giscus-frame');
+                            if (iframe) {
+                                const theme = document.documentElement.classList.contains('dark') ? 'dark' : 'light';
+                                iframe.contentWindow.postMessage({
+                                    giscus: {
+                                        setConfig: {
+                                            theme: theme
+                                        }
+                                    }
+                                }, 'https://giscus.app');
+                            }
+                        }
+                    });
+                });
+
+                observer.observe(document.documentElement, {
+                    attributes: true,
+                    attributeFilter: ['class']
+                });
+
+                // 初始加载
+                loadGiscus();
+
+                // 支持 Swup 页面切换
+                document.addEventListener('swup:contentReplaced', loadGiscus);
             </script>
     <br>