twh_eastasia/vue-pure-admin
1
0
Fork 0
mirror of https://github.com/pure-admin/vue-pure-admin.git synced 2025-11-09 13:53:38 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化logo图和文字布局以及统一配置

Browse Source
This commit is contained in:
xiaoxian521
2023-02-13 14:30:34 +08:00
parent a3a4d2db08
commit 2d0cc4cfa2
4 changed files with 34 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/layout/components/sidebar/horizontal.vue
View File

@@ -46,12 +46,8 @@ watch(
class="horizontal-header"
>
<div class="horizontal-header-left" @click="backHome">
<FontIcon
icon="pure-iconfont-logo"
svg
style="width: 35px; height: 35px"
/>
<h4>{{ title }}</h4>
<img src="/logo.svg" alt="logo" />
<span>{{ title }}</span>
</div>
<el-menu
router

48
src/layout/components/sidebar/logo.vue
View File

@@ -18,11 +18,7 @@ const { title } = useNav();
class="sidebar-logo-link"
to="/"
>
<FontIcon
icon="pure-iconfont-logo"
svg
style="width: 35px; height: 35px"
/>
<img src="/logo.svg" alt="logo" />
<span class="sidebar-title">{{ title }}</span>
</router-link>
<router-link
@@ -32,11 +28,7 @@ const { title } = useNav();
class="sidebar-logo-link"
to="/"
>
<FontIcon
icon="pure-iconfont-logo"
svg
style="width: 35px; height: 35px"
/>
<img src="/logo.svg" alt="logo" />
<span class="sidebar-title">{{ title }}</span>
</router-link>
</transition>
@@ -45,37 +37,33 @@ const { title } = useNav();
<style lang="scss" scoped>
.sidebar-logo-container {
position: relative;
width: 100%;
height: 48px;
text-align: center;
overflow: hidden;
position: relative;
.sidebar-logo-link {
height: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-top: 5px;
display: flex;
flex-wrap: nowrap;
align-items: center;
img {
height: 32px;
display: inline-block;
}
.sidebar-title {
display: block;
width: 160px;
height: 32px;
line-height: 32px;
margin: 2px 0 0 12px;
color: $subMenuActiveText;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: left;
color: #1890ff;
text-overflow: ellipsis;
font-size: 18px;
font-weight: 600;
font-size: 20px;
margin-top: 10px;
font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
}
}
.collapses {
.sidebar-logo {
margin-right: 0;
}
}
}