feat(about): 优化夜间模式视觉效果和可访问性

- 提高玻璃态背景和文本的不透明度以增强可读性
- 调整夜间模式下评论区域的颜色和边框可见性
- 为功能按钮和链接添加tabindex属性提升键盘导航
- 增加多语言和SEO相关的meta标签及canonical链接
- 优化Artalk评论系统的主题切换逻辑和UI增强
- 更新移动端悬浮按钮和社交链接的无障碍标签

css/about.css

@@ -49,18 +49,18 @@
     --bg-grad-1: #2d3436;
     --bg-grad-2: #000000;
 
-    --glass-bg: rgba(30, 30, 35, 0.55);
-    --glass-border: 1px solid rgba(255, 255, 255, 0.08);
+    --glass-bg: rgba(30, 30, 35, 0.85); /* 提高背景不透明度增强可读性 */
+    --glass-border: 1px solid rgba(255, 255, 255, 0.15);
     --glass-shadow: 0 18px 60px rgba(0, 0, 0, 0.65);
 
-    --text-primary: #dfe6e9;
-    --text-secondary: #b2bec3;
-    --text-tertiary: #636e72;
+    --text-primary: #ffffff; /* 使用更明亮的白色提高对比度 */
+    --text-secondary: #e0e0e0; /* 提高二级文本亮度 */
+    --text-tertiary: #b0b0b0; /* 提高三级文本亮度 */
 
     --accent: #00cec9;
     --accent-glow: rgba(0, 206, 201, 0.4);
 
-    --dock-bg: rgba(30, 30, 35, 0.9);
+    --dock-bg: rgba(30, 30, 35, 0.95); /* 提高底层面板不透明度 */
 }
 
 /* Global Reset */
@@ -143,8 +143,9 @@ body {
 }
 
 [data-theme="night"] .neon-font {
-    color: #fff;
-    text-shadow: 0 0 10px var(--accent);
+    color: #ffffff;
+    text-shadow: 0 0 15px var(--accent), 0 0 25px var(--accent);
+    font-weight: bold;
 }
 
 [data-theme="day"] .icon-sun {
@@ -1821,8 +1822,8 @@ body {
 
 /* 黑夜模式样式增强 */
 [data-theme="night"] .area-stats {
-    background: rgba(30, 30, 35, 0.55);
-    border: 1px solid rgba(255, 255, 255, 0.08);
+    background: rgba(30, 30, 35, 0.85); /* 提高统计区域背景不透明度 */
+    border: 1px solid rgba(255, 255, 255, 0.15);
     box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
 }
 
@@ -1832,11 +1833,11 @@ body {
 }
 
 [data-theme="night"] .stat-item {
-    background: rgba(255, 255, 255, 0.05);
+    background: rgba(255, 255, 255, 0.15); /* 提高统计项目背景不透明度 */
 }
 
 [data-theme="night"] .stat-item:hover {
-    background: rgba(108, 92, 231, 0.2);
+    background: rgba(108, 92, 231, 0.3); /* 提高悬停时的背景不透明度 */
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
 }
 

css/artalk.css

@@ -622,9 +622,9 @@
 
 /* PC端黑夜模式下的输入框颜色和列表样式修正 - 全面优化版 */
 [data-theme="night"] .atk-editor-textarea {
-    background: rgba(30, 30, 35, 0.9) !important;
-    color: #e2e8f0 !important;
-    border: 1px solid rgba(255, 255, 255, 0.15) !important;
+    background: rgba(30, 30, 35, 0.95) !important; /* 提高背景不透明度增强可读性 */
+    color: #ffffff !important; /* 使用更亮的文字颜色 */
+    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* 增强边框可见性 */
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
 }
 
@@ -634,14 +634,14 @@
 }
 
 [data-theme="night"] .atk-comment-wrap {
-    background: rgba(30, 30, 35, 0.85) !important;
-    border: 1px solid rgba(255, 255, 255, 0.08) !important;
+    background: rgba(30, 30, 35, 0.95) !important; /* 提高背景不透明度增强可读性 */
+    border: 1px solid rgba(255, 255, 255, 0.15) !important;
     box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
 }
 
 [data-theme="night"] .atk-comment-wrap:hover {
-    background: rgba(40, 40, 45, 0.9) !important;
-    border: 1px solid rgba(0, 206, 201, 0.3) !important;
+    background: rgba(40, 40, 45, 0.98) !important; /* 进一步提高背景不透明度 */
+    border: 1px solid rgba(0, 206, 201, 0.5) !important; /* 增强边框可见性 */
     box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4) !important;
 }
 
@@ -701,7 +701,7 @@
 }
 
 [data-theme="night"] .atk-comment .atk-content {
-    color: #e2e8f0 !important;
+    color: #ffffff !important; /* 使用更亮的文字颜色提高可读性 */
     line-height: 1.6 !important;
 }