refactor(gui): avoid next and prev intersection with expanded form content

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui/assets/style.scss

@@ -318,3 +318,9 @@ a {
   white-space: pre;
   user-select: auto;
 }
+
+
+
+.nc-drawer-expanded-form .ant-drawer-content-wrapper {
+  transition: width 0.3s !important;
+}

packages/nc-gui/components/smartsheet/expanded-form/index.vue

@@ -163,7 +163,7 @@ export default {
   <a-drawer
     v-model:visible="isExpanded"
     :footer="null"
-    width="min(90vw,800px)"
+    :width="commentsDrawer ? 'min(90vw,900px)' : 'min(90vw,700px)'"
     :body-style="{ 'padding': 0, 'display': 'flex', 'flex-direction': 'column' }"
     :closable="false"
     class="nc-drawer-expanded-form"
@@ -171,7 +171,9 @@ export default {
   >
     <SmartsheetExpandedFormHeader :view="props.view" @cancel="onClose" @duplicate-row="onDuplicateRow" />
 
-    <div class="!bg-gray-100 rounded flex-1 relative">
+    <div class="!bg-gray-100 rounded flex-1">
+      <div class="flex h-full nc-form-wrapper items-stretch min-h-[max(70vh,100%)]">
+        <div class="flex-1 overflow-auto scrollbar-thin-dull nc-form-fields-container relative">
           <template v-if="props.showNextPrevIcons">
             <a-tooltip placement="bottom">
               <template #title>
@@ -186,9 +188,6 @@ export default {
               <MdiChevronLeft class="cursor-pointer nc-prev-arrow" @click="$emit('prev')" />
             </a-tooltip>
           </template>
-
-      <div class="flex h-full nc-form-wrapper items-stretch min-h-[max(70vh,100%)]">
-        <div class="flex-1 overflow-auto scrollbar-thin-dull nc-form-fields-container">
           <div class="w-[500px] mx-auto">
             <div v-if="duplicatingRowInProgress" class="flex items-center justify-center h-[100px]">
               <a-spin size="large" />