From 310ab846facb80e288f8f3383af5fc91bfd6613c Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Tue, 18 Jul 2023 13:36:22 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E9=A1=B6=E9=83=A8?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E6=97=B6=20Logo=20=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=8A=A8=E6=80=81=E9=AB=98=E5=BA=A6=E5=A4=B1=E6=95=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/components/Logo/index.vue | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/layouts/components/Logo/index.vue b/src/layouts/components/Logo/index.vue
index 06e158e..c420c75 100644
--- a/src/layouts/components/Logo/index.vue
+++ b/src/layouts/components/Logo/index.vue
@@ -23,16 +23,10 @@ const bgCloor = computed(() => {
     ? getCssVariableValue("--v3-header-bg-color")
     : getCssVariableValue("--v3-sidebar-menu-bg-color")
 })
-
-const logoHeight = computed(() => {
-  return layoutMode.value !== "top"
-    ? getCssVariableValue("--v3-header-height")
-    : getCssVariableValue("--v3-navigationbar-height")
-})
 </script>
 
 <template>
-  <div class="layout-logo-container" :class="{ collapse: props.collapse }">
+  <div class="layout-logo-container" :class="{ collapse: props.collapse, 'layout-mode-top': layoutMode === 'top' }">
     <transition name="layout-logo-fade">
       <router-link v-if="props.collapse" key="collapse" to="/">
         <img :src="logo" class="layout-logo" />
@@ -48,8 +42,8 @@ const logoHeight = computed(() => {
 .layout-logo-container {
   position: relative;
   width: 100%;
-  height: v-bind(logoHeight);
-  line-height: v-bind(logoHeight);
+  height: var(--v3-header-height);
+  line-height: var(--v3-header-height);
   background-color: v-bind(bgCloor);
   text-align: center;
   overflow: hidden;
@@ -62,6 +56,11 @@ const logoHeight = computed(() => {
   }
 }
 
+.layout-mode-top {
+  height: var(--v3-navigationbar-height);
+  line-height: var(--v3-navigationbar-height);
+}
+
 .collapse {
   .layout-logo {
     width: 32px;