PWA Frabe angepasst + Namen farblich gemacht

public/script.js

@@ -66,6 +66,7 @@ function setBackgroundAndImage(person, animate = true) {
   const file = person === "A" ? "img/a.png" : "img/b.png";
   const label = person === "A" ? "Lumpia" : "Pierogi";
   const bgImage = person === "A" ? "url('img/bgA.jpg')" : "url('img/bgB.jpg')";
+  const nameColor = person === "A" ? "#2ecc71" : "#e74c3c"; // Grün für A, Rot für B
 
   // Set background immediately (smooth transition via CSS)
   document.body.style.backgroundImage = bgImage;
@@ -75,10 +76,11 @@ function setBackgroundAndImage(person, animate = true) {
   if (animate) {
     img.classList.add("rotate");
     
-    // Change image and name in the middle of rotation
+    // Change image, name and color in the middle of rotation
     setTimeout(() => {
       img.src = file;
       nameEl.textContent = label;
+      nameEl.style.color = nameColor;
     }, 300); // Half of rotation duration
     
     // Remove rotation class after animation
@@ -89,6 +91,7 @@ function setBackgroundAndImage(person, animate = true) {
     // First load - no animation
     img.src = file;
     nameEl.textContent = label;
+    nameEl.style.color = nameColor;
   }
 }