zsqy-naive-ui/src/layout/components/Logo/index.vue

60 lines
1.1 KiB
Vue

<template>
<div class="logo">
<!-- <img :src="websiteConfig.logo" alt="" :class="{ 'mr-2': !collapsed }" /> -->
<SvgIcon
name="logo"
:class="{ 'mr-2': !props.collapsed }"
class="logo-svgs"
:color="designStore.appTheme"
/>
<h2
v-show="!props.collapsed"
class="title"
:style="{ color: designStore.appTheme }"
>
{{ websiteConfig.title }}
</h2>
</div>
</template>
<script lang="ts" setup>
import { useDesignSettingStore } from '@/store/modules/designSetting';
import { websiteConfig } from '../../../config/website.config';
const designStore = useDesignSettingStore();
const props = defineProps({
collapsed: {
type: Boolean,
},
});
</script>
<style lang="scss" scoped>
.logo {
display: flex;
align-items: center;
justify-content: center;
height: 64px;
overflow: hidden;
line-height: 64px;
white-space: nowrap;
&-svgs {
width: 32px;
height: 32px;
// color: var(--n-item-text-color-child-active) !important;
}
img {
width: auto;
height: 32px;
}
.title {
margin: 0;
}
}
</style>