added TopPlayerCard
This commit is contained in:
parent
3ce3fabc81
commit
82c98435f6
27
web/src/lib/TopPlayerCard.svelte
Normal file
27
web/src/lib/TopPlayerCard.svelte
Normal 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>
|
Loading…
x
Reference in New Issue
Block a user