From a88eab39f6b2f5c33913d51fac4e885c052ed4a1 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期四, 21 八月 2025 14:39:00 +0800
Subject: [PATCH] 整体样式修改

---
 src/assets/styles/sidebar.scss |   67 +++++++++------------------------
 1 files changed, 19 insertions(+), 48 deletions(-)

diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
index eb6a1c8..9a4c487 100644
--- a/src/assets/styles/sidebar.scss
+++ b/src/assets/styles/sidebar.scss
@@ -12,21 +12,18 @@
   }
 
   .sidebar-container {
-    -webkit-transition: width .28s;
     transition: width 0.28s;
     width: $base-sidebar-width !important;
-    background-color: $base-menu-background;
     height: 100%;
     position: fixed;
     font-size: 0px;
-    top: 50px;
+    top: 0;
     bottom: 0;
     left: 0;
     z-index: 1001;
     overflow: hidden;
     -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
-    box-shadow: none;
-    margin: 0 auto;
+    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
 
     // reset element-ui css
     .horizontal-collapse-transition {
@@ -42,7 +39,7 @@
     }
 
     .el-scrollbar {
-      height: 92%;
+      height: 100%;
     }
 
     &.has-logo {
@@ -54,29 +51,24 @@
     .is-horizontal {
       display: none;
     }
+
     a {
       display: inline-block;
-      width: 80px;
-      height: 80px;
+      width: 100%;
       overflow: hidden;
-      margin-top: 20px;
     }
 
-
     .svg-icon {
-      //margin-right: 16px;
+      margin-right: 16px;
     }
 
     .el-menu {
       border: none;
       height: 100%;
       width: 100% !important;
-      padding: 0 20px !important;
     }
 
     .el-menu-item, .menu-title {
-      line-height: 20px;
-      font-size: 14px;
       overflow: hidden !important;
       text-overflow: ellipsis !important;
       white-space: nowrap !important;
@@ -89,69 +81,52 @@
     // menu hover
     .sub-menu-title-noDropdown,
     .el-sub-menu__title {
-      border-radius: 10px 10px 10px 10px;
       &:hover {
-        background-color: #ffffff !important;
-        border-radius: 10px 10px 10px 10px;
-        color: $base-menu-color-active !important;
+        background-color: rgba(0, 0, 0, 0.06) !important;
       }
     }
 
     & .theme-dark .is-active > .el-sub-menu__title {
       color: $base-menu-color-active !important;
     }
-    & .nest-menu > a {
-      right: 20px;
-      position: relative;
-    }
-    & .nest-menu> .el-sub-menu > .el-sub-menu__title {
-      right: 20px;
-      position: relative;
-    }
+
     & .nest-menu .el-sub-menu>.el-sub-menu__title,
     & .el-sub-menu .el-menu-item {
+      min-width: $base-sidebar-width !important;
 
-
-      height: 80px;
-      min-width: 80px !important;
-      border-radius: 10px 10px 10px 10px;
       &:hover {
-        background-color: #ffffff !important;
-        border-radius: 10px 10px 10px 10px;
-        color: $base-menu-color-active !important;
+        background-color: rgba(0, 0, 0, 0.06) !important;
       }
     }
 
     & .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
     & .theme-dark .el-sub-menu .el-menu-item {
       background-color: $base-sub-menu-background;
-      border-radius: 10px 10px 10px 10px;
+
       &:hover {
-        background-color: #ffffff !important;
-        border-radius: 10px 10px 10px 10px;
-        color: $base-menu-color-active !important;
+        background-color: $base-sub-menu-hover !important;
       }
     }
   }
 
   .hideSidebar {
     .sidebar-container {
-      width: 120px !important;
+      width: 54px !important;
     }
 
     .main-container {
-      margin-left: 120px;
+      margin-left: 54px;
     }
 
     .sub-menu-title-noDropdown {
-      padding: 0 0 0 20px !important;
+      padding: 0 !important;
       position: relative;
 
       .el-tooltip {
         padding: 0 !important;
 
         .svg-icon {
-          //margin-left: 20px;
+          margin-left: 20px;
         }
       }
     }
@@ -163,7 +138,7 @@
         padding: 0 !important;
 
         .svg-icon {
-          //margin-left: 20px;
+          margin-left: 20px;
         }
 
       }
@@ -226,21 +201,17 @@
 
 // when menu collapsed
 .el-menu--vertical {
-  width: 120px !important; /* 璁剧疆涓�涓浐瀹氱殑瀹藉害 */
   &>.el-menu {
     .svg-icon {
-      //margin-right: 16px;
+      margin-right: 16px;
     }
   }
 
   .nest-menu .el-sub-menu>.el-sub-menu__title,
   .el-menu-item {
-    border-radius: 10px 10px 10px 10px;
     &:hover {
       // you can use $sub-menuHover
-      background-color: #ffffff !important;
-      border-radius: 10px 10px 10px 10px;
-      color: $base-menu-color-active !important;
+      background-color: rgba(0, 0, 0, 0.06) !important;
     }
   }
 

--
Gitblit v1.9.3