Files
BeReadyFrontend/src/app/pages/ranking/ranking.component.html
T
2026-04-26 17:19:44 +01:00

42 lines
1.7 KiB
HTML

<ion-header>
<ion-toolbar>
<ion-title class="font-mono">
Classement général
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content style="--background: #f7f6f2;">
<div class="rounded-3xl px-5 m-3 bg-white overflow-auto font-mono">
@for (user of users(); track user.id; let i = $index) {
<div class="grid grid-cols-[auto_1fr_auto] items-center gap-4 mt-0 mb-0">
@if (i === 0) {
<p class="w-8 h-8 flex items-center justify-center rounded-full border border-gray-400 bg-yellow-300 m-0">
{{ i + 1 }}
</p>
} @else if (i === 1) {
<p class="w-8 h-8 flex items-center justify-center rounded-full border border-gray-400 bg-gray-200 m-0">
{{ i + 1 }}
</p>
} @else if (i === 2) {
<p class="w-8 h-8 flex items-center justify-center rounded-full border border-gray-400 bg-orange-300 m-0">
{{ i + 1 }}
</p>
} @else {
<p class="w-8 h-8 flex items-center justify-center rounded-full border border-gray-400 m-0">
{{ i + 1 }}
</p>
}
<div>
<p class="mb-0 font-bold">{{ user.username }}</p>
<p class="mt-0 text-xs text-gray-500">{{ user.getUserStatsDto.totalChallenge }} défis réalisés</p>
</div>
<p class="text-gray-400 m-0"><strong class="text-black">{{ user.getUserStatsDto.totalLikes }}</strong>
pts
</p>
</div>
}
</div>
</ion-content>