ui: adjust layout

components/modal/ModalContainer.vue

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

components/modal/ModalDrawer.vue

@@ -56,7 +56,7 @@ watchOnce(modelValue, () => {
       @click="modelValue = false"
     />
     <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"
       :style="modelValue ? {} : { transform }"
     >

layouts/default.vue

@@ -4,21 +4,11 @@
       <div class="hidden md:block w-1/4 zen-hide" relative>
         <div sticky top-0 h-screen flex="~ col">
           <slot name="left">
-            <NavTitle p5 />
-            <div border="t base" flex="~ col" overflow-y-auto>
-              <NavSide border="b base" />
+            <NavTitle px6 pt6 pb4 />
+            <div flex="~ col" overflow-y-auto>
+              <NavSide />
               <PublishButton v-if="currentUser" m5 />
               <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>
           </slot>
         </div>
@@ -31,6 +21,16 @@
         <div sticky top-0 h-screen flex="~ col">
           <slot name="right">
             <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 />
             <NavFooter />
           </slot>