From cab8cd06dc26ba12e7baef5c6be7741d74288a78 Mon Sep 17 00:00:00 2001
From: tim <nagisa12164@163.com>
Date: Sun, 7 Sep 2025 22:46:55 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E9=A2=91=E9=81=93=E8=81=8A=E5=A4=A9?=
 =?UTF-8?q?=EF=BC=8C=E7=82=B9=E5=87=BB=E5=86=99=E4=B8=AA=E5=9B=9E=E5=A4=8D?=
 =?UTF-8?q?=E6=B2=A1=E5=8F=8D=E5=BA=94=EF=BC=8C=E7=82=B9=E5=87=BB=E5=B0=8F?=
 =?UTF-8?q?=E7=AE=AD=E5=A4=B4=E6=89=8D=E8=A1=8C=20#916?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend_nuxt/assets/global.css             | 10 +++++++---
 frontend_nuxt/components/MenuComponent.vue  |  6 +++++-
 frontend_nuxt/components/PostEditor.vue     |  2 +-
 frontend_nuxt/components/ReactionsGroup.vue |  4 ++--
 frontend_nuxt/pages/index.vue               | 10 ++++++++--
 frontend_nuxt/pages/message-box/[id].vue    |  6 +++---
 frontend_nuxt/pages/message-box/index.vue   |  2 +-
 7 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/frontend_nuxt/assets/global.css b/frontend_nuxt/assets/global.css
index 127c32725..1c4a45950 100644
--- a/frontend_nuxt/assets/global.css
+++ b/frontend_nuxt/assets/global.css
@@ -18,7 +18,9 @@
   --background-color-blur: rgba(255, 255, 255, 0.57);
   --menu-border-color: lightgray;
   --normal-border-color: lightgray;
-  --menu-selected-background-color: rgba(242, 242, 242, 0.884);
+  --menu-selected-background-color: rgba(88, 241, 255, 0.166);
+  --normal-light-background-color: rgba(242, 242, 242, 0.884);
+  --menu-selected-background-color-hover: rgba(242, 242, 242, 0.884);
   --menu-text-color: rgb(99, 99, 99);
   --scroller-background-color: rgba(130, 175, 180, 0.5);
   /* --normal-background-color: rgb(241, 241, 241); */
@@ -58,6 +60,8 @@
   --menu-border-color: #555;
   --normal-border-color: #555;
   --menu-selected-background-color: rgba(255, 255, 255, 0.1);
+  --normal-light-background-color: rgba(255, 255, 255, 0.1);
+  --menu-selected-background-color-hover: rgba(17, 182, 197, 0.082);
   --menu-text-color: rgb(173, 173, 173);
   /* --normal-background-color: #000000; */
   --normal-background-color: #333;
@@ -162,7 +166,7 @@ body {
   padding-left: 1em;
   border-left: 4px solid #d0d7de;
   color: var(--blockquote-text-color);
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
   padding-top: 1px;
   padding-bottom: 1px;
 }
