From 52ae934bdedc0f498f73d94c696c8e9bf8f59b50 Mon Sep 17 00:00:00 2001
From: Stan Runge <stan@stanrunge.dev>
Date: Sun, 1 Mar 2026 19:49:10 +0100
Subject: [PATCH] feat: refactor match display; reorganize mappool and time
 display for clarity

---
 src/routes/(app)/+page.svelte         | 11 ++++-------
 src/routes/(app)/matches/+page.svelte | 15 ++++-----------
 2 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte
index 02061f9..6d13e2c 100644
--- a/src/routes/(app)/+page.svelte
+++ b/src/routes/(app)/+page.svelte
@@ -340,13 +340,10 @@
 									{/if}
 									<span class="text-sm font-600">{p2?.team.name ?? '?'}</span>
 								</div>
-								<p class="mt-0.5 text-xs text-text-secondary">
-									{m.name ? `${m.name} · ` : ''}BO{config.bestOf}
-									{#if m.mappool}
-										&middot; <a href='/mappools/{m.mappool.id}' onclick={(e) => e.stopPropagation()} class='hover:text-accent hover:underline'>{m.mappool.name}</a>{#if avgSR(m.mappool)} {" "} (<span>{avgSR(m.mappool)}★</span>){/if}
-									{/if}
-									&middot; {timeAgo(m.finishedAt ?? m.createdAt)}
-								</p>
+								<p class="mt-0.5 text-xs text-text-secondary">{m.name ? `${m.name} · ` : ''}BO{config.bestOf} &middot; {timeAgo(m.finishedAt ?? m.createdAt)}</p>
+								{#if m.mappool}
+									<p class="text-xs text-text-secondary"><a href='/mappools/{m.mappool.id}' onclick={(e) => e.stopPropagation()} class='hover:text-accent hover:underline'>{m.mappool.name}</a>{#if avgSR(m.mappool)} ({avgSR(m.mappool)}★){/if}</p>
+								{/if}
 							</div>
 
 							{#if m.state === 'FINISHED' && m.winnerId}
diff --git a/src/routes/(app)/matches/+page.svelte b/src/routes/(app)/matches/+page.svelte
index c53de8a..eda540f 100644
--- a/src/routes/(app)/matches/+page.svelte
+++ b/src/routes/(app)/matches/+page.svelte
@@ -286,17 +286,10 @@
 							{/if}
 							<span class="text-sm font-600">{p2?.team.name ?? '?'}</span>
 						</div>
-						<p class="mt-0.5 text-xs text-text-secondary">
-							{m.name ? `${m.name} · ` : ''}BO{config.bestOf}
-							{#if m.mappool}
-								&middot; <a href='/mappools/{m.mappool.id}' onclick={(e) => e.stopPropagation()} class='hover:text-accent hover:underline'>{m.mappool.name}</a>{#if avgSR(m.mappool)}  {" "} (<span>{avgSR(m.mappool)}★</span>){/if}
-							{/if}
-							{#if m.finishedAt}
-								&middot; {timeAgo(m.finishedAt)}
-							{:else if m.createdAt}
-								&middot; {timeAgo(m.createdAt)}
-							{/if}
-						</p>
+						<p class="mt-0.5 text-xs text-text-secondary">{m.name ? `${m.name} · ` : ''}BO{config.bestOf}{#if m.finishedAt} &middot; {timeAgo(m.finishedAt)}{:else if m.createdAt} &middot; {timeAgo(m.createdAt)}{/if}</p>
+						{#if m.mappool}
+							<p class="text-xs text-text-secondary"><a href='/mappools/{m.mappool.id}' onclick={(e) => e.stopPropagation()} class='hover:text-accent hover:underline'>{m.mappool.name}</a>{#if avgSR(m.mappool)} ({avgSR(m.mappool)}★){/if}</p>
+						{/if}
 					</div>
 
 					<!-- Winner indicator -->