114 lines
3.5 KiB
HTML
114 lines
3.5 KiB
HTML
<div class="match-card" *ngIf="latestMatch">
|
|
<div class="match-background">
|
|
<img src="./assets/duel.webp" alt="Escrime" class="background-image" />
|
|
<div class="image-overlay"></div>
|
|
</div>
|
|
|
|
<div class="match-header">
|
|
<div class="match-weapon">
|
|
<i class="sword-icon">⚔️</i>
|
|
<span class="weapon-type">{{ latestMatch.weapon }}</span>
|
|
</div>
|
|
<div
|
|
class="match-status"
|
|
[ngClass]="'status-' + getMatchStateColor(latestMatch.state)"
|
|
>
|
|
<span class="status-dot"></span>
|
|
{{ getMatchStateLabel(latestMatch.state) }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="match-versus">
|
|
<div class="fencer fencer-left">
|
|
<div class="fencer-name">
|
|
{{ player1?.name }} {{ player1?.firstName }}
|
|
</div>
|
|
<div class="fencer-club">{{ player1?.club }}</div>
|
|
<div class="score">{{ latestMatch.score1 }}</div>
|
|
</div>
|
|
|
|
<div class="vs-divider">
|
|
<span class="vs-text">VS</span>
|
|
<div class="crossed-swords">⚔️</div>
|
|
</div>
|
|
|
|
<div class="fencer fencer-right">
|
|
<div class="fencer-name">
|
|
{{ player2?.name }} {{ player2?.firstName }}
|
|
</div>
|
|
<div class="fencer-club">{{ player2?.club }}</div>
|
|
<div class="score">{{ latestMatch.score2 }}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="combat-arena">
|
|
<div class="arena-header">
|
|
<span class="arena-title">ARENA COMBAT</span>
|
|
<div class="arena-pulse"></div>
|
|
</div>
|
|
|
|
<div class="combat-grid">
|
|
<div class="combat-stat venue">
|
|
<div class="stat-icon">
|
|
<div class="location-radar"></div>
|
|
<span>🏛️</span>
|
|
</div>
|
|
<div class="stat-content">
|
|
<span class="stat-label">BATTLEFIELD</span>
|
|
<span class="stat-value">{{ latestMatch.city }}</span>
|
|
<span class="stat-sub">{{ latestMatch.country }}</span>
|
|
</div>
|
|
<div class="stat-glow venue-glow"></div>
|
|
</div>
|
|
|
|
<div class="combat-stat referee">
|
|
<div class="stat-icon">
|
|
<div class="referee-badge"></div>
|
|
<span>⚖️</span>
|
|
</div>
|
|
<div class="stat-content">
|
|
<span class="stat-label">COMBAT JUDGE</span>
|
|
<span class="stat-value"
|
|
>{{ referee?.name }} {{ referee?.firstName }}</span
|
|
>
|
|
<span class="stat-sub">OFFICIAL REFEREE</span>
|
|
</div>
|
|
<div class="stat-glow referee-glow"></div>
|
|
</div>
|
|
|
|
<div
|
|
class="combat-stat timing"
|
|
*ngIf="latestMatch?.state === MatchState.NOT_STARTED"
|
|
>
|
|
<div class="stat-icon">
|
|
<div class="time-ring"></div>
|
|
<span>⚡</span>
|
|
</div>
|
|
<div class="stat-content">
|
|
<span class="stat-label">COMBAT START</span>
|
|
<span class="stat-value">{{ getTimeUntilMatch() }}</span>
|
|
<span class="stat-sub">LIVE BATTLE</span>
|
|
</div>
|
|
<div class="stat-glow timing-glow"></div>
|
|
</div>
|
|
<div
|
|
class="combat-stat funfact"
|
|
*ngIf="latestMatch?.state !== MatchState.NOT_STARTED"
|
|
>
|
|
<div class="stat-icon">
|
|
<span>🎯</span>
|
|
</div>
|
|
<div class="stat-content">
|
|
<span class="stat-label">FUN FACT</span>
|
|
<span class="stat-value">
|
|
Saviez-vous que l'escrime est l'un des sports les plus anciens aux
|
|
Jeux Olympiques ?
|
|
</span>
|
|
<span class="stat-sub">Inspiration et tradition au rendez-vous</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<app-sponsort></app-sponsort>
|