From c4f33e23688ae79e3e4158dfd44b05460c384cb0 Mon Sep 17 00:00:00 2001
From: Felix Brabetz <lixatnz@gmail.com>
Date: Sat, 16 May 2026 04:47:38 +0200
Subject: [PATCH] Enhance Easter Egg with a visual award certificate on
 completion

---
 src/components/EasterEgg.astro | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/EasterEgg.astro b/src/components/EasterEgg.astro
index e468618..9a4bf30 100644
--- a/src/components/EasterEgg.astro
+++ b/src/components/EasterEgg.astro
@@ -32,12 +32,22 @@
                 </div>
             </div>
             
-            <button @click="plantClicks += 10; if(plantClicks >= 100) { plantClicks = 100; blooming = true; }" :disabled="blooming" class="mt-6 w-full py-3 bg-emerald-600 hover:bg-emerald-700 disabled:bg-emerald-900 text-white font-semibold rounded-lg text-xs uppercase tracking-widest transition-colors">
-                <span x-show="!blooming">Gießen 💧</span>
-                <span x-show="blooming">Prächtig erblüht! 🎉</span>
+            <button x-show="!blooming" @click="plantClicks += 10; if(plantClicks >= 100) { plantClicks = 100; blooming = true; }" class="mt-6 w-full py-3 bg-emerald-600 hover:bg-emerald-700 text-white font-semibold rounded-lg text-xs uppercase tracking-widest transition-colors">
+                Gießen 💧
             </button>
             
-            <p x-show="blooming" class="text-emerald-400 text-xs mt-4 font-semibold">Du hast den echten Brabetz-Grünen-Daumen!</p>
+            <!-- Award -->
+            <div x-show="blooming" x-cloak class="mt-6 text-center" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 scale-95" x-transition:enter-end="opacity-100 scale-100">
+                <div class="text-5xl mb-3">🏆</div>
+                <h4 class="text-lg font-luxury font-bold text-white mb-1">Auszeichnung verliehen!</h4>
+                <p class="text-stone-400 text-xs mb-4 font-light">Hiermit verleihen wir dir den</p>
+                
+                <div class="bg-amber-500/10 border border-amber-500/30 p-4 rounded-lg inline-block mb-4">
+                    <span class="text-amber-500 font-bold uppercase tracking-wider text-xs">Goldener Brabetz-Grüner-Daumen</span>
+                </div>
+                
+                <p class="text-stone-500 text-[10px] font-mono leading-tight">Zertifikats-ID: BRB-PLX-2026-NICE</p>
+            </div>
         </div>
     </div>