Cleaned code with new components
This commit is contained in:
@@ -53,63 +53,7 @@
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content class="ion-padding" style="--background: #f7f6f2;">
|
||||
<div class="rounded-lg px-5 m-3 bg-white border border-gray-200 grid grid-cols-3 items-center">
|
||||
<div>
|
||||
<ion-avatar slot="start" class="w-20 h-20 p-2">
|
||||
<img alt="Silhouette of a person's head"
|
||||
src="https://ionicframework.com/docs/img/demos/avatar.svg"/>
|
||||
</ion-avatar>
|
||||
</div>
|
||||
<div class="col-span-2 py-3">
|
||||
<ion-label class="text-[15px] font-sans font-bold block">
|
||||
{{ selectedFriend()?.firstName }} {{ selectedFriend()?.name.charAt(0) }}.
|
||||
</ion-label>
|
||||
<ion-label class="text-xs font-mono block text-gray-400 mt-0.5">
|
||||
@{{ selectedFriend()?.username }}
|
||||
</ion-label>
|
||||
<ion-label
|
||||
class="text-[10px] font-sans font-semibold block mt-2 bg-gray-100 text-gray-500 rounded-full px-2 py-0.5 w-fit">
|
||||
@if (selectedFriend().designationName) {
|
||||
⚡ {{ selectedFriend().designationName }}
|
||||
} @else {
|
||||
⚡ En sommeil
|
||||
}
|
||||
</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-3 px-1">
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.totalChallenge }}</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Défis réalisés</p>
|
||||
</div>
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.totalWin }}</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Victoires</p>
|
||||
</div>
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.totalPodium }}</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Podiums</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-2 px-1">
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.totalBonusChallenge }}</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Défis bonus</p>
|
||||
</div>
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.series }}×</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Séries max</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-1">
|
||||
<div class="rounded-lg px-4 py-0.5 m-2 bg-white border border-gray-200">
|
||||
<p class="text-2xl font-black font-mono mb-0.5">{{ selectedFriend().getUserStatsDto.score }}</p>
|
||||
<p class="text-[11px] font-semibold font-mono text-gray-400 mt-0">Score global</p>
|
||||
</div>
|
||||
</div>
|
||||
<app-generic-user-info [userInfo]="selectedFriend()"></app-generic-user-info>
|
||||
</ion-content>
|
||||
</ng-template>
|
||||
</ion-modal>
|
||||
@@ -5,6 +5,7 @@ import {addIcons} from "ionicons";
|
||||
import {FriendsService, GetUserDto, UsersService} from "../../services/api";
|
||||
import {firstValueFrom} from "rxjs";
|
||||
import {FriendsStateService} from "../../services/friends-state";
|
||||
import {GenericUserInfoComponent} from "../generic-user-info/generic-user-info.component";
|
||||
|
||||
addIcons({
|
||||
'close': closeCircleOutline,
|
||||
@@ -15,7 +16,8 @@ addIcons({
|
||||
templateUrl: './friends-list.component.html',
|
||||
styleUrls: ['./friends-list.component.scss'],
|
||||
imports: [
|
||||
IonicModule
|
||||
IonicModule,
|
||||
GenericUserInfoComponent
|
||||
]
|
||||
})
|
||||
export class FriendsListComponent {
|
||||
|
||||
Reference in New Issue
Block a user