From 4d34661437a1ed198a4892893867df575c14d37f Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Thu, 23 Sep 2021 13:44:39 +0530
Subject: [PATCH] feat: form view ui

Signed-off-by: Pranav C <pranavxc@gmail.com>
---
 .../project/spreadsheet/views/formView.vue           | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui/components/project/spreadsheet/views/formView.vue b/packages/nc-gui/components/project/spreadsheet/views/formView.vue
index d64c09f4f9..6e383edbc6 100644
--- a/packages/nc-gui/components/project/spreadsheet/views/formView.vue
+++ b/packages/nc-gui/components/project/spreadsheet/views/formView.vue
@@ -2,7 +2,7 @@
   <v-container fluid class="h-100 backgroundColor">
     <v-row class="h-100">
       <v-col cols="3">
-        <v-card class="h-100 pa-2 backgroundColor elevation-0">
+        <v-card class="h-100 pa-2 backgroundColor elevation-0 nc-form-left-nav">
           <div class="d-flex grey--text">
             <span class="">Fields</span>
             <v-spacer />
@@ -161,6 +161,10 @@
               </div>
               <!--            </v-card>-->
             </div>
+
+            <div v-if="!columns.length" class="mt-1 nc-drag-n-drop-to-show py-4 text-center grey--text text--lighter-1">
+              Drag and drop field here to add
+            </div>
           </draggable>
           <div class="my-10 text-center">
             <v-btn color="primary">
@@ -353,11 +357,15 @@ export default {
   }
 }
 
-.nc-drag-n-drop-to-hide {
+.nc-drag-n-drop-to-hide, .nc-drag-n-drop-to-show {
   border: 2px dotted #a1a1a1;
   border-radius: 4px;
   font-size: .6rem;
   color: grey
 }
 
+.nc-form-left-nav{
+  max-height: 100%;
+}
+
 </style>