From ea92af6244984c9bcd271411624228b6e9ba7ef1 Mon Sep 17 00:00:00 2001
From: Shariq Ansari <sharique.rik@gmail.com>
Date: Mon, 29 Apr 2024 22:56:22 +0530
Subject: [PATCH] fix: truncate field label

---
 frontend/src/components/SectionFields.vue | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/SectionFields.vue b/frontend/src/components/SectionFields.vue
index 914d4c73..fb335158 100644
--- a/frontend/src/components/SectionFields.vue
+++ b/frontend/src/components/SectionFields.vue
@@ -6,10 +6,12 @@
       :class="[field.hidden && 'hidden']"
       class="flex items-center gap-2 px-3 leading-5 first:mt-3"
     >
-      <div class="w-[106px] shrink-0 text-sm text-gray-600">
-        {{ __(field.label) }}
-        <span class="text-red-500">{{ field.reqd ? ' *' : '' }}</span>
-      </div>
+      <Tooltip :text="__(field.label)" hoverDelay="1">
+        <div class="w-[106px] shrink-0 truncate text-sm text-gray-600">
+          <span>{{ __(field.label) }}</span>
+          <span class="text-red-500">{{ field.reqd ? ' *' : '' }}</span>
+        </div>
+      </Tooltip>
       <div
         class="grid min-h-[28px] flex-1 items-center overflow-hidden text-base"
       >