From 608b73ac931bc9329c915c8f3ddb4edb50232dcc Mon Sep 17 00:00:00 2001
From: Raju Udava <86527202+dstala@users.noreply.github.com>
Date: Fri, 22 Dec 2023 11:01:21 +0000
Subject: [PATCH] merge fix

---
 packages/nc-gui/assets/style.scss            | 26 +++++++++++++++++++-
 packages/nc-gui/components/cell/TextArea.vue | 17 ++++++++++---
 2 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/assets/style.scss b/packages/nc-gui/assets/style.scss
index a17cc73f88..b9d6529c4a 100644
--- a/packages/nc-gui/assets/style.scss
+++ b/packages/nc-gui/assets/style.scss
@@ -57,7 +57,7 @@ main {
 }
 
 .mobile {
-  .nc-scrollbar-md, .nc-scrollbar-x-md, .nc-scrollbar-dark-md, .nc-scrollbar-x-md-dark, .nc-scrollbar-x-lg {
+  .nc-scrollbar-md, .nc-scrollbar-lg, .nc-scrollbar-x-md, .nc-scrollbar-dark-md, .nc-scrollbar-x-md-dark, .nc-scrollbar-x-lg {
     &::-webkit-scrollbar {
       width: 0px;
     }
@@ -88,6 +88,30 @@ main {
   }
 }
 
+.nc-scrollbar-lg {
+  overflow-y: scroll;
+  overflow-x: hidden;
+  scrollbar-width: thin !important;
+
+  &::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+  }
+  &::-webkit-scrollbar-track-piece {
+    width: 0px;
+  }
+  &::-webkit-scrollbar {
+    @apply bg-transparent;
+  }
+  &::-webkit-scrollbar-thumb {
+    width: 4px;
+    @apply bg-gray-200;
+  }
+  &::-webkit-scrollbar-thumb:hover {
+    @apply bg-gray-300;
+  }
+}
+
 .nc-scrollbar-x-md {
   overflow-x: scroll;
   scrollbar-width: thin !important;
diff --git a/packages/nc-gui/components/cell/TextArea.vue b/packages/nc-gui/components/cell/TextArea.vue
index a1cc284f0e..f4c39842de 100644
--- a/packages/nc-gui/components/cell/TextArea.vue
+++ b/packages/nc-gui/components/cell/TextArea.vue
@@ -171,16 +171,16 @@ watch(editEnabled, () => {
 <template>
   <NcDropdown
     v-model:visible="isVisible"
-    class="overflow-hidden"
+    class="overflow-hidden group"
     :trigger="[]"
     placement="bottomLeft"
     :overlay-class-name="isVisible ? 'nc-textarea-dropdown-active' : undefined"
   >
     <div
-      class="flex flex-row pt-0.5 w-full rich-wrapper"
+      class="flex flex-row pt-0.5 w-full rich-wrapper long-text-wrapper"
       :class="{
         'min-h-10': rowHeight !== 1 || isExpandedFormOpen,
-        'min-h-6.5': rowHeight === 1 && !isExpandedFormOpen,
+        'min-h-9': rowHeight === 1 && !isExpandedFormOpen,
         'h-full': isForm,
       }"
     >
@@ -200,7 +200,7 @@ watch(editEnabled, () => {
         :ref="focus"
         v-model="vModel"
         rows="4"
-        class="h-full w-full outline-none border-none nc-scrollbar-md"
+        class="h-full w-full outline-none border-none nc-scrollbar-lg"
         :class="{
           'p-2': editEnabled,
           'py-1 h-full': isForm,
@@ -241,8 +241,17 @@ watch(editEnabled, () => {
       <NcTooltip
         v-if="!isVisible"
         placement="bottom"
+<<<<<<< HEAD
         class="!absolute right-0 bottom-1 hidden nc-text-area-expand-btn"
         :class="{ 'right-0 bottom-1': editEnabled, '!bottom-0': !isRichMode }"
+=======
+        class="!absolute right-0 nc-text-area-expand-btn"
+        :class="{
+          'right-0': editEnabled,
+          'top-1 hidden !group-hover:block': isExpandedFormOpen,
+          'bottom-1': !isExpandedFormOpen,
+        }"
+>>>>>>> c82848799 (fix: Fixed styling issues)
       >
         <template #title>{{ $t('title.expand') }}</template>
         <NcButton type="secondary" size="xsmall" data-testid="attachment-cell-file-picker-button" @click.stop="onExpand">