Stable task transitions and animations

src/index.css

@@ -77,18 +77,6 @@
       transform: translateX(3px);
     }
   }
-
-  --animate-task-enter: task-enter 0.25s ease-out backwards;
-
-  @keyframes task-enter {
-    0% {
-      opacity: 0;
-    }
-
-    100% {
-      opacity: 1;
-    }
-  }
 }
 
 :root {

src/views/CriticalView.tsx

@@ -31,7 +31,7 @@ export const CriticalView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}

src/views/DigInView.tsx

@@ -36,7 +36,7 @@ export const DigInView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}

src/views/PriorityView.tsx

@@ -31,7 +31,7 @@ export const PriorityView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}

src/views/ProgressView.tsx

@@ -38,7 +38,7 @@ export const ProgressView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}

src/views/SnowballView.tsx

@@ -36,7 +36,7 @@ export const SnowballView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}

src/views/UrgencyView.tsx

@@ -35,7 +35,7 @@ export const UrgencyView: Component = () => {
             <div class="grid grid-cols-1 gap-3 w-full" ref={listRef}>
                 <For each={displayedTasks()}>
                     {(task) => (
-                        <div class="animate-task-enter w-full min-w-0">
+                        <div class="w-full min-w-0">
                             <TaskCard task={task} isShaking={shakingTaskIds().includes(task.id)} />
                         </div>
                     )}