<h2 mat-dialog-title class="bg-cyan border-bottom border-light-subtle d-flex mb-3 pt-3 pb-2">
    Saut n°{{jump.numero}}<span class="flex-spacer"></span>
    <mat-icon fontIcon="close" class="pointer" (click)="closeDialog()"></mat-icon>
</h2>
<mat-dialog-content>
    <div class="container">
        <h5 class="border-bottom text-light-info border-light-subtle pb-2 mb-3">Le {{ jump.date | date: 'dd/MM/yyyy' }} à {{ jump.lieu }} :</h5>
        <div class="row mb-3">
            <div class="col-lg-6 col-md-12">
                <dl class="dl-horizontal">
                    <dt class="text-cyan fw-normal">Lieu:</dt>
                    <dd>{{jump.lieu}}</dd>
                    <dt class="text-cyan fw-normal">Oaci:</dt>
                    <dd>{{jump.oaci}}</dd>
                    <dt class="text-cyan fw-normal">Aeronef:</dt>
                    <dd>{{jump.aeronef}}</dd>
                    <dt class="text-cyan fw-normal">Imat:</dt>
                    <dd>{{jump.imat}}</dd>
                    <dt class="text-cyan fw-normal">Voile:</dt>
                    <dd>{{jump.voile}}</dd>
                    <dt class="text-cyan fw-normal">Taille:</dt>
                    <dd>{{jump.taille}} ft<sup>2</sup></dd>
                    <dt class="text-cyan fw-normal">Participants:</dt>
                    <dd>{{jump.participants}}</dd>
                    <dt class="text-cyan fw-normal">Sautants:</dt>
                    <dd>
                        <span *ngFor="let sautant of jump.sautants" class="badge rounded-pill bg-primary mb-2 me-1 pe-3 py-1 fw-normal text-dark">
                            <mat-icon class="align-middle me-1" fontIcon="person"></mat-icon>
                            {{ sautant }}
                        </span>
                        <span class="badge rounded-pill bg-accent mb-2 me-1 pe-3 py-1 fw-normal text-dark">
                            <mat-icon class="align-middle me-1" fontIcon="person"></mat-icon>
                            ju_solide
                        </span>
                    </dd>
                </dl>
            </div>
            <div class="col-lg-6 col-md-12">
                <dl class="dl-horizontal">
                    <dt class="text-cyan fw-normal">Hauteur:</dt>
                    <dd>{{jump.hauteur}} m</dd>
                    <dt class="text-cyan fw-normal">Deploiement:</dt>
                    <dd>{{jump.deploiement}} m</dd>
                    <dt class="text-cyan fw-normal">Categorie:</dt>
                    <dd>{{jump.categorie}}</dd>
                    <dt class="text-cyan fw-normal">Module:</dt>
                    <dd>{{jump.module}}</dd>
                    <dt class="text-cyan fw-normal">Accessoires:</dt>
                    <dd>{{jump.accessoires}}</dd>
                    <dt class="text-cyan fw-normal">Zone:</dt>
                    <dd>{{jump.zone}}</dd>
                    <dt class="text-cyan fw-normal">Dossier media:</dt>
                    <dd>{{jump.dossier}}</dd>
                    <dt class="text-cyan fw-normal">Video:</dt>
                    <dd>{{jump.video}}</dd>
                    <dt class="text-cyan fw-normal">Programme:</dt>
                    <dd>{{jump.programme}}</dd>
                </dl>
            </div>
        </div>
        <mat-divider></mat-divider>
    </div>
</mat-dialog-content>
<mat-dialog-actions>
    <span class="flex-spacer"></span>
    <button mat-button (click)="closeDialog()" class="me-1">Fermer</button>
</mat-dialog-actions>
