julien/adastra_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ajout de composants Hero Wars

Browse Source
This commit is contained in:
Julien Gautier
2025-11-27 10:35:38 +01:00
parent 8e3bd16b60
commit 8a1c19e011
66 changed files with 4137 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/herowars-guildraid/herowars-guildraid.component.html
+114
View File
@@ -0,0 +1,114 @@
<div @flyInOut>
<div class="d-flex">
<div class="flex-fill">
<h1 class="mb-1">{{title}}</h1>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center me-2 text-end">
<span class="fs-5 text-primary">{{ now | date: 'dd/MM/yyyy' }}</span>
</div>
</div>
<mat-divider class="my-3"></mat-divider>
<app-list-errors [errors]="errors"></app-list-errors>
<div class="d-flex">
<p class="fs-3">{{description}}</p>
</div>
<mat-divider class="mt-2 mb-3"></mat-divider>
<mat-card class="my-3">
<mat-card-header class="d-flex rounded-top bg-navy-light text-bg-navy-light py-2 px-3">
<div class="flex-fill">
<mat-card-title>
{{ title }}
</mat-card-title>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center text-end">
<span class="fs-5 font-light">{{ subtitle }}</span>
</div>
</mat-card-header>
<mat-card-content class="table-responsive p-0">
<mat-stepper headerPosition="top" #stepper>
<mat-step state="timeline">
<ng-template matStepLabel>Stage 1</ng-template>
<div class="d-flex mt-3">
<div class="flex-fill">
<h2 class="mb-1">Stage 1</h2>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center me-2 text-end">
<h4 class="mb-1">Power limit: 320k</h4>
</div>
</div>
<div class="border-top border-light pt-2">
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</mat-step>
<mat-step state="timeline">
<ng-template matStepLabel>Stage 2</ng-template>
<div class="d-flex mt-3">
<div class="flex-fill">
<h2 class="mb-1">Stage 2</h2>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center me-2 text-end">
<h4 class="mb-1">Power limit: 500k</h4>
</div>
</div>
<div class="border-top border-light pt-2">
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</mat-step>
<mat-step state="timeline">
<ng-template matStepLabel>Stage 3</ng-template>
<div class="d-flex mt-3">
<div class="flex-fill">
<h2 class="mb-1">Stage 3</h2>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center me-2 text-end">
<h4 class="mb-1">No power limit</h4>
</div>
</div>
<div class="border-top border-light pt-2">
<button mat-button matStepperPrevious>Back</button>
<button mat-button matStepperNext>Next</button>
</div>
</mat-step>
<mat-step state="search">
<ng-template matStepLabel>Statistics</ng-template>
<div class="d-flex mt-3">
<div class="flex-fill">
<h2 class="mb-1">Statistics</h2>
</div>
<span class="flex-spacer"></span>
<div class="align-self-center me-2 text-end">
<h4 class="mb-1">variation ≥ {{ minVarPct }}%</h4>
<mat-form-field appearance="outline">
<mat-label>Variation</mat-label>
<input matInput [(ngModel)]="minVarPct" type="number" min="{{ minValue }}">
<mat-icon matSuffix>percent</mat-icon>
<mat-hint>excess power in %</mat-hint>
</mat-form-field>
</div>
</div>
<div class="border-top border-light pt-2">
<button mat-button matStepperPrevious>Back</button>
<button mat-button (click)="stepper.reset()">Reset</button>
</div>
</mat-step>
<ng-template matStepperIcon="timeline">
<mat-icon>timeline</mat-icon>
</ng-template>
<ng-template matStepperIcon="search">
<mat-icon>manage_search</mat-icon>
</ng-template>
</mat-stepper>
</mat-card-content>
</mat-card>
</div>