Template
1
0
mirror of https://github.com/un-pany/v3-admin-vite.git synced 2025-04-20 19:09:21 +08:00

fix: 修复顶部模式时 Logo 组件动态高度失效

This commit is contained in:
pany 2023-07-18 13:36:22 +08:00
parent 8a0b8c5b3a
commit 310ab846fa

View File

@ -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;