Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-23 14:59:36 +02:00
Code Issues Releases Activity

Conditional rendering to the country card to show visited status as a badge

Browse source
This commit is contained in:
Sean Morley 2024-10-16 20:02:28 -04:00
parent aa8d456e41
commit 3a66a433ca
3 changed files with 33 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

26
frontend/src/lib/components/CountryCard.svelte
View file

@ -23,12 +23,26 @@
</figure>
<div class="card-body">
<h2 class="card-title overflow-ellipsis">{country.name}</h2>
{#if country.subregion}
<div class="badge badge-primary">{country.subregion}</div>
{/if}
{#if country.capital}
<div class="badge badge-secondary"><MapMarkerStar class="-ml-1 mr-1" />{country.capital}</div>
{/if}
<div class="flex flex-wrap gap-2">
{#if country.subregion}
<div class="badge badge-primary">{country.subregion}</div>
{/if}
{#if country.capital}
<div class="badge badge-secondary">
<MapMarkerStar class="-ml-1 mr-1" />{country.capital}
</div>
{/if}
{#if country.num_visits > 0 && country.num_visits != country.num_regions}
<div class="badge badge-accent">
Visited {country.num_visits} time{country.num_visits > 1 ? 's' : ''}
</div>
{:else if country.num_visits > 0 && country.num_visits === country.num_regions}
<div class="badge badge-success">Completed</div>
{:else}
<div class="badge badge-error">Not Visited</div>
{/if}
</div>
<div class="card-actions justify-end">
<!-- <button class="btn btn-info" on:click={moreInfo}>More Info</button> -->
<button class="btn btn-primary" on:click={nav}>Open</button>