diff --git a/src/App.vue b/src/App.vue
index e479b33b..0427bd59 100755
--- a/src/App.vue
+++ b/src/App.vue
@@ -28,10 +28,10 @@ const subSidebarActualWidth = computed(() => {
   }
   if (
     menuStore.sidebarMenus.length === 1
-      && (
-        !menuStore.sidebarMenus[0].children
-          || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
-      )
+    && (
+      !menuStore.sidebarMenus[0].children
+      || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
+    )
   ) {
     actualWidth = 0
   }
diff --git a/src/assets/styles/globals.scss b/src/assets/styles/globals.scss
index b4460de6..acc186e0 100755
--- a/src/assets/styles/globals.scss
+++ b/src/assets/styles/globals.scss
@@ -1,7 +1,7 @@
 // 页面布局 CSS 变量
 :root {
   // 头部高度
-  --g-header-height: 80px;
+  --g-header-height: 60px;
   // 侧边栏宽度
   --g-main-sidebar-width: 80px;
   --g-sub-sidebar-width: 220px;
diff --git a/src/layouts/components/Header/index.vue b/src/layouts/components/Header/index.vue
index f16ae138..dfd8e4f8 100755
--- a/src/layouts/components/Header/index.vue
+++ b/src/layouts/components/Header/index.vue
@@ -39,13 +39,13 @@ function handlerMouserScroll(event: WheelEvent) {
                   }"
                 >
                   <div
-                    v-if="item.children && item.children.length !== 0" class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-5 py-4 transition-all cursor-pointer group text-[var(--g-header-menu-color)] hover:(text-[var(--g-header-menu-hover-color)] bg-[var(--g-header-menu-hover-bg)])" :class="{
+                    v-if="item.children && item.children.length !== 0" class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-3 transition-all cursor-pointer group text-[var(--g-header-menu-color)] hover:(text-[var(--g-header-menu-hover-color)] bg-[var(--g-header-menu-hover-bg)])" :class="{
                       'text-[var(--g-header-menu-active-color)]! bg-[var(--g-header-menu-active-bg)]!': index === menuStore.actived,
                     }" :title="item.meta?.title" @click="switchTo(index)"
                   >
-                    <div class="inline-flex flex-col justify-center items-center flex-1">
+                    <div class="inline-flex justify-center items-center gap-1 flex-1">
                       <SvgIcon v-if="item.meta?.icon" :name="item.meta?.icon" :size="20" class="menu-item-container-icon transition-transform group-hover:scale-120" async />
-                      <span class="flex-1 text-sm w-full text-center truncate transition-width transition-height transition-opacity">
+                      <span class="flex-1 text-sm w-full truncate transition-width transition-height transition-opacity">
                         {{ item.meta?.title }}
                       </span>
                     </div>
@@ -104,12 +104,12 @@ header {
     background-color: inherit;
 
     .logo {
-      width: 50px;
-      height: 50px;
+      width: initial;
+      height: 40px;
     }
 
     span {
-      font-size: 24px;
+      font-size: 20px;
       letter-spacing: 1px;
       color: var(--g-header-color);
     }
@@ -135,24 +135,15 @@ header {
   .menu {
     display: inline-flex;
     height: 100%;
-    background-color: var(--g-header-bg);
 
     :deep(.menu-item) {
       .menu-item-container {
-        width: 80px;
-        padding: 0 5px;
         color: var(--g-header-menu-color);
-        background-color: var(--g-header-menu-bg);
 
         &:hover {
           color: var(--g-header-menu-hover-color);
           background-color: var(--g-header-menu-hover-bg);
         }
-
-        .menu-item-container-icon {
-          transform: scale(1);
-          font-size: 24px !important;
-        }
       }
 
       &.active .menu-item-container {
@@ -164,15 +155,6 @@ header {
 
   :deep(.tools) {
     padding: 0;
-
-    .buttons .item .icon {
-      color: var(--g-header-color);
-    }
-
-    .user-container {
-      font-size: 16px;
-      color: var(--g-header-color);
-    }
   }
 }
 
diff --git a/src/layouts/components/MainSidebar/index.vue b/src/layouts/components/MainSidebar/index.vue
index fc6db4aa..cd98ec30 100755
--- a/src/layouts/components/MainSidebar/index.vue
+++ b/src/layouts/components/MainSidebar/index.vue
@@ -77,22 +77,19 @@ const { switchTo } = useMenu()
 
     :deep(.menu-item) {
       .menu-item-container {
-        height: 60px;
-        padding: 0 5px;
+        padding-block: 8px;
         color: var(--g-main-sidebar-menu-color);
-        background-color: var(--g-main-sidebar-menu-bg);
+
+        &:hover {
+          color: var(--g-main-sidebar-menu-hover-color);
+          background-color: var(--g-main-sidebar-menu-hover-bg);
+        }
 
         .menu-item-container-icon {
-          transform: scale(1);
           font-size: 24px !important;
         }
       }
 
-      &:hover .menu-item-container {
-        color: var(--g-main-sidebar-menu-hover-color);
-        background-color: var(--g-main-sidebar-menu-hover-bg);
-      }
-
       &.active .menu-item-container {
         color: var(--g-main-sidebar-menu-active-color) !important;
         background-color: var(--g-main-sidebar-menu-active-bg) !important;
diff --git a/src/layouts/components/Menu/item.vue b/src/layouts/components/Menu/item.vue
index bd38f6d1..ce158e21 100644
--- a/src/layouts/components/Menu/item.vue
+++ b/src/layouts/components/Menu/item.vue
@@ -46,15 +46,14 @@ defineExpose({
     <div
       class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-5 py-4 transition-all cursor-pointer group text-[var(--g-sub-sidebar-menu-color)] hover:(text-[var(--g-sub-sidebar-menu-hover-color)] bg-[var(--g-sub-sidebar-menu-hover-bg)])" :class="{
         'text-[var(--g-sub-sidebar-menu-active-color)]! bg-[var(--g-sub-sidebar-menu-active-bg)]!': isItemActive,
-        'px-2!': rootMenu.isMenuPopup && level === 0,
+        'px-3!': rootMenu.isMenuPopup && level === 0,
       }" :title="item.meta?.title"
     >
       <div
         class="inline-flex justify-center items-center gap-[12px] flex-1" :class="{
-          'flex-col gap-none': rootMenu.isMenuPopup && level === 0,
-          'flex-col gap-[2px]!': rootMenu.isMenuPopup && level === 0 && rootMenu.props.showCollapseName,
+          'flex-col': rootMenu.isMenuPopup && level === 0 && rootMenu.props.mode === 'vertical',
+          'gap-1!': rootMenu.isMenuPopup && level === 0 && rootMenu.props.showCollapseName,
           'w-full': rootMenu.isMenuPopup && level === 0 && rootMenu.props.showCollapseName && rootMenu.props.mode === 'vertical',
-          'w-[50px]': rootMenu.isMenuPopup && level === 0 && rootMenu.props.showCollapseName && rootMenu.props.mode === 'horizontal',
         }" :style="indentStyle"
       >
         <SvgIcon v-if="props.item.meta?.icon" :name="props.item.meta.icon" :size="20" class="menu-item-container-icon transition-transform group-hover:scale-120" async />
diff --git a/src/layouts/components/SubSidebar/index.vue b/src/layouts/components/SubSidebar/index.vue
index c7e9ee74..f26d999f 100755
--- a/src/layouts/components/SubSidebar/index.vue
+++ b/src/layouts/components/SubSidebar/index.vue
@@ -22,11 +22,11 @@ function onSidebarScroll(e: Event) {
 const enableSidebar = computed(() => {
   return settingsStore.mode === 'mobile' || (
     ['side', 'head', 'single'].includes(settingsStore.settings.menu.menuMode)
-      && menuStore.sidebarMenus.length !== 0
-      && !(
-        !menuStore.sidebarMenus[0].children
-          || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
-      )
+    && menuStore.sidebarMenus.length !== 0
+    && !(
+      !menuStore.sidebarMenus[0].children
+      || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
+    )
   )
 })
 </script>
diff --git a/src/layouts/components/Topbar/Toolbar/index.vue b/src/layouts/components/Topbar/Toolbar/index.vue
index b6a7a5b6..16a75be7 100755
--- a/src/layouts/components/Topbar/Toolbar/index.vue
+++ b/src/layouts/components/Topbar/Toolbar/index.vue
@@ -18,11 +18,11 @@ const menuStore = useMenuStore()
 const enableSubMenuCollapseButton = computed(() => {
   return settingsStore.mode === 'mobile' || (
     ['side', 'head', 'single'].includes(settingsStore.settings.menu.menuMode)
-      && settingsStore.settings.menu.enableSubMenuCollapseButton
-      && !(
-        !menuStore.sidebarMenus[0].children
-          || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
-      )
+    && settingsStore.settings.menu.enableSubMenuCollapseButton
+    && !(
+      !menuStore.sidebarMenus[0].children
+      || menuStore.sidebarMenus[0]?.children.every(item => item.meta?.sidebar === false)
+    )
   )
 })