fixed bug 若干

content/post/2026-01-23-why-dark-mode-matters/index.md

@@ -14,7 +14,7 @@ status: "public"
 
 不知道大家有没有这样的经历：大晚上躲在被窝里刷手机，打开一个网页，突然一道白光刺瞎双眼，那种感觉简直就像是被闪光弹击中一样。从那一刻起，我就深刻意识到，博客的昼夜切换不仅仅是一个“酷炫”的功能，更是对博友眼睛最基本的尊重。
 
-### 心中的一个疙瘩
+## 心中的一个疙瘩
 
 其实，我的这个博客主题 **Ying** 在此之前一直是没有暗黑模式的。这一直是我心中的一个疙瘩。
 
@@ -22,7 +22,7 @@ status: "public"
 
 但每次逛别人的博客，看到右上角那个精致的太阳/月亮切换按钮，轻轻一点，页面瞬间从明亮转为深邃，我都羡慕不已。尤其是在深夜，那种深色背景带来的沉浸感和舒适感，真的是白色背景无法比拟的。每次回到自己的博客，看到那惨白惨白的背景，总感觉少了点什么，既不护眼，也不够酷。
 
-### Tailwind CSS 4：真香警告
+## Tailwind CSS 4：真香警告
 
 最近这段时间，我开始接触并深度使用 **Tailwind CSS v4**。不得不说，这个原子化的 CSS 框架真的是太优秀了。
 
@@ -34,7 +34,7 @@ status: "public"
 
 ![](image.png)
 
-### 来自“瞎眼”打工人的吐槽
+## 来自“瞎眼”打工人的吐槽
 
 说完了开心的技术探索，再来吐槽一下糟心的工作。
 
@@ -48,7 +48,7 @@ status: "public"
 
 无奈之下，我只能自力更生，给浏览器装了个 **Dark Reader** 插件，强制把公司的网页转成暗黑模式。虽然有时候颜色渲染会有点怪，图标也会变糊，但至少，我的眼睛算是保住了。
 
-### 结语
+## 结语
 
 正是因为自己在工作中饱受“光污染”的折磨，我才更坚定地要把博客的暗黑模式做好。
 

hugo.toml

@@ -1,26 +1,53 @@
-baseURL = "https://usj.cc"
+# ==============================================================================
-languageCode = 'zh-cn'
+# 基础配置 (Basic Configuration)
-title = '优世界'
+# ==============================================================================
-theme = 'Ying'
 
-# 文章与页面使用 .html 结尾（ugly URLs 模式）
+# 网站的基本 URL (Base URL)
+baseURL = "https://usj.cc"
+
+# 网站的语言代码 (Language Code)
+languageCode = "zh-cn"
+
+# 网站标题 (Site Title)
+title = "优世界"
+
+# 使用的主题名称 (Theme Name)
+theme = "Ying"
+
+# ==============================================================================
+# 核心行为配置 (Core Behavior)
+# ==============================================================================
+
+# 文章与页面使用 .html 结尾 (Ugly URLs)
+# true: 生成 /post/hello.html, false: 生成 /post/hello/index.html
 uglyURLs = true
 
-# 分页展示文章数 每页展示文章的数量
+# 分页设置：每页展示的文章数量 (Pagination)
 paginate = 6
 
-#计算文章总字数
+# 开启 CJK (中日韩) 语言支持，用于准确统计字数 (CJK Language Support)
-HasCJKLanguage = true
+hasCJKLanguage = true
 
-#hugo代码高亮显示
+# ==============================================================================
+# 构建与环境配置 (Build & Environment)
+# ==============================================================================
+
+# 模块配置 (Module Configuration)
+[module]
+  [module.hugoVersion]
+    extended = false
+    min = "0.116.0"
+
+# 内容渲染配置 (Markup Configuration)
 [markup]
   [markup.goldmark]
     [markup.goldmark.renderer]
-      unsafe = true
+      unsafe = true # 允许在 Markdown 中使用 HTML 标签 (Allow raw HTML)
   [markup.highlight]
-    style = 'dracula'
+    style = "dracula" # 代码高亮样式 (Highlight style)
     noClasses = false
 
+# 资源压缩配置 (Minification)
 [minify]
   disableXML = true
   [minify.tdewolff]
