From 9fdfe27fb912acd7356086c16c92924e4dde17c5 Mon Sep 17 00:00:00 2001
From: team3 <team3@mitho-media.de>
Date: Wed, 7 Oct 2026 16:57:36 +0200
Subject: [PATCH] update

---
 frontend/src/components/InfoTab.vue | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/InfoTab.vue b/frontend/src/components/InfoTab.vue
index b8f1282..6095775 100644
--- a/frontend/src/components/InfoTab.vue
+++ b/frontend/src/components/InfoTab.vue
@@ -203,7 +203,7 @@ onUnmounted(() => abbestellen?.())
             <div
               v-if="blaetter.length || kontostand !== null"
               class="rolle"
-              :style="{ animationDuration: `${5 + blaetter.length * 1.5}s` }"
+              :style="{ animationDuration: `1s, ${5 + blaetter.length * 1.5}s` }"
               @animationiteration="neuAnsetzen"
             >
               <template v-if="kontostand !== null">
@@ -323,10 +323,22 @@ onUnmounted(() => abbestellen?.())
   left: 0;
   width: 100%;
   text-align: center;
-  /* Die erste Zeile startet in der Bildmitte, steht eine Sekunde, dann
-     rollt alles nach oben hinaus */
-  animation: abspann linear infinite;
-  animation-delay: 1s;
+  /* Die erste Zeile startet in der Bildmitte und blendet eine Sekunde
+     lang ein, dann rollt alles nach oben hinaus. Die Dauern setzt die
+     Vorlage: 1 s fürs Einblenden, der Rest nach Anzahl der Namen */
+  animation:
+    einblenden ease-out both,
+    abspann linear infinite;
+  animation-delay: 0s, 1s;
+}
+
+@keyframes einblenden {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
 }
 
 .schirm:hover .rolle {