提交 f8bcb1bb authored 作者: lidongxu's avatar lidongxu

style(layout/index.vue): 主体部分高度与头部固定兼容性问题

当头部固定时,主题的高度应该是 100vh,因为头部 fixed 了,主体再减去头部高度底部会留白效果不对
上级 d93ca5d2
...@@ -49,12 +49,12 @@ ...@@ -49,12 +49,12 @@
</span> </span>
</div> </div>
<!-- <div class="drawer-item"> <div class="drawer-item">
<span>固定 Header</span> <span>固定 Header</span>
<span class="comp-style"> <span class="comp-style">
<el-switch v-model="settingsStore.fixedHeader" class="drawer-switch" /> <el-switch v-model="settingsStore.fixedHeader" class="drawer-switch" />
</span> </span>
</div> --> </div>
<div class="drawer-item"> <div class="drawer-item">
<span>显示 Logo</span> <span>显示 Logo</span>
......
...@@ -100,6 +100,11 @@ function setLayout() { ...@@ -100,6 +100,11 @@ function setLayout() {
transition: width 0.28s; transition: width 0.28s;
} }
// 开启头部固定以后,main的高度需要设置为100vh
.fixed-header + .app-main{
min-height: 100vh;
}
.hideSidebar .fixed-header { .hideSidebar .fixed-header {
width: calc(100% - 54px); width: calc(100% - 54px);
} }
......
...@@ -26,7 +26,7 @@ export default { ...@@ -26,7 +26,7 @@ export default {
/** /**
* 是否固定头部 * 是否固定头部
*/ */
fixedHeader: false, fixedHeader: true,
/** /**
* 是否显示logo * 是否显示logo
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论