@@ -31,20 +58,79 @@ HasCJKLanguage = true
       keepEndTags = true
       keepWhitespace = false
 
-# 自定义文章固定链接：使用 日期 作为文件名（如 /20260117.html）
+# ==============================================================================
+# URL 与 输出格式 (URLs & Output Formats)
+# ==============================================================================
+
+# 自定义文章固定链接 (Permalinks)
+# 使用日期作为文件名，例如 /20260117.html
 [permalinks]
   post = "/:year:month:day"
 
-[params]
+# 输出格式配置 (Outputs)
-  # 默认作者
+[outputs]
-  author = "小赵"
+  home = ["HTML", "RSS"]
 
+# RSS 媒体类型定义 (RSS Media Type)
+[mediaTypes."application/rss+xml"]
+  suffixes = ["xml"]
+
+# RSS 输出格式详情 (RSS Output Format)
+[outputFormats.RSS]
+  mediaType = "application/rss+xml"
+  baseName = "rss"
+  isPlainText = false
+  noUgly = true
+  permalinkable = true
+
+# ==============================================================================
+# 站点参数配置 (Site Parameters)
+# ==============================================================================
+[params]
+  # ----------------------------------------------------------------------------
+  # 社交链接 (Social Links)
+  # ----------------------------------------------------------------------------
+  social = [
+    { title = "GitHub", url = "https://github.com/zqlit", icon = "ri-github-fill" },
+    { title = "我的主页", url = "#", icon = "ri-at-line" },
+    { title = "Rss订阅", url = "/rss.xml", icon = "ri-rss-fill" }
+  ]
+
+  # ----------------------------------------------------------------------------
+  # 作者信息 (Author Info)
+  # ----------------------------------------------------------------------------
+  [params.author]
+    name = "小赵"
+    avatar = "/image/tx7.jpg"
+    description = "不以物喜，不以己悲"
+
+  # ----------------------------------------------------------------------------
+  # 评论系统 (Artalk Comments)
+  # ----------------------------------------------------------------------------
+  [params.artalk]
+    server = "https://artalk.usj.cc"
+    site = "优世界"
+    emoticons = "/emotion/OwO.json"
+    gravatar = "https://cravatar.cn/avatar/"
+
+  # ----------------------------------------------------------------------------
+  # 弹幕配置 (Barrage Configuration)
+  # ----------------------------------------------------------------------------
+  [params.barrage]
+    enableHitokoto = true
+    hitokotoUrl = "https://v1.hitokoto.cn?c=a&c=b&c=c&c=d&c=i"
+
+
+
+  # ----------------------------------------------------------------------------
+  # 样式定制 (Style Customization)
+  # ----------------------------------------------------------------------------
   [params.style]
     # 自定义背景图开关
     enableBackgroundImage = true
     # 背景图链接 (留空则不显示背景图，enableBackgroundImage=false 时此项无效)
     backgroundImageUrl = "/image/deno.webp"
-    # 背景图显示模式: cover (全屏铺满), contain (完整显示), auto (原始大小), 或具体数值 (如 100% auto)
+    # 背景图显示模式: cover (全屏铺满), contain (完整显示), auto (原始大小), 或具体数值
     backgroundSize = "contain" 
     # 背景图重复: no-repeat (不重复), repeat (重复), repeat-x, repeat-y, round (自动调整)
     backgroundRepeat = "round"
@@ -52,3 +138,39 @@ HasCJKLanguage = true
     backgroundPosition = "center"
     # 背景图固定: fixed (固定), scroll (随页面滚动)
     backgroundAttachment = "fixed"
+
+
+
+# ==============================================================================
+# 菜单配置 (Menus)
+# ==============================================================================
+
+[[menu.main]]
+  name = "优世界"
+  pageRef = "/"
+  weight = 10
+
+[[menu.main]]
+  name = "about"
+  url = "/about.html"
+  weight = 20
+
+[[menu.main]]
+  name = "comment"
+  url = "/comment.html"
+  weight = 20
+
+[[menu.main]]
+  name = "links"
+  url = "/links.html"
+  weight = 20
+
+[[menu.main]]
+  name = "circles"
+  url = "/circles.html"
+  weight = 30
+
+[[menu.main]]
+  name = "archives"
+  url = "/archives.html"
+  weight = 20

themes/Ying/assets/css/main.css

