🎉 feat: animation

Author: SaltyAom

docs/components/fern/sponsor.vue

@@ -1,8 +1,5 @@
 <template>
-    <section
-        class="flex flex-col w-full max-w-5xl mx-auto mt-4 fern-gap"
-    >
-    	<div ref="scope" />
+    <section class="flex flex-col w-full max-w-5xl mx-auto mt-4 fern-gap" ref="scope">
         <motion.h2
             class="text-5xl lg:text-6xl !leading-[4rem] sm:text-center font-bold mb-4 bg-clip-text text-transparent bg-gradient-to-tl from-rose-400 to-fuchsia-400"
             v-bind="flyIn()"
@@ -84,11 +81,7 @@
                                 }}
                             </h5>
                             <p>
-                                {{
-                                    dayjs()
-                                        .from(dayjs(sponsor.createdAt))
-                                        .replace('in', 'for')
-                                }}
+                                {{ sponsor.duration }}
                             </p>
                         </section>
                     </a>
@@ -138,11 +131,7 @@
                                 }}
                             </h6>
                             <p>
-                                {{
-                                    dayjs()
-                                        .from(dayjs(sponsor.createdAt))
-                                        .replace('in', 'for')
-                                }}
+                                {{ sponsor.duration }}
                             </p>
                         </section>
                     </a>