diff --git a/src/lib/Leaderboard.svelte b/src/lib/Leaderboard.svelte index b05aec1..ffc0727 100644 --- a/src/lib/Leaderboard.svelte +++ b/src/lib/Leaderboard.svelte @@ -26,8 +26,9 @@ ol { font-size: 24px; - overflow-y: auto; + overflow: hidden auto; margin: 0 0 0 10px; /* Counter li padding */ + max-width: min(500px, 100%); } li { diff --git a/src/lib/PlayerLabel.svelte b/src/lib/PlayerLabel.svelte index 8896229..4c7b3d9 100644 --- a/src/lib/PlayerLabel.svelte +++ b/src/lib/PlayerLabel.svelte @@ -18,8 +18,13 @@ src={player.picture || DEFAULT_USER_ICON} width="32" /> - {name} - {#if player.points} - {player.points} points{/if} + + {name} + {#if player.points !== undefined} + - + {player.points} points + {/if} + diff --git a/src/routes/game/[gameId=id]/end/+page.svelte b/src/routes/game/[gameId=id]/end/+page.svelte index 47bc60c..c3609c7 100644 --- a/src/routes/game/[gameId=id]/end/+page.svelte +++ b/src/routes/game/[gameId=id]/end/+page.svelte @@ -97,6 +97,7 @@ place-items: center; & > * { + min-width: 0; box-sizing: border-box; } } @@ -120,11 +121,12 @@ #leaderboard-container { display: flex; flex-direction: column; + max-width: 100%; } @media (aspect-ratio > 1) { #center-container { - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, minmax(0, 1fr)); } #leaderboard-container { @@ -138,7 +140,7 @@ @media (aspect-ratio < 1) { #center-container { - grid-template-rows: 1fr 1fr; + grid-template-rows: repeat(2, minmax(0, 1fr)); } #leaderboard-container {