From e915ba4919df5906afc42673e9915f7c65b87d73 Mon Sep 17 00:00:00 2001 From: Stan Runge Date: Sun, 1 Mar 2026 01:08:16 +0000 Subject: [PATCH] feat: refactor leaderboard display to use tables for better structure and readability --- src/routes/(app)/leaderboard/+page.svelte | 299 ++++++++++------------ 1 file changed, 131 insertions(+), 168 deletions(-) diff --git a/src/routes/(app)/leaderboard/+page.svelte b/src/routes/(app)/leaderboard/+page.svelte index c53cd26..0925fc4 100644 --- a/src/routes/(app)/leaderboard/+page.svelte +++ b/src/routes/(app)/leaderboard/+page.svelte @@ -57,131 +57,109 @@ {#if activeTab === 'players'} -
+
{#if data.topPlayers.length === 0}

No ranked players yet. Play some matches!

{:else} -
- # - - Player - ELO - W/L - Win % -
- - {#each data.topPlayers as p} - {@const medal = rankBadge(p.rank)} -
- - - {medal ? medal.emoji : p.rank} - - - - {#if p.image} - - {:else} -
- {p.name.charAt(0).toUpperCase()} -
- {/if} - - - {p.name} - - - {p.elo} - - - - {p.wins}/{p.losses} - - - - - {p.winRate}{p.winRate !== '—' ? '%' : ''} - -
- {/each} + + + + + + + + + + + + + {#each data.topPlayers as p} + {@const medal = rankBadge(p.rank)} + + + + + + + + + {/each} + +
#PlayerELOW/LWin %
+ {medal ? medal.emoji : p.rank} + + {#if p.image} + + {:else} +
+ {p.name.charAt(0).toUpperCase()} +
+ {/if} + 		{p.name}{p.elo} + {p.wins}/{p.losses} + + {p.winRate}{p.winRate !== '—' ? '%' : ''} +
{/if}
{/if} {#if activeTab === 'teams'} -
+
{#if data.topTeams.length === 0}

No team results yet.

{:else} -
- # - - Team - Wins - Matches -
- - {#each data.topTeams as t} - {@const medal = rankBadge(t.rank)} -
- - - {medal ? medal.emoji : t.rank} - - - - {#if t.avatarUrl} - - {:else} -
- {t.name.charAt(0).toUpperCase()} -
- {/if} - - -
- {t.name} - {#if t.isPersonal} - (solo) - {/if} -

{t.memberCount} member{t.memberCount !== 1 ? 's' : ''}

-
- - - {t.wins} - - - {t.totalMatches} -
- {/each} + + + + + + + + + + + + {#each data.topTeams as t} + {@const medal = rankBadge(t.rank)} + + + + + + + + {/each} + +
#TeamWinsMatches
+ {medal ? medal.emoji : t.rank} + + {#if t.avatarUrl} + + {:else} +
+ {t.name.charAt(0).toUpperCase()} +
+ {/if} + 		+ {t.name} + {#if t.isPersonal} + (solo) + {/if} +

{t.memberCount} member{t.memberCount !== 1 ? 's' : ''}

+ 		{t.wins}{t.totalMatches}
{/if}
{/if} {#if activeTab === 'scores'} -
+
{#if data.highScores.length === 0}

No scores recorded yet.

@@ -190,71 +168,56 @@

Ranked by pp (performance points) when available, then score

-
- # - - Player - Map - PP - Score - Acc -
- - {#each data.highScores as s} - {@const medal = rankBadge(s.rank)} -
- - - {medal ? medal.emoji : s.rank} - - - - {#if s.playerImage} - - {:else} -
- {s.playerName.charAt(0).toUpperCase()} -
- {/if} - - -
- {s.playerName} -

- {s.matchName} -

-
- - - - {s.mapCategory}{s.mapOrder} - - - - - {s.pp != null ? `${Math.round(s.pp)}pp` : '—'} - - - - - {s.score.toLocaleString()} - - - - - {s.accuracy > 0 ? `${(s.accuracy * 100).toFixed(1)}%` : '—'} - -
- {/each} + + + + + + + + + + + + + + {#each data.highScores as s} + {@const medal = rankBadge(s.rank)} + + + + + + + + + + {/each} + +
#PlayerMapPPScoreAcc
+ {medal ? medal.emoji : s.rank} + + {#if s.playerImage} + + {:else} +
+ {s.playerName.charAt(0).toUpperCase()} +
+ {/if} + 		+ {s.playerName} +

+ {s.matchName} +

+ 		+ {s.mapCategory}{s.mapOrder} + + {s.pp != null ? `${Math.round(s.pp)}pp` : '—'} + + {s.score.toLocaleString()} + + {s.accuracy > 0 ? `${(s.accuracy * 100).toFixed(1)}%` : '—'} +
{/if}
{/if}