@@ -295,7 +299,7 @@ body {
 
 /* 鼠标悬停行高亮 */
 .info-content-text tbody tr:hover {
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
   transition: background-color 0.2s ease;
 }
 
diff --git a/frontend_nuxt/components/MenuComponent.vue b/frontend_nuxt/components/MenuComponent.vue
index 94bc21a31..9291a6aaf 100644
--- a/frontend_nuxt/components/MenuComponent.vue
+++ b/frontend_nuxt/components/MenuComponent.vue
@@ -316,6 +316,10 @@ const gotoTag = (t) => {
   align-items: center;
 }
 
+.menu-item:hover {
+  background-color: var(--menu-selected-background-color-hover);
+}
+
 .menu-item.selected {
   font-weight: bold;
   background-color: var(--menu-selected-background-color);
@@ -407,7 +411,7 @@ const gotoTag = (t) => {
 }
 
 .section-item:hover {
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--menu-selected-background-color-hover);
 }
 
 .section-item-text-count {
diff --git a/frontend_nuxt/components/PostEditor.vue b/frontend_nuxt/components/PostEditor.vue
index 0c9a728f7..af7edcb91 100644
--- a/frontend_nuxt/components/PostEditor.vue
+++ b/frontend_nuxt/components/PostEditor.vue
@@ -136,7 +136,7 @@ export default {
   left: 0;
   width: 100%;
   height: 100%;
-  background: var(--menu-selected-background-color);
+  background: var(--normal-light-background-color);
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/frontend_nuxt/components/ReactionsGroup.vue b/frontend_nuxt/components/ReactionsGroup.vue
index af293dbaf..1a5d346fc 100644
--- a/frontend_nuxt/components/ReactionsGroup.vue
+++ b/frontend_nuxt/components/ReactionsGroup.vue
@@ -331,11 +331,11 @@ onMounted(async () => {
 
 .reactions-viewer-item.placeholder,
 .reactions-viewer-single-item.selected {
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
 }
 
 .reaction-option.selected {
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
 }
 
 @media (max-width: 768px) {
diff --git a/frontend_nuxt/pages/index.vue b/frontend_nuxt/pages/index.vue
index 8882c8c29..0d9abf069 100644
--- a/frontend_nuxt/pages/index.vue
+++ b/frontend_nuxt/pages/index.vue
@@ -65,16 +65,17 @@
           class="article-item"
           v-for="article in articles"
           :key="article.id"
+          @click="navigateTo(`/posts/${article.id}`)"
         >
           <div class="article-main-container">
-            <NuxtLink class="article-item-title main-item" :to="`/posts/${article.id}`">
+            <NuxtLink class="article-item-title main-item">
               <pin v-if="article.pinned" theme="outline" class="pinned-icon" />
               <gift v-if="article.type === 'LOTTERY'" class="lottery-icon" />
               <ranking-list v-else-if="article.type === 'POLL'" class="poll-icon" />
               <star v-if="!article.rssExcluded" class="featured-icon" />
               {{ article.title }}
             </NuxtLink>
-            <NuxtLink class="article-item-description main-item" :to="`/posts/${article.id}`">
+            <NuxtLink class="article-item-description main-item">
               {{ sanitizeDescription(article.description) }}
             </NuxtLink>
             <div class="article-info-container main-item">
@@ -488,6 +489,11 @@ const sanitizeDescription = (text) => stripMarkdown(text)
   border-bottom: 1px solid var(--normal-border-color);
 }
 
+.article-item:hover {
+  background-color: var(--menu-selected-background-color-hover);
+  cursor: pointer;
+}
+
 .article-main-container,
 .header-item.main-item {
   width: calc(60% - 20px);
diff --git a/frontend_nuxt/pages/message-box/[id].vue b/frontend_nuxt/pages/message-box/[id].vue
index 04589759d..4e07ac7da 100644
--- a/frontend_nuxt/pages/message-box/[id].vue
+++ b/frontend_nuxt/pages/message-box/[id].vue
@@ -48,7 +48,7 @@
               :content-id="item.id"
               @update:modelValue="(v) => (item.reactions = v)"
             >
-              <div class="reply-btn"><next @click="setReply(item)" /> 写个回复...</div>
+              <div @click="setReply(item)" class="reply-btn"><next /> 写个回复...</div>
             </ReactionsGroup>
           </template>
         </BaseTimeline>
@@ -614,7 +614,7 @@ function goBack() {
   border-left: 5px solid var(--primary-color);
   margin-bottom: 5px;
   font-size: 13px;
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
 }
 
 .reply-author {
@@ -634,7 +634,7 @@ function goBack() {
 }
 
 .active-reply {
-  background-color: var(--bg-color-soft);
+  background-color: var(--normal-light-background-color);
   padding: 5px 10px;
   border-left: 5px solid var(--primary-color);
   margin-bottom: 5px;
diff --git a/frontend_nuxt/pages/message-box/index.vue b/frontend_nuxt/pages/message-box/index.vue
index 8d301d437..a7894f26f 100644
--- a/frontend_nuxt/pages/message-box/index.vue
+++ b/frontend_nuxt/pages/message-box/index.vue
@@ -419,7 +419,7 @@ function minimize() {
 }
 
 .conversation-item:hover {
-  background-color: var(--menu-selected-background-color);
+  background-color: var(--normal-light-background-color);
 }
 
 .conversation-avatar {