diff --git a/src/App.vue b/src/App.vue
index 12e7d7a..177e63f 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -68,17 +68,17 @@ provide('loading', loading)
         v-if="!sideBarCollapsed"
       />
     </Transition>
+    <Transition name="overlay">
+      <div
+        class="absolute bottom-0 left-0 right-0 top-0 z-40 cursor-pointer bg-neutral-800 bg-opacity-60 transition-opacity duration-200 sm:hidden"
+        @click="sideBarCollapsed = true"
+        v-if="!sideBarCollapsed"
+      />
+    </Transition>
     <main
       class="transition[margin-left] z-10 mx-auto flex h-full w-full max-w-app flex-col overflow-y-auto border-x-[1px] bg-white px-10 py-6 duration-200 ease-out max-sm:px-4 max-sm:py-3"
       :class="sideBarCollapsed ? 'ml-0' : 'sm:ml-sidebar'"
     >
-      <Transition name="overlay">
-        <div
-          class="absolute bottom-0 left-0 right-0 top-0 z-40 cursor-pointer bg-neutral-800 bg-opacity-60 transition-opacity duration-200 sm:hidden"
-          @click="sideBarCollapsed = true"
-          v-if="!sideBarCollapsed"
-        />
-      </Transition>
       <template v-if="!loading">
         <Note
           v-if="activeViewMode.name === 'Note' && activeNote"