ui: adjust layout

This commit is contained in:
Anthony Fu 2022-11-25 21:40:57 +08:00
parent 4632d7d4ab
commit fd410010ca
3 changed files with 16 additions and 16 deletions

View file

@ -3,8 +3,8 @@ import { isPreviewHelpOpen, isPublishDialogOpen, isSigninDialogOpen, isUserSwitc
</script> </script>
<template> <template>
<ModalDrawer v-model="isUserSwitcherOpen"> <ModalDrawer v-model="isUserSwitcherOpen" direction="right">
<UserSwitcher /> <UserSwitcher min-w-100 />
</ModalDrawer> </ModalDrawer>
<ModalDialog v-model="isSigninDialogOpen"> <ModalDialog v-model="isSigninDialogOpen">
<UserSignIn m6 /> <UserSignIn m6 />

View file

@ -56,7 +56,7 @@ watchOnce(modelValue, () => {
@click="modelValue = false" @click="modelValue = false"
/> />
<div <div
bg-base border border-base absolute transition-all duration-200 ease-out bg-base border-base absolute transition-all duration-200 ease-out
:class="positionClass" :class="positionClass"
:style="modelValue ? {} : { transform }" :style="modelValue ? {} : { transform }"
> >

View file

@ -4,21 +4,11 @@
<div class="hidden md:block w-1/4 zen-hide" relative> <div class="hidden md:block w-1/4 zen-hide" relative>
<div sticky top-0 h-screen flex="~ col"> <div sticky top-0 h-screen flex="~ col">
<slot name="left"> <slot name="left">
<NavTitle p5 /> <NavTitle px6 pt6 pb4 />
<div border="t base" flex="~ col" overflow-y-auto> <div flex="~ col" overflow-y-auto>
<NavSide border="b base" /> <NavSide />
<PublishButton v-if="currentUser" m5 /> <PublishButton v-if="currentUser" m5 />
<div flex-auto /> <div flex-auto />
<AccountInfo
v-if="currentUser"
tabindex="0"
m5 p2 rounded-full
hover:bg-active cursor-pointer transition-100
:account="currentUser?.account"
:link="false"
@keydown.enter="openUserSwitcher"
@click="openUserSwitcher"
/>
</div> </div>
</slot> </slot>
</div> </div>
@ -31,6 +21,16 @@
<div sticky top-0 h-screen flex="~ col"> <div sticky top-0 h-screen flex="~ col">
<slot name="right"> <slot name="right">
<UserSignInEntry v-if="!currentUser" /> <UserSignInEntry v-if="!currentUser" />
<AccountInfo
v-if="currentUser"
tabindex="0"
m5 p2 rounded-full
hover:bg-active cursor-pointer transition-100
:account="currentUser?.account"
:link="false"
@keydown.enter="openUserSwitcher"
@click="openUserSwitcher"
/>
<div flex-auto /> <div flex-auto />
<NavFooter /> <NavFooter />
</slot> </slot>