27 lines
988 B
Plaintext
27 lines
988 B
Plaintext
|
|
<!-- Search Input -->
|
|
<div class="pokemon-selector p-3 bg-light ">
|
|
<input class="form-control mb-3" placeholder="Search Pokémon..." @bind="SearchTerm" @oninput="HandleSearch" />
|
|
|
|
<!-- Scrollable Pokémon Grid -->
|
|
<div class="row pokemon-grid">
|
|
@foreach (var pokemon in FilteredPokemon)
|
|
{
|
|
bool isSelected = SelectedPokemon?.Id == pokemon.Id;
|
|
|
|
<div class="col-6 col-md-3 mb-3">
|
|
<div class="card pokemon-card small-card @(isSelected ? "border-primary border-2 shadow" : "border-2 border-white")"
|
|
@onclick="() => SelectPokemon(pokemon)">
|
|
<img src="@pokemon.PokemonImageUrl" class="card-img-top" style="height: 50px; object-fit: contain;" />
|
|
<div class="card-body p-2 text-center">
|
|
<small>@pokemon.PokemonId</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
|
|
</style> |