From a1f0887032ac530556893ef5b182b64f889d1b93 Mon Sep 17 00:00:00 2001
From: gary <xuebaiyouling@gmail.com>
Date: Sun, 1 Feb 2026 14:59:56 +0800
Subject: [PATCH] =?UTF-8?q?opt:=20=E4=BC=98=E5=8C=96=E4=B8=8B=E8=8F=9C?=
 =?UTF-8?q?=E5=8D=95=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common-menu/index.vue | 33 ++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)

diff --git a/src/components/common-menu/index.vue b/src/components/common-menu/index.vue
index f3ebe96..6e249fe 100644
--- a/src/components/common-menu/index.vue
+++ b/src/components/common-menu/index.vue
@@ -51,5 +51,38 @@ const activeRoutePath = computed(() => {
 </template>
 
 <style scoped>
+:deep(.el-menu) {
+  border-right: none;
+}
 
+/* Base Item Style */
+:deep(.el-menu-item),
+:deep(.el-sub-menu__title) {
+  transition: all 0.3s;
+}
+
+/* Vertical Menu Active State (Default) */
+:deep(.el-menu:not(.el-menu--horizontal) .el-menu-item.is-active) {
+  background-color: var(--el-color-primary-light-9);
+  border-right: 3px solid var(--el-color-primary);
+  color: var(--el-color-primary);
+  font-weight: 500;
+}
+
+/* Dark Mode Active Override */
+.dark :deep(.el-menu:not(.el-menu--horizontal) .el-menu-item.is-active) {
+  background-color: rgba(64, 158, 255, 0.2);
+}
+
+/* Hover Effects */
+:deep(.el-menu-item:hover),
+:deep(.el-sub-menu__title:hover) {
+  background-color: var(--el-fill-color-light);
+  color: var(--el-menu-text-color);
+}
+
+.dark :deep(.el-menu-item:hover),
+.dark :deep(.el-sub-menu__title:hover) {
+  background-color: var(--el-bg-color-overlay);
+}
 </style>