Make pages scrollable

This commit is contained in:
Andrew Kingston 2021-05-07 07:56:56 +01:00
parent 41ea4d1008
commit f173d16695
1 changed files with 8 additions and 2 deletions

View File

@ -89,7 +89,7 @@
<MenuItem icon="LogOut" on:click={auth.logout}>Log out</MenuItem> <MenuItem icon="LogOut" on:click={auth.logout}>Log out</MenuItem>
</ActionMenu> </ActionMenu>
</div> </div>
<div> <div class="content">
<slot /> <slot />
</div> </div>
</div> </div>
@ -100,17 +100,20 @@
<style> <style>
.container { .container {
min-height: 100vh; height: 100%;
display: grid; display: grid;
grid-template-columns: 250px 1fr; grid-template-columns: 250px 1fr;
align-items: stretch;
} }
.nav { .nav {
background: var(--background); background: var(--background);
border-right: var(--border-light); border-right: var(--border-light);
overflow: auto;
} }
.main { .main {
display: grid; display: grid;
grid-template-rows: auto 1fr; grid-template-rows: auto 1fr;
overflow: hidden;
} }
.branding { .branding {
display: grid; display: grid;
@ -156,4 +159,7 @@
text-overflow: ellipsis; text-overflow: ellipsis;
font-weight: 500; font-weight: 500;
} }
.content {
overflow: auto;
}
</style> </style>