59 lines
2.1 KiB
Plaintext
59 lines
2.1 KiB
Plaintext
@attribute [StreamRendering]
|
|
@rendermode InteractiveServer
|
|
|
|
<div class="card-wrapper d-flex flex-column align-items-center">
|
|
<div class="pokemon-card card-holo animated @GetTypeCssClass(_pokemon.PokemonType)">
|
|
<!-- Pokemon Name, Number, and Type -->
|
|
<div class="z-3">
|
|
@if (_pokemon.IsVariation)
|
|
{
|
|
<div class="pokemon-name"><p class="fw-bold card-title">@_pokemon.VariationName @_pokemon.PokemonName</p></div>
|
|
}
|
|
else
|
|
{
|
|
<div class="pokemon-name"><p class="fw-bold card-title">@_pokemon.PokemonName</p></div>
|
|
}
|
|
<div class="pokemon-number">
|
|
<p class="fw-light card-text">Pokédex #<strong>@_pokemon.PokemonId</strong></p>
|
|
</div>
|
|
<div >
|
|
<img class="pokemon-type" src="@GetTypeImageUrl(_pokemon.PokemonType)" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Pokemon Image -->
|
|
<div class="flip-container z-1" @onclick="() => ToggleImage()">
|
|
<div class="flipper @(isShiny ? "flipped" : "")">
|
|
<img class="pokemon-image front" src="@_pokemon.PokemonImageUrl" />
|
|
<img class="pokemon-image back" src="@_pokemon.PokemonShinyImageUrl" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Pokemon Flavortext -->
|
|
<div class="z-3 pokemon-flavor-text @(GetTypeCssClass(_pokemon.PokemonType))">
|
|
@if (string.IsNullOrEmpty(_pokemon.FlavorText))
|
|
{
|
|
<p class="fw-light">[ Pokemon Flavor Text Placeholder ]</p>
|
|
|
|
}
|
|
else
|
|
{
|
|
<p class="fw-light">@_pokemon.FlavorText</p>
|
|
|
|
}
|
|
</div>
|
|
|
|
<!-- Pokemon Sleep Type and Specialty Badges -->
|
|
<div class="position-absolute bottom-0 end-0 z-2">
|
|
<div class="d-flex justify-content-between">
|
|
<PokemonBadge BadgeItem="@_pokemon.SleepType" />
|
|
<PokemonBadge BadgeItem="@_pokemon.Speciality" />
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="mt-3">
|
|
<PokemonEditButton PokemonId="@_pokemon.Id" />
|
|
</div>
|
|
</div> |