From 209f9c10ddc5a9298396434398af9ef92f8eecf3 Mon Sep 17 00:00:00 2001
From: nessi <sascha@nesterovic.cc>
Date: Sun, 2 Aug 2026 11:47:16 +0200
Subject: [PATCH] Reduce winner celebration confetti intensity and duration for
 subtler animation effect
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Simplified confetti animation by removing continuous rain effect and reducing burst parameters. Changed color palette to warmer gold/green tones. Decreased particle count from 170 to 55 per burst, reduced spread from 95° to 72°, lowered velocity from 42 to 28, and adjusted positioning. Added gravity, ticks, and scalar parameters for more controlled particle behavior. Shortened total celebration duration from 5500ms to 4200ms.
---
 frontend/src/components/WinnerCelebration.jsx | 41 ++++++++-----------
 1 file changed, 16 insertions(+), 25 deletions(-)

diff --git a/frontend/src/components/WinnerCelebration.jsx b/frontend/src/components/WinnerCelebration.jsx
index f02c368..0790368 100644
--- a/frontend/src/components/WinnerCelebration.jsx
+++ b/frontend/src/components/WinnerCelebration.jsx
@@ -18,48 +18,39 @@ export default function WinnerCelebration({ open, winnerName, onClose }) {
       window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 
     if (!reduceMotion) {
-      const end = Date.now() + 4500;
-
       // WICHTIG: über dem Overlay rendern
       const TOP_Z = 2147483647;
 
       // hellere Farben damit’s auch auf dark overlay knallt
-      const bright = ["#ffffff", "#ffd166", "#06d6a0", "#4cc9f0", "#f72585"];
+      const bright = ["#ffffff", "#e9d8a6", "#c9aa62", "#7cffa8"];
 
       // 2 große Bursts
       confetti({
-        particleCount: 170,
-        spread: 95,
-        startVelocity: 42,
-        origin: { x: 0.12, y: 0.62 },
+        particleCount: 55,
+        spread: 72,
+        startVelocity: 28,
+        gravity: 0.85,
+        ticks: 150,
+        scalar: 0.82,
+        origin: { x: 0.22, y: 0.62 },
         zIndex: TOP_Z,
         colors: bright,
       });
       confetti({
-        particleCount: 170,
-        spread: 95,
-        startVelocity: 42,
-        origin: { x: 0.88, y: 0.62 },
+        particleCount: 55,
+        spread: 72,
+        startVelocity: 28,
+        gravity: 0.85,
+        ticks: 150,
+        scalar: 0.82,
+        origin: { x: 0.78, y: 0.62 },
         zIndex: TOP_Z,
         colors: bright,
       });
 
-      // “Rain” über die Zeit
-      (function frame() {
-        confetti({
-          particleCount: 8,
-          spread: 75,
-          startVelocity: 34,
-          origin: { x: Math.random(), y: Math.random() * 0.18 },
-          scalar: 1.05,
-          zIndex: TOP_Z,
-          colors: bright,
-        });
-        if (Date.now() < end) requestAnimationFrame(frame);
-      })();
     }
 
-    const t = setTimeout(() => onClose?.(), 5500);
+    const t = setTimeout(() => onClose?.(), 4200);
 
     return () => {
       clearTimeout(t);