diff --git a/dashboard/src/layouts/full/vertical-sidebar/VerticalSidebar.vue b/dashboard/src/layouts/full/vertical-sidebar/VerticalSidebar.vue
index 82f16074..70c5d5d8 100644
--- a/dashboard/src/layouts/full/vertical-sidebar/VerticalSidebar.vue
+++ b/dashboard/src/layouts/full/vertical-sidebar/VerticalSidebar.vue
@@ -160,25 +160,23 @@ function endDrag() {
width="220"
:rail="customizer.mini_sidebar"
>
-
-
-
-
-
-
-
- 🔧 设置
-
-
-
- 官方文档
-
-
-
- GitHub
-
-
-
+
diff --git a/dashboard/src/scss/layout/_sidebar.scss b/dashboard/src/scss/layout/_sidebar.scss
index e530d7f3..032af62a 100644
--- a/dashboard/src/scss/layout/_sidebar.scss
+++ b/dashboard/src/scss/layout/_sidebar.scss
@@ -4,7 +4,7 @@
box-shadow: none !important;
}
.listitem {
- height: calc(100vh - 100px);
+ overflow-y: auto;
.v-list {
color: rgb(var(--v-theme-secondaryText));
}
@@ -16,6 +16,39 @@
color: rgb(var(--v-theme-secondary));
}
}
+}
+
+// 深色主题下的侧边栏悬停和选中样式
+.v-theme--PurpleThemeDark .leftSidebar {
+ .listitem {
+ .v-list-group__items .v-list-item,
+ .v-list-item {
+ &:hover {
+ color: #b794f6 !important;
+
+ .v-list-item-title {
+ color: #b794f6 !important;
+ }
+
+ .v-icon {
+ color: #b794f6 !important;
+ }
+ }
+
+ // 选中状态的样式
+ &.v-list-item--active {
+ color: #b794f6 !important;
+
+ .v-list-item-title {
+ color: #b794f6 !important;
+ }
+
+ .v-icon {
+ color: #b794f6 !important;
+ }
+ }
+ }
+ }
.v-list-item--density-default.v-list-item--one-line {
min-height: 42px;
}
@@ -52,3 +85,34 @@
}
}
}
+
+// 新的flex布局样式
+.leftSidebar {
+ .sidebar-container {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+
+ .flex-grow-1 {
+ flex: 1 1 auto;
+ overflow-y: auto;
+ }
+
+ .sidebar-footer {
+ padding: 16px;
+ background: inherit;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ font-size: 13px;
+ text-align: center;
+ flex-shrink: 0;
+
+ .v-btn {
+ width: 100%;
+ max-width: 180px;
+ margin-bottom: 8px !important;
+ }
+ }
+ }
+}