mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-07-25 15:59:38 +02:00
feat: Add flag URL to Country type and update CountryCard component
This commit is contained in:
parent
77c11fefea
commit
d9e554ad42
14 changed files with 96 additions and 56 deletions
|
@ -1,14 +1,14 @@
|
|||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { getFlag } from '$lib';
|
||||
import type { Country } from '$lib/types';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
export let countryName: string | undefined = undefined;
|
||||
export let countryCode: string;
|
||||
export let country: Country;
|
||||
|
||||
async function nav() {
|
||||
goto(`/worldtravel/${countryCode}`);
|
||||
goto(`/worldtravel/${country.country_code}`);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
@ -17,15 +17,10 @@
|
|||
>
|
||||
<figure>
|
||||
<!-- svelte-ignore a11y-img-redundant-alt -->
|
||||
<img
|
||||
src={getFlag(240, countryCode) ||
|
||||
'https://placehold.co/300?text=No%20Image%20Found&font=roboto'}
|
||||
alt="No image available"
|
||||
class="w-full h-48 object-cover"
|
||||
/>
|
||||
<img src={country.flag_url} alt="No image available" class="w-full h-48 object-cover" />
|
||||
</figure>
|
||||
<div class="card-body">
|
||||
<h2 class="card-title overflow-ellipsis">{countryName}</h2>
|
||||
<h2 class="card-title overflow-ellipsis">{country.name}</h2>
|
||||
<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>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue