feat: layout__body

This commit is contained in:
FairyEver 2021-12-04 22:08:36 +08:00
parent 7386477c0a
commit b89546c675
3 changed files with 6 additions and 14 deletions

View File

@ -4,11 +4,8 @@
<template>
<d2-scroll class="body__container">
<div class="container__space-header"/>
<div class="container__body">
<div class="container__body-inner">
<slot/>
</div>
<div class="container__inner">
<slot/>
</div>
</d2-scroll>
</template>

View File

@ -32,16 +32,11 @@ html, body, #app {
>.os-scrollbar-vertical {
top: calc(#{--var('header-height')} + #{--var('header-border-width')});
}
.container__space-header {
height: calc(#{--var('header-height')} + #{--var('header-border-width')});
}
.container__body {
@apply relative;
.container__inner {
@apply relative overflow-hidden;
margin-top: calc(#{--var('header-height')} + #{--var('header-border-width')});
min-height: calc(100vh - (#{--var('header-height')} + #{--var('header-border-width')}));
background-color: --var('color-bg-container');
.container__body-inner {
@apply absolute top-0 bottom-0 left-0 right-0;
}
}
}
}

View File

@ -3,5 +3,5 @@
</route>
<template>
<d2-flex class="w-full h-full text-4xl bg-gray-600 text-gray-50" center>Full</d2-flex>
<d2-flex class="absolute top-0 bottom-0 left-0 right-0 text-4xl bg-gray-600 text-gray-50" center>Full</d2-flex>
</template>