From 8a169da9e29887745b20225480c19e3dc1eca740 Mon Sep 17 00:00:00 2001
From: Sean Morley <zipsm15@gmail.com>
Date: Sat, 13 Apr 2024 20:39:06 +0000
Subject: [PATCH] Update getFlag function to accept size parameter

---
 src/lib/index.ts                                  | 10 ++++++++--
 src/routes/worldtravel/+page.svelte               |  2 +-
 src/routes/worldtravel/[countrycode]/+page.svelte |  2 +-
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/lib/index.ts b/src/lib/index.ts
index f8d4e9b..b3d3898 100644
--- a/src/lib/index.ts
+++ b/src/lib/index.ts
@@ -34,8 +34,14 @@ export function countryCodeToName(countryCode: string) {
   }
 }
 
-export function getFlag(country: string) {
-  return `https://flagcdn.com/h24/${country}.png`;
+/**
+ * Generates the URL for a flag image based on the specified size and country code.
+ * @param size - The desired height of the flag image. Avaliable sizes: 20, 24, 40, 60, 80, 120, 240.
+ * @param country - The 2 digit country code representing the desired flag.
+ * @returns The URL of the flag image.
+ */
+export function getFlag(size:number,country: string) {
+  return `https://flagcdn.com/h${size}/${country}.png`;
 }
     
 export function generateRandomString() {
diff --git a/src/routes/worldtravel/+page.svelte b/src/routes/worldtravel/+page.svelte
index d8eb927..f69c48f 100644
--- a/src/routes/worldtravel/+page.svelte
+++ b/src/routes/worldtravel/+page.svelte
@@ -18,7 +18,7 @@
         on:click={() => nav(item.country_code)}
         >{item.name}
         <img
-            src={getFlag(item.country_code)}
+            src={getFlag(24, item.country_code)}
             class="inline-block -mt-1 mr-1"
             alt="Flag"
         /></button
diff --git a/src/routes/worldtravel/[countrycode]/+page.svelte b/src/routes/worldtravel/[countrycode]/+page.svelte
index 515b62d..dc8e633 100644
--- a/src/routes/worldtravel/[countrycode]/+page.svelte
+++ b/src/routes/worldtravel/[countrycode]/+page.svelte
@@ -8,7 +8,7 @@
 <h1 class="text-center text-4xl font-bold">
     Regions in {countryCodeToName(data.countrycode)}
     <img
-        src={getFlag(data.countrycode)}
+        src={getFlag(40, data.countrycode)}
         class="inline-block -mt-1 mr-1"
         alt="Flag"
     />