From 2a444e27a372905e0418355e0625e36707a8f3fc Mon Sep 17 00:00:00 2001
From: nith2001 <nith2001@uw.edu>
Date: Wed, 3 May 2023 13:14:09 -0700
Subject: [PATCH] Solving error description wrapping in survey and button
 overlap

---
 packages/nc-gui/components/smartsheet/Cell.vue              | 2 +-
 .../pages/[projectType]/form/[viewId]/index/survey.vue      | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet/Cell.vue b/packages/nc-gui/components/smartsheet/Cell.vue
index 2023ec9604..8278d31864 100644
--- a/packages/nc-gui/components/smartsheet/Cell.vue
+++ b/packages/nc-gui/components/smartsheet/Cell.vue
@@ -188,7 +188,7 @@ onUnmounted(() => {
 <template>
   <div
     ref="elementToObserve"
-    class="nc-cell w-full h-full relative"
+    class="nc-cell w-full relative"
     :class="[
       `nc-cell-${(column?.uidt || 'default').toLowerCase()}`,
       { 'text-blue-600': isPrimary(column) && !props.virtual && !isForm },
diff --git a/packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue b/packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue
index 3a8718ad5e..2b1122b78d 100644
--- a/packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue
+++ b/packages/nc-gui/pages/[projectType]/form/[viewId]/index/survey.vue
@@ -306,7 +306,7 @@ onMounted(() => {
               />
 
               <div class="flex flex-col gap-2 text-slate-500 dark:text-slate-300 text-[0.75rem] my-2 px-1">
-                <div v-for="error of v$.localState[field.title]?.$errors" :key="error" class="text-red-500">
+                <div v-for="error of v$.localState[field.title]?.$errors" :key="error" class="nc-form-field-required-error text-red-500">
                   {{ error.$message }}
                 </div>
                 <div
@@ -499,9 +499,9 @@ onMounted(() => {
     }
   }
 
-  .nc-form-field-description {
-    white-space: pre-line;
+  .nc-form-field-description, .nc-form-field-required-error {
     word-break: break-all;
+
   }
 
   .nc-form-column-label__checkbox {