All checks were successful
deploy to server / build-and-deploy (push) Successful in 2m50s
- 当竖屏时隐藏footer
44 lines
723 B
Vue
44 lines
723 B
Vue
<template>
|
|
<el-container class="app-container">
|
|
<el-header height="auto" class="page-header">
|
|
<jinshen-header />
|
|
</el-header>
|
|
<el-main class="main-content">
|
|
<slot />
|
|
</el-main>
|
|
<el-footer height="auto" class="page-footer">
|
|
<jinshen-footer />
|
|
</el-footer>
|
|
</el-container>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.app-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
padding: 0;
|
|
}
|
|
|
|
.page-header {
|
|
padding: 0px;
|
|
margin-bottom: auto;
|
|
}
|
|
|
|
.main-content {
|
|
flex: 1;
|
|
padding: 0;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.page-footer {
|
|
padding: 0px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.page-footer {
|
|
display: none;
|
|
}
|
|
}
|
|
</style>
|