feat: ✨ Add small exit animation to timelines

versia-pub · Apr 27, 2024 · 83ff97d · 83ff97d
1 parent b14a616
commit 83ff97d
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/components/timelines/timeline.vue b/components/timelines/timeline.vue
@@ -1,8 +1,10 @@
 <template>
     <ClientOnly>
-
-        <SocialElementsNotesNote @delete="emits('delete', note.id)" v-for="note of timeline" :key="note.id"
-            :note="note" />
+        <TransitionGroup leave-active-class="ease-in duration-200" leave-from-class="scale-100 opacity-100"
+            leave-to-class="opacity-0 scale-90">
+            <SocialElementsNotesNote @delete="emits('delete', note.id)" v-for="note of timeline" :key="note.id"
+                :note="note" />
+        </TransitionGroup>
         <span ref="skeleton"></span>
         <SocialElementsNotesNote v-for="index of 5" v-if="!hasReachedEnd" :skeleton="true" />