From 5db8deb83dc89d2f9abf93e23986a27b24463d94 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Mon, 20 Jan 2025 14:33:57 +0700
Subject: [PATCH] fix: improve layout by adding full-width class to elements

---
 src/components/upload-file/UploadFileCard.vue    | 6 ++++--
 src/components/upload-file/UploadFileSection.vue | 1 +
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/upload-file/UploadFileCard.vue b/src/components/upload-file/UploadFileCard.vue
index 50b30cac..2e269d8b 100644
--- a/src/components/upload-file/UploadFileCard.vue
+++ b/src/components/upload-file/UploadFileCard.vue
@@ -54,8 +54,10 @@ onMounted(() => {
     @click="$emit('click')"
   >
     <q-icon :name="icon" size="lg" :style="`color: ${color}`" />
-    <article class="col column q-pl-md ellipsis">
-      <span>{{ name }}</span>
+    <article class="col column q-pl-md">
+      <span class="ellipsis full-width">
+        {{ name }}
+      </span>
       <span class="text-caption app-text-muted-2">
         {{
           uploading.loaded
diff --git a/src/components/upload-file/UploadFileSection.vue b/src/components/upload-file/UploadFileSection.vue
index 85f41f1d..972d9a21 100644
--- a/src/components/upload-file/UploadFileSection.vue
+++ b/src/components/upload-file/UploadFileSection.vue
@@ -82,6 +82,7 @@ function pickFile() {
       <div
         v-for="(d, j) in fileData"
         :key="j"
+        class="full-width"
         :class="{
           'q-pt-md': layout === 'row' && j === 0,
           'q-pt-sm': j > 0,