From f507dce94af5da0746ee4bfb3459cd8218e852a0 Mon Sep 17 00:00:00 2001
From: Chaoscaot <max@maxsp.de>
Date: Wed, 31 Dec 2025 13:25:10 +0100
Subject: [PATCH] feat: Enhance group display with hover effect for team
 visibility

---
 src/components/event/GroupDisplay.svelte | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/event/GroupDisplay.svelte b/src/components/event/GroupDisplay.svelte
index fd5fd40..6f1e91e 100644
--- a/src/components/event/GroupDisplay.svelte
+++ b/src/components/event/GroupDisplay.svelte
@@ -5,6 +5,7 @@
     import EventCardOutline from "./EventCardOutline.svelte";
     import EventTeamChip from "./EventTeamChip.svelte";
     import EventFightChip from "./EventFightChip.svelte";
+    import { teamHoverService } from "./team-hover.svelte";
 
     const {
         event,
@@ -39,6 +40,8 @@
         if (currentRound.length) rounds.push(currentRound);
         return rounds;
     }
+
+    const hover = $teamHoverService;
 </script>
 
 {#each config.groups as groupId}
@@ -58,7 +61,8 @@
             </EventCard>
         </div>
         {#each rounds as round, index}
-            <div>
+            {@const teams = Array.from(new Set(round.flatMap((f) => [f.redTeam, f.blueTeam])))}
+            <div class="{hover.currentHover && !teams.some((t) => t?.id === hover.currentHover) ? 'opacity-30' : ''} transition-opacity">
                 <EventCard title="Runde {index + 1}">
                     {#each round as fight}
                         <EventFightChip {event} {fight} {group} />