36 lines
860 B
Svelte
36 lines
860 B
Svelte
<script lang="ts">
|
|
import { goto } from "$app/navigation";
|
|
import { getFlag } from "$lib";
|
|
import AdventureCard from "$lib/components/AdventureCard.svelte";
|
|
|
|
export let data: any;
|
|
|
|
async function nav(loc: string) {
|
|
goto(`/worldtravel/${loc}`);
|
|
}
|
|
</script>
|
|
|
|
<h1 class="text-center font-bold text-4xl mb-4">Country List</h1>
|
|
|
|
{#each data.response as item}
|
|
<button
|
|
class="btn btn-primary mr-4 mb-2"
|
|
on:click={() => nav(item.country_code)}
|
|
>{item.name}
|
|
<img
|
|
src={getFlag(24, item.country_code)}
|
|
class="inline-block -mt-1 mr-1"
|
|
alt="Flag"
|
|
/></button
|
|
>
|
|
<!-- <p>Name: {item.name}, Continent: {item.continent}</p> -->
|
|
{/each}
|
|
|
|
<svelte:head>
|
|
<title>WorldTravel | AdventureLog</title>
|
|
<meta
|
|
name="description"
|
|
content="Explore the world and add countries to your visited list!"
|
|
/>
|
|
</svelte:head>
|