Nc fix/minor bug fixes1 (#9174)

* fix(nc-gui): all tables tab btn icon alignment issue

* fix(nc-gui): link field modal gap issue

---------

Co-authored-by: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>

packages/nc-gui/components/project/AllTables.vue

@@ -125,7 +125,9 @@ const onCreateBaseClick = () => {
         data-testid="proj-view-btn__add-new-table"
         @click="openTableCreateDialog()"
       >
-        <GeneralIcon icon="addOutlineBox" class="!h-8 !w-8 !text-brand-500" />
+        <div class="icon-wrapper">
+          <GeneralIcon icon="addOutlineBox" class="!h-8 !w-8 !text-brand-500" />
+        </div>
         <div class="flex flex-col gap-1">
           <div class="label">{{ $t('general.create') }} {{ $t('general.new') }} {{ $t('objects.table') }}</div>
           <div class="subtext">Start from scratch.</div>
@@ -140,7 +142,9 @@ const onCreateBaseClick = () => {
         data-testid="proj-view-btn__import-data"
         @click="isImportModalOpen = true"
       >
-        <GeneralIcon icon="download" class="!h-7.5 !w-7.5 !text-orange-700" />
+        <div class="icon-wrapper">
+          <GeneralIcon icon="download" class="!h-7.5 !w-7.5 !text-orange-700" />
+        </div>
         <div class="flex flex-col gap-1">
           <div class="label">{{ $t('activity.import') }} {{ $t('general.data') }}</div>
 
@@ -166,7 +170,9 @@ const onCreateBaseClick = () => {
           }"
           @click="onCreateBaseClick"
         >
-          <GeneralIcon icon="server1" class="!h-7 !w-7 !text-green-700" />
+          <div class="icon-wrapper">
+            <GeneralIcon icon="server1" class="!h-7 !w-7 !text-green-700" />
+          </div>
           <div class="flex flex-col gap-1">
             <div class="label">{{ $t('labels.connectDataSource') }}</div>
             <div class="subtext">In realtime to external databases.</div>
@@ -272,8 +278,12 @@ const onCreateBaseClick = () => {
     box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
   }
 
+  .icon-wrapper{
+    @apply w-8 h-8 flex items-center;
+  }
+
   .nc-icon {
-    @apply h-10 w-10;
+    @apply flex-none h-10 w-10;
   }
 
   .label {

packages/nc-gui/components/smartsheet/column/LinkedToAnotherRecordOptions.vue

@@ -316,72 +316,76 @@ const onFilterLabelClick = () => {
       </a-form-item>
     </template>
 
-    <div class="flex gap-2 items-center" :class="{ 'mb-2': limitRecToView }">
-      <a-switch
-        v-model:checked="limitRecToView"
-        v-e="['c:link:limit-record-by-view', { status: limitRecToView }]"
-        size="small"
-        :disabled="!vModel.childId && !(vModel.is_custom_link && vModel.custom?.ref_model_id)"
-        @change="onLimitRecToViewChange"
-      ></a-switch>
-      <span
-        v-e="['c:link:limit-record-by-view', { status: limitRecToView }]"
-        class="text-s"
-        data-testid="nc-limit-record-view"
-        @click="onViewLabelClick"
-        >Limit record selection to a view</span
-      >
-    </div>
-    <a-form-item v-if="limitRecToView" class="!pl-8 flex w-full pb-2 mt-4 space-y-2 nc-ltar-child-view">
-      <NcSelect
-        v-model:value="vModel.childViewId"
-        :placeholder="$t('labels.selectView')"
-        show-search
-        :filter-option="filterOption"
-        dropdown-class-name="nc-dropdown-ltar-child-view"
-      >
-        <a-select-option v-for="view of refViews" :key="view.title" :value="view.id">
-          <div class="flex w-full items-center gap-2">
-            <div class="min-w-5 flex items-center justify-center">
-              <GeneralViewIcon :meta="view" class="text-gray-500" />
-            </div>
-              <span v-if="view.is_default">{{ $t('labels.defaultView') }}</span>
-              <NcTooltip v-else class="flex-1 truncate" show-on-truncate-only>
-              <template #title>{{ view.title }}</template>
-              <span>{{ view.title }}</span>
-            </NcTooltip>
-          </div>
-        </a-select-option>
-      </NcSelect>
-    </a-form-item>
-
     <template v-if="isEeUI">
-      <div class="flex gap-2 items-center" :class="{ 'mb-2': limitRecToCond }">
-        <a-switch
-          v-model:checked="limitRecToCond"
-          v-e="['c:link:limit-record-by-filter', { status: limitRecToCond }]"
-          :disabled="!vModel.childId && !(vModel.is_custom_link && vModel.custom?.ref_model_id)"
-          size="small"
-        ></a-switch>
-        <span
-          v-e="['c:link:limit-record-by-filter', { status: limitRecToCond }]"
-          data-testid="nc-limit-record-filters"
-          @click="onFilterLabelClick"
-        >
-          Limit record selection to filters
-        </span>
+      <div class="flex flex-col gap-2">
+        <div class="flex gap-2 items-center">
+          <a-switch
+            v-model:checked="limitRecToView"
+            v-e="['c:link:limit-record-by-view', { status: limitRecToView }]"
+            size="small"
+            :disabled="!vModel.childId && !(vModel.is_custom_link && vModel.custom?.ref_model_id)"
+            @change="onLimitRecToViewChange"
+          ></a-switch>
+          <span
+            v-e="['c:link:limit-record-by-view', { status: limitRecToView }]"
+            class="text-s"
+            data-testid="nc-limit-record-view"
+            @click="onViewLabelClick"
+            >Limit record selection to a view</span
+          >
+        </div>
+        <a-form-item v-if="limitRecToView" class="!pl-8 flex w-full pb-2 mt-4 space-y-2 nc-ltar-child-view">
+          <NcSelect
+            v-model:value="vModel.childViewId"
+            :placeholder="$t('labels.selectView')"
+            show-search
+            :filter-option="filterOption"
+            dropdown-class-name="nc-dropdown-ltar-child-view"
+          >
+            <a-select-option v-for="view of refViews" :key="view.title" :value="view.id">
+              <div class="flex w-full items-center gap-2">
+                <div class="min-w-5 flex items-center justify-center">
+                  <GeneralViewIcon :meta="view" class="text-gray-500" />
+                </div>
+                <span v-if="view.is_default">{{ $t('labels.defaultView') }}</span>
+                <NcTooltip v-else class="flex-1 truncate" show-on-truncate-only>
+                  <template #title>{{ view.title }}</template>
+                  <span>{{ view.title }}</span>
+                </NcTooltip>
+              </div>
+            </a-select-option>
+          </NcSelect>
+        </a-form-item>
       </div>
-      <div v-if="limitRecToCond" class="overflow-auto">
-        <LazySmartsheetToolbarColumnFilter
-          ref="filterRef"
-          v-model="vModel.filters"
-          class="!pl-8 !p-0 max-w-620px"
-          :auto-save="false"
-          :show-loading="false"
-          :link="true"
-          :root-meta="meta"
-          :link-col-id="vModel.id"
-        />
+
+      <div class="flex flex-col gap-2">
+        <div class="flex gap-2 items-center">
+          <a-switch
+            v-model:checked="limitRecToCond"
+            v-e="['c:link:limit-record-by-filter', { status: limitRecToCond }]"
+            :disabled="!vModel.childId && !(vModel.is_custom_link && vModel.custom?.ref_model_id)"
+            size="small"
+          ></a-switch>
+          <span
+            v-e="['c:link:limit-record-by-filter', { status: limitRecToCond }]"
+            data-testid="nc-limit-record-filters"
+            @click="onFilterLabelClick"
+          >
+            Limit record selection to filters
+          </span>
+        </div>
+        <div v-if="limitRecToCond" class="overflow-auto">
+          <LazySmartsheetToolbarColumnFilter
+            ref="filterRef"
+            v-model="vModel.filters"
+            class="!pl-8 !p-0 max-w-620px"
+            :auto-save="false"
+            :show-loading="false"
+            :link="true"
+            :root-meta="meta"
+            :link-col-id="vModel.id"
+          />
+        </div>
       </div>
     </template>
     <template v-if="(!isXcdbBase && !isEdit) || isLinks">