From 2535252310668dd3862a3106cbf3f7d6a8604daa Mon Sep 17 00:00:00 2001
From: chansee97 <chen.dev@foxmail.com>
Date: Sat, 2 Aug 2025 23:19:34 +0800
Subject: [PATCH] fix: improve mobile layout

---
 src/layouts/components/common/MobileDrawer.vue |  2 +-
 src/layouts/index.vue                          | 14 ++++++++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/layouts/components/common/MobileDrawer.vue b/src/layouts/components/common/MobileDrawer.vue
index 5979116..e20f860 100644
--- a/src/layouts/components/common/MobileDrawer.vue
+++ b/src/layouts/components/common/MobileDrawer.vue
@@ -17,7 +17,7 @@ const showDrawer = defineModel<boolean>('show', { default: false })
   >
     <n-drawer-content :native-scrollbar="false" :body-content-style="{ padding: '0' }">
       <template #header>
-        <div class="flex">
+        <div class="flex items-center">
           <UserCenter />
           <div class="ml-auto" />
           <Search />
diff --git a/src/layouts/index.vue b/src/layouts/index.vue
index 2783043..c7f1b35 100644
--- a/src/layouts/index.vue
+++ b/src/layouts/index.vue
@@ -70,10 +70,16 @@ const hidenCollapaseButton = computed(() => ['horizontal'].includes(layoutMode.v
     </template>
 
     <template #nav-left>
-      <div v-if="!hasHorizontalMenu || !hidenCollapaseButton" class="h-full flex-y-center gap-1 p-x-sm">
-        <CollapaseButton v-if="!hidenCollapaseButton" />
-        <Breadcrumb v-if="!hasHorizontalMenu" />
-      </div>
+      <template v-if="appStore.isMobile">
+        <Logo />
+      </template>
+
+      <template v-else>
+        <div v-if="!hasHorizontalMenu || !hidenCollapaseButton" class="h-full flex-y-center gap-1 p-x-sm">
+          <CollapaseButton v-if="!hidenCollapaseButton" />
+          <Breadcrumb v-if="!hasHorizontalMenu" />
+        </div>
+      </template>
     </template>
 
     <template #nav-center>