23 lines
526 B
Svelte
23 lines
526 B
Svelte
<script lang="ts">
|
|
import { cn } from '$lib/Utils';
|
|
|
|
export let name: string;
|
|
export let src: string;
|
|
export let alt: string;
|
|
export let level: number;
|
|
</script>
|
|
|
|
<div class="flex w-24 flex-col space-y-2 text-center">
|
|
<img
|
|
src={`data:image;base64,${src}`}
|
|
{alt}
|
|
class={cn(`rounded-full border-2 lg:border-4`, {
|
|
'border-green-600': level === 1,
|
|
'border-yellow-600': level === 2,
|
|
'border-red-600': level === 3
|
|
})}
|
|
width={500}
|
|
height={500}
|
|
/>
|
|
<span class="text-sm font-semibold">{name}</span>
|
|
</div>
|