82 lines
3.8 KiB
Plaintext
82 lines
3.8 KiB
Plaintext
@page "/pokemonsleep/pokemon/{id:int}"
|
|
@inject IPokemonService PokemonService
|
|
@inject NavigationManager Navigation
|
|
|
|
@attribute [StreamRendering]
|
|
@rendermode InteractiveServer
|
|
|
|
|
|
<PokemonHeader />
|
|
|
|
@if (_pokemon == null)
|
|
{
|
|
<Loading />
|
|
}
|
|
else
|
|
{
|
|
<PageTitle>@_pokemon.PokemonName</PageTitle>
|
|
<!-- Total Componenet-->
|
|
|
|
<div class="w-100">
|
|
<div class="d-flex justify-content-center mt-4">
|
|
<button class="mt-1 p-2 btn btn-danger rounded-5 align-self-start shadow-sm" disabled="@(!_previousPokemonId.HasValue)" @onclick="NavigateToPrevious">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-arrow-left-circle-fill" viewBox="0 0 16 16">
|
|
<path d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0m3.5 7.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5z" />
|
|
</svg>
|
|
</button>
|
|
<div class="mt-5 mx-5 d-flex justify-content-center">
|
|
@if (_variationPokemonId != null)
|
|
{
|
|
@if (_variationPokemonId != null && _pokemonVariant == null){
|
|
<p><em>Loading...</em></p>
|
|
}
|
|
else
|
|
{
|
|
@if(_pokemon.Id != _pokemonVariant.Id)
|
|
{
|
|
<div class="d-flex justify-content-center">
|
|
<div class="position-relative">
|
|
<PokemonCard Pokemon="_pokemon" />
|
|
<div class="position-absolute top-100 start-50 translate-middle mt-5">
|
|
<PokemonEditButton PokemonId="_pokemon.Id" />
|
|
</div>
|
|
</div>
|
|
<div class="position-relative">
|
|
<PokemonCard Pokemon="_pokemonVariant" />
|
|
<div class="position-absolute top-100 start-50 translate-middle mt-5">
|
|
<PokemonEditButton PokemonId="_pokemonVariant.Id" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
}
|
|
else
|
|
{
|
|
<div class="position-relative">
|
|
<PokemonCard Pokemon="_pokemonVariant" />
|
|
<div class="position-absolute top-100 start-50 translate-middle mt-5">
|
|
<PokemonEditButton PokemonId="_pokemonVariant.Id" />
|
|
</div>
|
|
</div>
|
|
|
|
}
|
|
}
|
|
}
|
|
else{
|
|
<div class="position-relative">
|
|
<PokemonCard Pokemon="_pokemon" />
|
|
<div class="position-absolute top-100 start-50 translate-middle mt-5">
|
|
<PokemonEditButton PokemonId="_pokemon.Id" />
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
<button class="mt-1 p-2 btn btn-danger rounded-5 align-self-start shadow-sm" disabled="@(!_nextPokemonId.HasValue)" @onclick="NavigateToNext">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-arrow-right-circle-fill" viewBox="0 0 16 16">
|
|
<path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0M4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5z" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
}
|