Merge pull request #3108 from Hyphen-H/enhancement/spoiler-text-css

优化spoiler-text.css，平滑过渡符合现代审美

public/css/spoiler-text.css

@@ -1,15 +1,19 @@
-/* Spoiler text styles */
+/* Spoiler text styles with sharp edges */
 .spoiler-text {
     color: transparent;  /* 文字透明 */
-    background-color: #808080; /* 背景为黑色 */
-    border-color: #808080;
-    text-decoration-color: #808080;
-    text-emphasis-color: #808080;
-    border-radius: 8px;
-    filter: blur(1px);  /* 初始模糊 */
+    background-color: #000000; /* 背景为黑色 */
+    border-color: #000000;  /* 边框颜色 */
+    text-decoration-color: #000000; /* 删除线颜色 */
+    text-emphasis-color: #000000; /* 强调文字颜色 */
+    filter: none;  /* 移除模糊效果 */
     --hide-transition: 0.3s ease-out;
-    transition: opacity var(--hide-transition),
-    filter var(--hide-transition);
+    transition: 
+        color var(--hide-transition),
+        background-color var(--hide-transition),
+        border-color var(--hide-transition),
+        text-decoration-color var(--hide-transition),
+        text-emphasis-color var(--hide-transition),
+        opacity 0.35s cubic-bezier(.25,.46,.45,.94); /* 平滑过渡 */
 }
 
 .spoiler-text:hover {
@@ -19,5 +23,26 @@
     text-decoration-color: inherit;
     text-emphasis-color: inherit;
     opacity: 1;  /* 鼠标悬停时恢复不透明度 */
-    filter: blur(0);  /* 鼠标悬停时解除模糊 */
-}
+}
+
+/* Spoiler child elements with transition */
+.spoiler-text * {
+    transition: opacity 0.35s cubic-bezier(.25,.46,.45,.94); /* 子元素透明度平滑过渡 */
+}
+
+/* Spoiler when not hovered */
+.spoiler-text:not(:hover) {
+    color: transparent!important; /* 非悬停时文字透明 */
+    background-color: #000000!important; /* 非悬停时背景为黑色 */
+    border-color: #000000!important; /* 非悬停时边框为黑色 */
+}
+
+.spoiler-text:not(:hover) * {
+    opacity: 0!important; /* 非悬停时子元素透明 */
+}
+
+/* Remove border in non-hover states */
+.spoiler-text:not(:hover),
+.spoiler-text:not(:hover) * {
+    border: none!important;
+}