调整展开动画

This commit is contained in:
aixianling
2024-06-05 16:10:13 +08:00
parent 426f081cbc
commit ec09a998f7

View File

@@ -21,8 +21,8 @@ export default {
<div class="copilot" v-if="show">
<div class="flex header">
<b class="fill" v-text="title"/>
<div class="expandBtn" v-text="expandBtn" @click="expand=!expand"/>
<div class="minimal" v-text="'最小化'" @click="show=false"/>
<div class="expandBtn pointer" v-text="expandBtn" @click="expand=!expand"/>
<div class="minimal pointer" v-text="'最小化'" @click="show=false"/>
</div>
<div class="flex content">
<div class="left" :class="{expand}"></div>
@@ -60,6 +60,7 @@ export default {
& > b {
font-size: 16px;
cursor: default;
}
.expandBtn, .minimal {
@@ -81,19 +82,25 @@ export default {
}
.content {
height: max-content;
height: calc(100% - 48px);
.left {
width: 0;
height: 100%;
transition: width 1s;
&.expand {
width: 332px;
width: 260px;
& + .right {
border-left: 1px solid #ddd;
}
}
}
.right {
width: 348px;
width: 420px;
height: 100%;
}
}
}