added layout transition

frontend/nuxt.config.ts

@@ -3,10 +3,14 @@ export default defineNuxtConfig({
     compatibilityDate: "2024-11-01",
     ssr: true,
     devtools: { enabled: true },
-    css: ["~/assets/css/tailwind.css", "swiper/css", "animate.css/animate.min.css"],
+    css: [
+        "~/assets/css/tailwind.css",
+        "swiper/css",
+        "animate.css/animate.min.css",
+    ],
 
     routeRules: {
-        "/products": { prerender: false, ssr: false }
+        "/products": { prerender: false, ssr: false },
     },
 
     app: {
@@ -15,22 +19,29 @@ export default defineNuxtConfig({
                 "animate__animated animate__fadeIn animate__faster",
             leaveActiveClass:
                 "animate__animated animate__fadeOut animate__faster",
-            mode: "out-in"
-        }
+            mode: "out-in",
+        },
+        layoutTransition: {
+            enterActiveClass:
+                "animate__animated animate__fadeIn animate__faster",
+            leaveActiveClass:
+                "animate__animated animate__fadeOut animate__faster",
+            mode: "out-in",
+        },
     },
 
     postcss: {
         plugins: {
             "@tailwindcss/postcss": {},
-            autoprefixer: {}
-        }
+            autoprefixer: {},
+        },
     },
 
     components: [
         {
             path: "~/components",
-            pathPrefix: false
-        }
+            pathPrefix: false,
+        },
     ],
 
     icon: {
@@ -38,9 +49,9 @@ export default defineNuxtConfig({
         customCollections: [
             {
                 prefix: "ci",
-                dir: "./public/icons"
-            }
-        ]
+                dir: "./public/icons",
+            },
+        ],
     },
 
     modules: [
@@ -51,20 +62,20 @@ export default defineNuxtConfig({
                     "DM Sans": "100..900",
                     Inter: "100..900",
                     download: true,
-                    inject: false
-                }
-            }
+                    inject: false,
+                },
+            },
         ],
         "@nuxt/icon",
         "reka-ui/nuxt",
         "@vueuse/nuxt",
         "@formkit/auto-animate/nuxt",
-        '@nuxt/test-utils/module'
+        "@nuxt/test-utils/module",
     ],
 
     runtimeConfig: {
         public: {
-            API_BASE_URL: "https://api.heymlz.com"
-        }
-    }
+            API_BASE_URL: "https://api.heymlz.com",
+        },
+    },
 });