added TopPlayerCard

This commit is contained in:
Niklas Kapelle 2025-05-07 19:14:08 +02:00
parent 3ce3fabc81
commit 82c98435f6
Signed by: niklas
GPG Key ID: 4EB651B36D841D16

View File

@ -0,0 +1,27 @@
<script lang="ts">
import { link } from "@dvcol/svelte-simple-router/router";
let {
place,
name,
elo,
playerID,
}: { place: number; name: string; elo: number; playerID: string } = $props();
function getPlaceClass(place: number) {
if (place == 1) return "bg-yellow-500";
if (place == 2) return "bg-slate-500";
if (place == 3) return "bg-amber-800";
return "bg-slate-800";
}
let placeClass = $derived(getPlaceClass(place));
</script>
<a use:link href="/player/{playerID}">
<div class="flex justify-between w-full border rounded-xl my-3 min-h-10">
<div class="{placeClass} px-3 py-1 rounded-l-xl flex items-center">{place}.</div>
<div class=" py-1 flex items-center">{name}</div>
<div class="rounded-r-xl px-3 py-1 bg-blue-400 flex items-center">{elo}</div>
</div>
</a>