57 lines
1.6 KiB
HTML
57 lines
1.6 KiB
HTML
|
<div *ngIf="pokemon" class="row">
|
||
|
|
<div class="col s12 m8 offset-m2">
|
||
|
|
<h2 class="header center">{{ pokemon.name }}</h2>
|
||
|
|
<div class="card horizontal hoverable">
|
||
|
|
<div class="card-image">
|
||
|
|
<img [src]="pokemon.picture" />
|
||
|
|
</div>
|
||
|
|
<div class="card-stacked">
|
||
|
|
<div class="card-content">
|
||
|
|
<table class="bordered striped">
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td>Nom</td>
|
||
|
|
<td>
|
||
|
|
<strong>{{ pokemon.name }}</strong>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Points de vie</td>
|
||
|
|
<td>
|
||
|
|
<strong>{{ pokemon.hp }}</strong>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Dégâts</td>
|
||
|
|
<td>
|
||
|
|
<strong>{{ pokemon.cp }}</strong>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Types</td>
|
||
|
|
<td>
|
||
|
|
<span
|
||
|
|
*ngFor="let type of pokemon.types"
|
||
|
|
class="{{ type | pokemonTypeColor }}"
|
||
|
|
>{{ type }}</span
|
||
|
|
>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
<tr>
|
||
|
|
<td>Date de création</td>
|
||
|
|
<td>
|
||
|
|
<em>{{ pokemon.created | date : "yyyy-MM-dd" }}</em>
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div class="card-action">
|
||
|
|
<a (click)="goToPokemonList()">Retour</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<h4 *ngIf="!pokemon" class="center">Aucun pokémon à afficher !</h4>
|