From 9d55d1f4bf96fb090b9921db0bd54cf6767ccbfa Mon Sep 17 00:00:00 2001
From: Dede Fuji Abdul <defuj.official@gmail.com>
Date: Tue, 27 Feb 2024 17:26:08 +0700
Subject: [PATCH] Refactor DialogPanel class in DetailDialog.vue to support
 fullWidth option

---
 src/components/Dialogs/DetailDialog.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/Dialogs/DetailDialog.vue b/src/components/Dialogs/DetailDialog.vue
index 337fbf0..f82cc9b 100755
--- a/src/components/Dialogs/DetailDialog.vue
+++ b/src/components/Dialogs/DetailDialog.vue
@@ -15,6 +15,10 @@ defineProps({
         type: String,
         required: true,
     },
+    fullWidth: {
+        type: Boolean,
+        default: false,
+    },
 })
 const emit = defineEmits(['onClose'])
 const handleOnClose = () => {
@@ -38,7 +42,7 @@ const handleOnClose = () => {
                         leave-from="opacity-100 translate-y-0 sm:scale-100"
                         leave-to="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">
                         <DialogPanel
-                            :class="['sm:max-w-lg relative overflow-hidden text-left transition-all transform bg-gray-50 rounded-2xl sm:my-8 sm:w-full']">
+                            :class="[fullWidth ? 'sm:max-w-[90%]' : 'sm:max-w-lg', 'relative overflow-hidden text-left transition-all transform bg-gray-50 rounded-2xl sm:my-8 sm:w-full']">
                             <!-- Body Section -->
                             <div class="px-4 py-4 bg-gray-50">
                                 <div class="flex flex-col items-start">