@@ -441,27 +441,38 @@ ul {
     display: flex;
     flex-direction: column;
     justify-content: center;
-    align-items: flex-start;
+    align-items: center;
     margin-top: 0;
 }
 
+.header .site-description h2 {
+    display: none;
+}
+
 .header .site-description nav {
     margin: 0;
     padding: 0;
     border: none;
     min-width: 50px;
-    margin-bottom: 10px;
+    margin-bottom: 0;
+    text-align: center;
 }
 
 .header .site-description nav ul a {
     display: inline-block;
-    margin-right: 5px;
+    margin: 0 5px;
     text-decoration: none;
+    transition: all 0.2s ease;
 }
 
+.header .site-description nav ul a i {
+    font-size: 1.15rem;
+    vertical-align: middle;
+}
 
 .header .site-description nav ul a:hover {
-    color: #586069;
+    color: #24292e;
+    transform: scale(1.2);
 }
 
 /* Pjax 页面切换过渡动画 */
@@ -1007,8 +1018,23 @@ h3.diy-h3 {
 .yiyandes {
     font-size: .9rem;
     line-height: 2rem;
-    margin-left: -28.6px;
     margin-top: -2px;
+    cursor: pointer;
+    transition: opacity 0.3s ease;
+}
+
+.yiyandes:hover {
+    opacity: 0.7;
+}
+
+.yiyandes.typing::after {
+    content: '|';
+    animation: blink 1s step-start infinite;
+    margin-left: 2px;
+}
+
+@keyframes blink {
+    50% { opacity: 0; }
 }
 
 /*comments*/
@@ -2214,12 +2240,16 @@ input[type=submit] {
     display: flex;
     align-items: center;
     justify-content: center;
+    width: 26px !important;
+    height: 26px !important;
+    min-width: 26px !important;
 }
 
 .barrage .header-avatar img {
-    width: 100%;
+    width: 26px !important;
-    height: 100%;
+    height: 26px !important;
     object-fit: cover;
+    border-radius: 50%;
 }
 
 .pause {

themes/Ying/assets/js/main.js

@@ -104,10 +104,10 @@ function initArtalkAndGetComments() {
 
     Artalk.init({
       el: '#Comments',                // 绑定元素的 Selector
-      server: 'https://artalk.usj.cc',  // 后端地址
+      server: window.siteConfig.artalk.server,  // 后端地址
-      site: '优世界',             // 你的站点名
+      site: window.siteConfig.artalk.site,             // 你的站点名
       flatMode: true,
-      emoticons: '/emotion/OwO.json'
+      emoticons: window.siteConfig.artalk.emoticons
     });
   });
 }
