pref: update transition

src/App.vue

@@ -21,5 +21,9 @@ useHead({
 </script>
 
 <template>
-  <RouterView />
+  <router-view v-slot="{ Component, route }">
+    <transition name="fade" mode="out-in">
+      <component :is="Component" :key="route.path" />
+    </transition>
+  </router-view>
 </template>

src/layouts/default.vue

@@ -2,13 +2,11 @@
   <v-app class="flex flex-col">
     <Nav />
 
-    <div style="--v-layout-top: 25px;--v-layout-bottom: 70px;">
-      <router-view v-slot="{ Component, route }">
-        <transition name="fade" mode="out-in">
-          <div :key="route.path" class="prose max-w-110ch m-auto p-3">
+    <div>
+      <router-view v-slot="{ Component }">
+        <div class="prose max-w-110ch m-auto p-3">
           <component :is="Component" />
         </div>
-        </transition>
       </router-view>
     </div>
   </v-app>

src/layouts/index.vue

@@ -2,14 +2,6 @@
   <v-app class="flex flex-col">
     <Nav />
 
-    <div style="--v-layout-top: 25px" class="m-auto">
-      <router-view v-slot="{ Component, route }">
-        <transition name="fade" mode="out-in">
-          <div :key="route.path" class="prose max-w-110ch m-auto p-3">
-            <component :is="Component" />
-          </div>
-        </transition>
-      </router-view>
-    </div>
+    <router-view class="prose max-w-110ch m-auto p-3" />
   </v-app>
 </template>