🐛 Setup page transitions

Bugged for some reason, the old page stays before the new page loading at the end

src/routes/shop/__layout.svelte

@@ -1,6 +1,8 @@
 <script lang="ts">
     import { onMount } from 'svelte'
+    import { fade } from 'svelte/transition'
     import { shopLocations, cartOpen, cartNotifications } from '$utils/stores/shop'
+    import { DURATION } from '$utils/contants'
     // Components
     import Metas from '$components/Metas.svelte'
     import SiteTitle from '$components/atoms/SiteTitle.svelte'
@@ -57,7 +59,10 @@
     image=""
 />
 
-<main class="shop-page">
+<main class="shop-page"
+    in:fade={{ duration: DURATION.PAGE_IN, delay: DURATION.PAGE_OUT }}
+    out:fade={{ duration: DURATION.PAGE_OUT }}
+>
     <Cart />
 
     <section class="shop-page__intro" bind:this={introEl}>