From 5fde9f6be362dc87be55d335732120212f65e196 Mon Sep 17 00:00:00 2001
From: Frank <csskfaves@gmail.com>
Date: Thu, 3 Oct 2024 10:44:31 +0100
Subject: [PATCH] fix width classes

---
 client/components/forms/PhoneInput.vue |  2 +-
 client/lib/forms/themes/form-themes.js | 15 +++++++++++++++
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/client/components/forms/PhoneInput.vue b/client/components/forms/PhoneInput.vue
index dc5337e1..92187a14 100644
--- a/client/components/forms/PhoneInput.vue
+++ b/client/components/forms/PhoneInput.vue
@@ -12,7 +12,7 @@
     >
       <v-select
         v-model="selectedCountryCode"
-        class="w-[130px]"
+        :class="theme.PhoneInput.countrySelectWidth"
         dropdown-class="max-w-[300px]"
         input-class="rounded-r-none"
         :data="countries"
diff --git a/client/lib/forms/themes/form-themes.js b/client/lib/forms/themes/form-themes.js
index 3301a875..2edde5fe 100644
--- a/client/lib/forms/themes/form-themes.js
+++ b/client/lib/forms/themes/form-themes.js
@@ -74,6 +74,11 @@ export const themes = {
       }
     },
     PhoneInput: {
+      countrySelectWidth: {
+        sm: 'w-[100px]',
+        md: 'w-[120px]',
+        lg: 'w-[120px]'
+      },
       flag: {
         sm: '!-mt-[14px]',
         md: '!-mt-[9px] rounded',
@@ -220,6 +225,11 @@ export const themes = {
       }
     },
     PhoneInput: {
+      countrySelectWidth: {
+        sm: 'w-[100px]',
+        md: 'w-[120px]',
+        lg: 'w-[120px]'
+      },
       flag: {
         sm: '!-mt-[14px]',
         md: '!-mt-[9px] rounded',
@@ -360,6 +370,11 @@ export const themes = {
       }
     },
     PhoneInput: {
+      countrySelectWidth: {
+        sm: 'w-[100px]',
+        md: 'w-[120px]',
+        lg: 'w-[120px]'
+      },
       flag: {
         sm: '!-mt-[14px]',
         md: '!-mt-[9px] rounded',