feat(ui): use view transitions for realtime feed

2025-06-09 22:27:29 -06:00
parent 21274ba1e0
commit 0d2ffee841
3 changed files with 26 additions and 3 deletions
--- a/ui/src/views/RealtimeFeedView.vue
+++ b/ui/src/views/RealtimeFeedView.vue
@@ -79,4 +79,19 @@ onMounted(() => {
 .feed-list::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
 }
+
+:global(::view-transition-old(.realtime-event)),
+:global(::view-transition-new(.realtime-event)) {
+  animation: slide 0.25s ease both;
+}
+@keyframes slide {
+  from {
+    transform: translateY(var(--view-transition-slide-y, 0));
+    opacity: 0;
+  }
+  to {
+    transform: none;
+    opacity: 1;
+  }
+}
 </style>