kira
/
exciting-aftermath
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Keep playing with the table gosh. I want to shower.

This commit is contained in:
Kira Jiroux 2025-04-11 20:26:18 -04:00
parent aea7c06819
commit 79bda1d0fc
3 changed files with 29 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
Portfolio.WebUI.Server/Components/Component/Pokemon Components/PokemonTable.razor
View File

@ -80,21 +80,9 @@
<!-- Section 3: Pokemon Name -->
@if (pokemon.IsVariation) // If a Variant
{
@if (pokemon.VariationName == "Alolan")
{
<td @onclick="() => ViewPokemon(pokemon.PokemonId)" class="pokemon-name-style col-2"> Alolan @pokemon.PokemonName</td>
}
@if (pokemon.VariationName == "Paldean")
{
<td @onclick="() => ViewPokemon(pokemon.PokemonId)" class="pokemon-name-style col-2"> Paldean @pokemon.PokemonName</td>
}
}
else // Otherwise, Base Case
{
<td @onclick="() => ViewPokemon(pokemon.PokemonId)" class="pokemon-name-style col-2"> @pokemon.PokemonName</td>
}
<td @onclick="() => ViewPokemon(pokemon.PokemonId)" class="pokemon-name-style fw-light col-2">@(pokemon.IsVariation && ToggleVariationName(pokemon.Id, pokemon.PokemonId) ? $"{pokemon.VariationName} {pokemon.PokemonName}" : pokemon.PokemonName)</td>
<!-- Section 4: Pokemon Type -->
@ -144,7 +132,7 @@
</div>
</div>
<!-- Table Body -->
<div class="tableFixHead table-responsive row">
<div class="tableFixHead row">
<table class="table table-striped border-0">
@ -158,8 +146,10 @@
@foreach (var pokemon in pokemons)
{
<tr class=" mb-3 border-0">
<tr class="border-0">
<div class="d-flex align-items-center">
<!-- Pokemon Image -->
<div class="me-3">
<div class="flip-container-sm" @onclick="() => ToggleImage(pokemon.Id)">
<div class="flipper-sm @(isShiny[pokemon.Id] ? "flipped" : "")">
@ -171,19 +161,23 @@
</div>
</div>
</div>
<div>
<h5 class="mb-1">
<!-- Number and Name -->
<h5>
@pokemon.PokemonId -
<span class="pokemon-name-style" @onclick="() => ViewPokemon(pokemon.PokemonId)">
@(pokemon.IsVariation ? $"{pokemon.VariationName} {pokemon.PokemonName}" : pokemon.PokemonName)
<span class="pokemon-name-style fw-light" @onclick="() => ViewPokemon(pokemon.PokemonId)">
@(pokemon.IsVariation && ToggleVariationName(pokemon.Id, pokemon.PokemonId) ? $"{pokemon.VariationName} {pokemon.PokemonName}" : pokemon.PokemonName)
</span>
</h5>
<!-- Stats -->
<div class="d-flex flex-wrap align-items-center gap-2">
<img src="@GetTypeImageUrl(pokemon.PokemonType)" style="width:28px;" />
<div class=" badge @pokemon.SleepType.ToLower() border-0"><p class="statText">@pokemon.SleepType</p></div>
<div class=" badge @pokemon.Speciality.ToLower() border-0"><p class="statText">@pokemon.Speciality</p></div>
</div>
</div>
</div>
</tr>
}

12
Portfolio.WebUI.Server/Components/Component/Pokemon Components/PokemonTable.razor.cs
View File

@ -34,6 +34,18 @@ namespace Portfolio.WebUI.Server.Components.Component.Pokemon_Components
}
}
private bool ToggleVariationName(int Id, int PokemonId)
{
foreach (var pokemon in pokemons)
{
if (pokemon.PokemonId == PokemonId && pokemon.Id != Id)
{
return true;
}
}
return false;
}
private async Task ConfirmDelete(int Id)
{
bool confirm = await JS.InvokeAsync<bool>("confirm", "Are you sure you want to delete this Pokémon?");

1
Portfolio.WebUI.Server/Components/Component/Pokemon Components/PokemonTable.razor.css
View File

@ -18,6 +18,7 @@
.pokemon-name-style {
cursor:pointer;
font-size: 1.3rem;
}