teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix: stable layout while loading

Browse source
This commit is contained in:
patak 2022-12-21 22:39:25 +01:00
parent 6849fde9cc
commit 2b5051e123
1 changed files with 11 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
layouts/default.vue
View file

@ -1,11 +1,11 @@
<template>
<div h-full :class="{ zen: isZenMode }">
<div v-if="isMastoInitialised" v-show="showUserSwitcherSidebar" fixed h-full hidden lg:block bg-code border-r-1 border-base>
<div v-if="isMastoInitialised && showUserSwitcherSidebar" fixed h-full hidden lg:block bg-code border-r-1 border-base>
<UserPicker />
</div>
<main flex w-full mxa lg:max-w-80rem :class="isMastoInitialised && showUserSwitcherSidebar ? 'lg:pl-20' : ''">
<main flex w-full mxa lg:max-w-80rem :class="isMastoInitialised && showUserSwitcherSidebar ? 'user-switcher-sidebar' : ''">
<aside class="hidden sm:flex w-1/8 md:w-1/6 justify-end lg:w-1/4 zen-hide" relative>
<div sticky top-0 w-20 lg:w-auto h-screen flex="~ col">
<div sticky top-0 w-20 lg:w-100 h-screen flex="~ col">
<slot name="left">
<NavTitle mx3 mt4 mb2 self-start />
<div flex="~ col" overflow-y-auto justify-between h-full>
@ -61,3 +61,11 @@
<ModalContainer />
</div>
</template>
<style scoped>
@media (max-width: 1500px) and (min-width: 1024px) {
.user-switcher-sidebar {
padding-left: min(5rem, calc((1500px - 100vw) / 2));
}
}
</style>