From 6471434d81e874e281cfa582e0c8467e9f244e97 Mon Sep 17 00:00:00 2001
From: Tom Butcher <thomasbutcher15@gmail.com>
Date: Sat, 25 Jul 2026 01:35:35 +0100
Subject: [PATCH] Update CountryDisplay component to improve layout consistency

- Added minWidth style to Flex and inner div elements to ensure proper alignment and prevent overflow issues in the CountryDisplay component.
---
 src/components/Dashboard/common/CountryDisplay.jsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/Dashboard/common/CountryDisplay.jsx b/src/components/Dashboard/common/CountryDisplay.jsx
index 5087781..a8449a7 100644
--- a/src/components/Dashboard/common/CountryDisplay.jsx
+++ b/src/components/Dashboard/common/CountryDisplay.jsx
@@ -13,14 +13,19 @@ const CountryDisplay = ({ countryCode }) => {
   }
 
   return (
-    <Flex gap={'small'} align='center' className='country-display'>
+    <Flex
+      gap={'small'}
+      align='center'
+      className='country-display'
+      style={{ minWidth: 0 }}
+    >
       <Flag
         code={country.code}
         size='middle'
         hasBorder={true}
         borderRadius={5}
       />
-      <div>
+      <div style={{ minWidth: 0 }}>
         <Text ellipsis>{country.name}</Text>
       </div>
     </Flex>