diff --git a/web/src/layout/IndexView.vue b/web/src/layout/IndexView.vue
index 4ed0945a..d2206a04 100644
--- a/web/src/layout/IndexView.vue
+++ b/web/src/layout/IndexView.vue
@@ -30,7 +30,9 @@ const themeStore = useThemeStore()
       placement="left"
       @mask-click="themeStore.setCollapsed(true)"
     >
-      <side-bar />
+      <n-scrollbar>
+        <side-bar />
+      </n-scrollbar>
     </n-drawer>
 
     <article flex-col flex-1 overflow-hidden>
diff --git a/web/src/layout/sidebar/IndexView.vue b/web/src/layout/sidebar/IndexView.vue
index 0988f3de..d888fd2f 100644
--- a/web/src/layout/sidebar/IndexView.vue
+++ b/web/src/layout/sidebar/IndexView.vue
@@ -5,9 +5,9 @@ import SideMenu from './components/SideMenu.vue'
 </script>
 
 <template>
-  <div h-full flex flex-col>
-    <side-logo />
-    <side-menu />
-    <side-setting mt-auto />
+  <div h-screen flex flex-col>
+    <side-logo flex-shrink-0 />
+    <side-menu flex-shrink-0 flex-grow-1 />
+    <side-setting flex-shrink-0 />
   </div>
 </template>