Animation Spieler

src/pages/TeamDetailPage.tsx

@@ -19,8 +19,9 @@ type Team = {
   liga?: string;
   beschreibung?: string;
   trainingszeiten?: string;
+  trainingsort?: string;
   sucht_spieler?: boolean;
-  karussell_bilder?: string[]; // Wichtig: als Array erwartet!
+  karussell_bilder?: string[];
   players: Player[];
 };
 
@@ -35,7 +36,6 @@ const TeamDetailPage = () => {
         const res = await fetch(`${apiBase}/api/teams/${id}`);
         const data = await res.json();
 
-        // Falls karussell_bilder als String (JSON) kommt → parsen
         if (typeof data.karussell_bilder === "string") {
           data.karussell_bilder = JSON.parse(data.karussell_bilder);
         }
@@ -88,6 +88,9 @@ const TeamDetailPage = () => {
         <p className="text-sm text-frog-700 font-medium mt-2">
           Training: {team.trainingszeiten || "Nicht angegeben"}
         </p>
+        {team.trainingsort && (
+          <p className="text-sm text-gray-500 mt-1">Ort: {team.trainingsort}</p>
+        )}
       </div>
 
       {/* Join Button */}
@@ -104,7 +107,7 @@ const TeamDetailPage = () => {
         {team.players.map((player) => (
           <div
             key={player.id}
-            className="bg-white rounded-lg shadow-md p-4 flex flex-col items-center text-center hover:shadow-lg transition"
+            className="bg-white rounded-lg shadow-md p-4 flex flex-col items-center text-center transform transition duration-300 hover:-translate-y-1 hover:shadow-xl"
           >
             <img
               src={