docs: add post "beyond-prejudice-japanese-literature"

2 files changed, 15 insertions, 27 deletions

diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 21e185f..38c4c28 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -138,6 +138,7 @@
 {{ end }}
 
 {{ if .Params.comments | default true}}
+<div class="comments-and-webmentions">
 <hr />
 <details>
     <summary>
@@ -157,15 +158,12 @@
     async>
 </script>
 
-<details>
-    <summary>如何参与 Webmentions 互动？</summary>
+    <p>若想回复本文，请在你的博客或社媒发布含有本文链接的帖子，然后在下方表单提交链接。</p>
     <div class="wm-guide-content">
 <div class="webmention-form">
-    <p>如果你想回应这篇文章，请在你的博客或社交媒体中链接本页面，然后在下面的表单中提交你的页面链接。</p>
     <form id="webmention-submit-form" action="https://webmention.io/www.glowisle.me/webmention" method="post">
         <!-- 自动填充的目标文章链接 -->
         <input type="hidden" name="target" value="https://www.glowisle.me{{ .RelPermalink }}">
-
         <div>
             <label for="webmention-source">你的文章链接：</label>
             <input
@@ -179,9 +177,9 @@
         </div>
         <div id="webmention-form-feedback"></div>
     </form>
-    <br>
+<p>也可以加入 <a href="https://t.me/glowisle">Telegram 频道</a> 或 <a href="mailto:i@glowisle.me?subject=回复《{{ .Title  }}》">发送邮件</a> 评论。</p>
 <a href="https://indieweb.org/webmention">关于 Webmention 的更多信息</a> 以及 <a href="https://www.glowisle.me/posts/tear-hypocrisy-apart/">为什么要这么做？</a>
-</details>
+</div>
 
 
 
diff --git a/layouts/partials/style.html b/layouts/partials/style.html
index dc53e01..0576b88 100644
--- a/layouts/partials/style.html
+++ b/layouts/partials/style.html
@@ -1,5 +1,4 @@
 <style>
-  /* light theme */
   :root {
     --width-max: 700px;
     --font-primary: "Noto Serif SC", "Source Han Serif SC", serif;
@@ -126,16 +125,6 @@
     border: none !important;
   }
 
-  @media (prefers-color-scheme: dark) {
-    :root {
-      --music-bg-hover-dark: #525252; /* neutral-600 */
-      --music-bg-dark: rgba(82, 82, 82, 0.5); /* neutral-600/50 */
-      --music-text-secondary: #a3a3a3;
-    }
-  }
-
-  /* THIS SHIT MADE FROM LLM */
-
   /* --- 主容器 --- */
   /* flex flex-col gap-2 */
   .music-card {
@@ -222,16 +211,6 @@
     display: inline;
   }
 
-  /* --- 深色模式覆盖 --- */
-  @media (prefers-color-scheme: dark) {
-    .music-btn {
-      background-color: var(--music-bg-dark);
-    }
-    .music-btn:hover {
-      background-color: var(--music-bg-hover-dark);
-    }
-  }
-
   /* --- 桌面端/大屏适配 (Media Query: md / min-width: 768px) --- */
   @media (min-width: 768px) {
     /* 容器变为横向排列，两端对齐 */
@@ -265,6 +244,7 @@
     }
   }
 
+  /* 暗色模式 */
   @media (prefers-color-scheme: dark) {
     :root {
       --body-bg-color: #121212;
@@ -282,6 +262,16 @@
       --caption-text-color: #aaa;
       --toc-text-color: #373737;
       --toc-hover-color: #cac3c3;
+      --music-bg-hover-dark: #525252; /* neutral-600 */
+      --music-bg-dark: rgba(82, 82, 82, 0.5); /* neutral-600/50 */
+      --music-text-secondary: #a3a3a3;
+    }
+
+    .music-btn {
+      background-color: var(--music-bg-dark);
+    }
+    .music-btn:hover {
+      background-color: var(--music-bg-hover-dark);
     }
 
     .category-link {