Initial commit

2026-01-02 17:52:07 +01:00
parent b29bd25170
commit 972bafc4e0
36 changed files with 8742 additions and 0 deletions
@@ -0,0 +1,59 @@
+"use client";
+
+import { AnimatePresence, motion } from "framer-motion";
+import { useEffect, useState } from "react";
+
+interface ConfettiProps {
+    show: boolean;
+}
+
+export default function Confetti({ show }: ConfettiProps) {
+    const [particles, setParticles] = useState<number[]>([]);
+
+    useEffect(() => {
+        if (show) {
+            setParticles(Array.from({ length: 50 }, (_, i) => i));
+        } else {
+            setParticles([]);
+        }
+    }, [show]);
+
+    return (
+        <AnimatePresence>
+            {show && (
+                <div className="fixed inset-0 pointer-events-none z-50 overflow-hidden">
+                    {particles.map((i) => (
+                        <motion.div
+                            key={i}
+                            initial={{
+                                x: Math.random() * window.innerWidth,
+                                y: -20,
+                                rotate: 0,
+                                scale: Math.random() * 0.5 + 0.5,
+                            }}
+                            animate={{
+                                y: window.innerHeight + 20,
+                                rotate: Math.random() * 720 - 360,
+                            }}
+                            exit={{ opacity: 0 }}
+                            transition={{
+                                duration: Math.random() * 2 + 2,
+                                ease: "linear",
+                            }}
+                            className="absolute w-3 h-3 rounded-sm"
+                            style={{
+                                backgroundColor: [
+                                    "#f43f5e",
+                                    "#8b5cf6",
+                                    "#3b82f6",
+                                    "#10b981",
+                                    "#f59e0b",
+                                ][Math.floor(Math.random() * 5)],
+                            }}
+                        />
+                    ))}
+                </div>
+            )}
+        </AnimatePresence>
+    );
+}