fix(nc-gui): uneven menu item heights

packages/nc-gui/components/smartsheet/sidebar/MenuBottom.vue

@@ -21,13 +21,13 @@ function onOpenModal(type: ViewTypes, title = '') {
 <template>
   <a-menu :selected-keys="[]" class="flex flex-col">
     <div>
-      <h3 class="px-3 py-1 text-xs font-semibold flex items-center gap-4 text-gray-500">
+      <h3 class="px-3 text-xs font-semibold flex items-center gap-4 text-gray-500">
         {{ $t('activity.createView') }}
       </h3>
 
       <a-menu-item
         key="grid"
-        class="group !flex !items-center !my-0 !h-[30px] nc-create-grid-view"
+        class="group !flex !items-center !my-0 !h-2.5rem nc-create-grid-view"
         @click="onOpenModal(ViewTypes.GRID)"
       >
         <a-tooltip :mouse-enter-delay="1" placement="left">
@@ -35,7 +35,7 @@ function onOpenModal(type: ViewTypes, title = '') {
             {{ $t('msg.info.addView.grid') }}
           </template>
 
-          <div class="nc-project-menu-item text-xs flex items-center h-full w-full gap-2">
+          <div class="nc-project-menu-item !py-0 text-xs flex items-center h-full w-full gap-2">
             <component :is="viewIcons[ViewTypes.GRID].icon" :style="{ color: viewIcons[ViewTypes.GRID].color }" />
 
             <div>{{ $t('objects.viewType.grid') }}</div>
@@ -49,7 +49,7 @@ function onOpenModal(type: ViewTypes, title = '') {
 
       <a-menu-item
         key="gallery"
-        class="group !flex !items-center !my-0 nc-create-gallery-view"
+        class="group !flex !items-center !my-0 !h-2.5rem nc-create-gallery-view"
         @click="onOpenModal(ViewTypes.GALLERY)"
       >
         <a-tooltip :mouse-enter-delay="1" placement="left">
@@ -57,7 +57,7 @@ function onOpenModal(type: ViewTypes, title = '') {
             {{ $t('msg.info.addView.gallery') }}
           </template>
 
-          <div class="nc-project-menu-item text-xs flex items-center h-full w-full gap-2">
+          <div class="nc-project-menu-item !py-0 text-xs flex items-center h-full w-full gap-2">
             <component :is="viewIcons[ViewTypes.GALLERY].icon" :style="{ color: viewIcons[ViewTypes.GALLERY].color }" />
 
             <div>{{ $t('objects.viewType.gallery') }}</div>
@@ -72,7 +72,7 @@ function onOpenModal(type: ViewTypes, title = '') {
       <a-menu-item
         v-if="!isSqlView"
         key="form"
-        class="group !flex !items-center !my-0 !h-[30px] nc-create-form-view"
+        class="group !flex !items-center !my-0 !h-2.5rem nc-create-form-view"
         @click="onOpenModal(ViewTypes.FORM)"
       >
         <a-tooltip :mouse-enter-delay="1" placement="left">
@@ -80,7 +80,7 @@ function onOpenModal(type: ViewTypes, title = '') {
             {{ $t('msg.info.addView.form') }}
           </template>
 
-          <div class="nc-project-menu-item text-xs flex items-center h-full w-full gap-2">
+          <div class="nc-project-menu-item !py-0 text-xs flex items-center h-full w-full gap-2">
             <component :is="viewIcons[ViewTypes.FORM].icon" :style="{ color: viewIcons[ViewTypes.FORM].color }" />
 
             <div>{{ $t('objects.viewType.form') }}</div>
@@ -94,7 +94,7 @@ function onOpenModal(type: ViewTypes, title = '') {
 
       <a-menu-item
         key="kanban"
-        class="group !flex !items-center !my-0 nc-create-kanban-view"
+        class="group !flex !items-center !my-0 !h-2.5rem nc-create-kanban-view"
         @click="onOpenModal(ViewTypes.KANBAN)"
       >
         <a-tooltip :mouse-enter-delay="1" placement="left">
@@ -102,7 +102,7 @@ function onOpenModal(type: ViewTypes, title = '') {
             {{ $t('msg.info.addView.kanban') }}
           </template>
 
-          <div class="nc-project-menu-item text-xs flex items-center h-full w-full gap-2">
+          <div class="nc-project-menu-item !py-0 text-xs flex items-center h-full w-full gap-2">
             <component :is="viewIcons[ViewTypes.KANBAN].icon" :style="{ color: viewIcons[ViewTypes.KANBAN].color }" />
 
             <div>{{ $t('objects.viewType.kanban') }}</div>