@@ -115,35 +115,63 @@ function initArtalkAndGetComments() {
 // 异步创建弹幕
 async function createBarragerFromArtalk(commentsData) {
   const looperTime = 1000;  // 每条弹幕的发送间隔，单位毫秒
+  
+  // 1. 处理评论数据（扁平化、乱序）
   const flattenedComments = flattenComments(commentsData);
-  const totalComments = flattenedComments.length;
+  shuffleArray(flattenedComments); // 随机打乱评论顺序
-  let currentIndex = 0;
+  const selectedComments = flattenedComments; // 使用所有评论
+  
+  // 2. 构建弹幕列表
+  let barrageList = selectedComments.map(comment => ({
+    type: 'comment',
+    content: stripHTML(comment.content_marked) || 'No comment',
+    // 修复头像模糊：请求 200px 的图片 (s=200)
+    headImg: window.siteConfig.artalk.gravatar + comment.email_encrypted + "?s=200" || 'static/default-avatar.png',
+    href: comment.link || '#',
+    speed: 35
+  }));
+
+  // 3. 尝试获取在线一言并插入
+  if (window.siteConfig.barrage && window.siteConfig.barrage.enableHitokoto) {
+    try {
+      const hitokoto = await fetchHitokoto();
+      if (hitokoto) {
+        const insertIndex = Math.floor(Math.random() * (barrageList.length + 1));
+        barrageList.splice(insertIndex, 0, {
+          type: 'hitokoto',
+          content: `『一言』${hitokoto}`,
+          headImg: window.siteConfig.author.avatar,
+          href: 'https://hitokoto.cn',
+          speed: 35
+        });
+      }
+    } catch (e) {
+      console.error('获取一言失败:', e);
+    }
+  }
 
   // 初始化弹幕插件
   let barrage = new Barrage.default({
     el: 'body',
     backColor: "#000000b5",
-    fontSize: "14px",
+    fontSize: "13px", // 字体稍微改小一点点以适配小头像
     isLeft: true,
     speed: 0,
-    height: "33px"
+    height: "30px" // 整体高度稍微减小
   });
 
-  if (totalComments !== 0) {
+  const totalItems = barrageList.length;
-    while (currentIndex < totalComments) {
+  let currentIndex = 0;
-      const currentComment = flattenedComments[currentIndex];
+
-      const barragerItem = {
+  if (totalItems !== 0) {
-        headImg: "https://cravatar.cn/avatar/"+currentComment.email_encrypted + "?s=33" || 'static/default-avatar.png',
+    while (currentIndex < totalItems) {
-        content: stripHTML(currentComment.content_marked) || 'No comment',
+      const item = barrageList[currentIndex];
-        href: currentComment.link || '#',
-        speed: 10
-      };
       
       // 发送弹幕
-      barrage.start(barragerItem.content, {
+      barrage.start(item.content, {
-        speed: barragerItem.speed,
+        speed: item.speed,
-        headImg: barragerItem.headImg,
+        headImg: item.headImg,
-        speed: 35
+        href: item.href 
       });
 
       currentIndex++;
@@ -152,6 +180,26 @@ async function createBarragerFromArtalk(commentsData) {
   }
 }
 
+// 数组乱序算法 (Fisher-Yates Shuffle)
+function shuffleArray(array) {
+  for (let i = array.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [array[i], array[j]] = [array[j], array[i]];
+  }
+}
+
+// 获取一言
+async function fetchHitokoto() {
+  const url = window.siteConfig.barrage.hitokotoUrl || 'https://v1.hitokoto.cn?c=a&c=b&c=c&c=d&c=i';
+  try {
+    const response = await fetch(url); 
+    const data = await response.json();
+    return data.hitokoto;
+  } catch (error) {
+    return null;
+  }
+}
+
 // 延迟函数，返回一个 Promise，用于等待指定的毫秒数
 function delay(ms) {
   return new Promise(resolve => setTimeout(resolve, ms));
@@ -276,4 +324,50 @@ function initCodeCopy() {
 // 页面加载完成后初始化
 document.addEventListener('DOMContentLoaded', function() {
   initCodeCopy();
+  initDescriptionHitokoto();
 });
+
+// 初始化个人描述一言切换
+function initDescriptionHitokoto() {
+  const descEl = document.querySelector('.yiyandes');
+  if (!descEl) return;
+
+  descEl.title = '点击切换一言';
+
+  descEl.addEventListener('click', async () => {
+    if (descEl.dataset.loading === 'true') return;
+    
+    descEl.dataset.loading = 'true';
+    const originalText = descEl.innerText;
+    descEl.innerText = '正在获取灵感...'; 
+
+    const hitokoto = await fetchHitokoto();
+    
+    if (hitokoto) {
+      typeWriter(descEl, hitokoto);
+    } else {
+      descEl.innerText = originalText;
+      descEl.dataset.loading = 'false';
+    }
+  });
+}
+
+// 打字机效果
+function typeWriter(element, text, speed = 100) {
+  element.innerText = '';
+  element.classList.add('typing');
+  let i = 0;
+  
+  function type() {
+    if (i < text.length) {
+      element.innerText += text.charAt(i);
+      i++;
+      setTimeout(type, speed);
+    } else {
+      element.dataset.loading = 'false';
+      element.classList.remove('typing');
+    }
+  }
+  
+  type();
+}

themes/Ying/layouts/_default/comment.html

@@ -5,10 +5,10 @@
   <div class="post-content" itemprop="articleBody" uk-scrollspy="target: > #szh; cls: uk-animation-slide-bottom-small; delay: 0">
     {{ .Content }}
     <div id="szh">
-      - 名称：优世界<br>
+      - 名称：{{ .Site.Params.artalk.site }}<br>
-      - 简介：一个很佛系的博客<br>
+      - 简介：{{ .Site.Params.author.description }}<br>
-      - 链接：https://usj.cc<br>
+      - 链接：{{ .Site.BaseURL }}<br>
-      - 图标：https://usj.cc/favicon.ico
+      - 图标：{{ .Site.Params.author.avatar }}
     </div>
   </div>
   <hr class="uk-divider-icon">

themes/Ying/layouts/_default/single.html

@@ -5,7 +5,7 @@
     <article style="margin-bottom: 3.5em;">
         <h1 class="post-title" itemprop="name headline" uk-scrollspy="cls: uk-animation-slide-top-small; delay: 200">{{ .Title }}</h1>
         <div class="meta" uk-scrollspy="cls: uk-animation-fade; delay: 300">
-            <span class="meta-item">作者: {{ .Params.author | default .Site.Params.author }}</span>
+            <span class="meta-item">作者: {{ .Params.author | default .Site.Params.author.name }}</span>
             <span class="meta-item">浏览: <span id="busuanzi_value_page_uv"></span></span>
             <span class="meta-item">字数: {{ .WordCount }}</span>
             <span class="meta-item">阅读: 约 {{ .ReadingTime }} 分钟</span>

themes/Ying/layouts/partials/artalk.html

@@ -29,12 +29,12 @@
                 var isDark = document.documentElement.getAttribute('data-theme') === 'dark';
                 Artalk.init({
                     el: '#Comments',
-                    server: 'https://artalk.usj.cc',
+                    server: '{{ .Site.Params.artalk.server }}',
-                    site: '优世界',
+                    site: '{{ .Site.Params.artalk.site }}',
                     pageKey: '{{ .RelPermalink }}',
                     flatMode: true,
                     darkMode: isDark,
-                    emoticons: '/emotion/OwO.json'
+                    emoticons: '{{ .Site.Params.artalk.emoticons | relURL }}'
                 });
             } else {
                 console.error('Artalk is not defined. Bundle js may not be loaded yet.');

themes/Ying/layouts/partials/head.html

@@ -58,6 +58,26 @@
   <!-- Preload Fonts -->
   <link rel="preload" href="{{ "font/zql.woff2" | relURL }}" as="font" type="font/woff2" crossorigin>
 
+  <!-- Site Configuration -->
+  <script>
+    window.siteConfig = {
+      artalk: {
+        server: "{{ .Site.Params.artalk.server }}",
+        site: "{{ .Site.Params.artalk.site }}",
+        emoticons: "{{ .Site.Params.artalk.emoticons | relURL }}",
+        gravatar: "{{ .Site.Params.artalk.gravatar }}"
+      },
+      author: {
+        avatar: "{{ .Site.Params.author.avatar }}",
+        description: "{{ .Site.Params.author.description }}"
+      },
+      barrage: {
+        enableHitokoto: {{ .Site.Params.barrage.enableHitokoto | default true }},
+        hitokotoUrl: "{{ .Site.Params.barrage.hitokotoUrl }}"
+      }
+    };
+  </script>
+
   <!-- Stylesheets -->
   {{ $normalize := resources.Get "css/normalize.css" }}
   {{ $remixicon := resources.Get "css/remixicon.css" }}

themes/Ying/layouts/partials/header.html

@@ -3,13 +3,13 @@
         <div class="header">
             <div class="header-top">
                 <div class="head_author_img load-memos-editor">
-                    <img src="{{ .Site.Params.authorImage }}" class="blog-img" width="80" height="80" alt="{{ .Site.Title }}" />
+                    <img src="{{ .Site.Params.author.avatar }}" class="blog-img" width="80" height="80" alt="{{ .Site.Title }}" />
                     <div class="avatar-theme-tip">
                         点击头像切换昼夜
                     </div>
                 </div>
                 <div class="site-description">
-                    <h2><span class="uk-invisible">{{ .Site.Params.description }}</span></h2>
+                    <h2><span class="uk-invisible">{{ .Site.Params.author.description }}</span></h2>
                     <nav class="nav social uk-visible@m">
                         <ul class="flat">
                             {{ with .Site.Params.social }}
@@ -18,7 +18,7 @@
                                 {{ end }}
                             {{ end }}
                         </ul>
-                        <div class="yiyandes">{{ .Site.Params.description }}</div>
+                        <div class="yiyandes">{{ .Site.Params.author.description }}</div>
                     </nav>
                 </div>
             </div>