【类 型】:factor
【原 因】:导航标题 控制终端 后台管理 切换不明显 【过 程】:现价三个点图标 配合动画 【影 响】: # 类型 包含: # feat:新功能(feature) # fix:修补bug # docs:文档(documentation) # style: 格式(不影响代码运行的变动) # refactor:重构(即不是新增功能,也不是修改bug的代码变动) # test:增加测试 # chore:构建过程或辅助工具的变动
This commit is contained in:
parent
d988e385b7
commit
9e32694cf9
@ -5,9 +5,13 @@
|
||||
<div v-if="isCollapse" key="isCollapse" class="sidebar-logo-link" @click="isTap = !isTap">
|
||||
<img :src="isTap ? require('@/assets/logo.svg') : require('@/assets/appletLogo.svg')" class="sidebar-logo">
|
||||
</div>
|
||||
<!-- 展开状态下 -->
|
||||
<div v-else key="expand" class="sidebar-logo-link" @click="isTap = !isTap">
|
||||
<img :src="isTap ? require('@/assets/logo.svg') : require('@/assets/appletLogo.svg')" class="sidebar-logo">
|
||||
<h1 class="sidebar-title">{{ title }}</h1>
|
||||
<div class="sidebar-title-wrap">
|
||||
<h1 class="sidebar-title">{{ title }}</h1>
|
||||
<i class="el-icon-more arrow-icon" :class="{ rotate: !isTap }"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end logo -->
|
||||
@ -250,5 +254,43 @@ h1 {
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar-logo-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 12px;
|
||||
height: 50px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sidebar-logo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.sidebar-title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.sidebar-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.arrow-icon {
|
||||
font-size: 16px;
|
||||
color: $black-color;
|
||||
transition: transform 0.3s ease;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.arrow-icon.rotate {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user