Nc fix: UI improvements (#8223)

* fix(nc-gui): add background color for row on hover in grid view

* fix(nc-gui): reduce width of index column

* fix(nc-gui): on hover grid row bg opacity issue

* fix(nc-gui): reduce font size and grid cell height

* fix(nc-gui): reduce font size

* fix(nc-gui): set column default width to 180px

* fix(nc-gui): revert sidebar changes

* fix(nc-gui): disable grid row hover effect if fillMode is true

* fix(nc-gui): display checkbox & row expand icon if it is active row

* fix(nc-gui): increase the weight of display value cell

* fix(nc-gui): grid cell should have constant padding

* fix(nc-gui): att cell row height auto increase issue

* fix(nc-gui): att cell center align issue

* fix(nc-gui): percent cell spacing issue

* fix(nc-gui): text overflow ellipsis

* fix(nc-gui): single select auto increase height issue if rowHeight is short

* fix(nc-gui): grayed out header text color

* fix(nc-gui): reduce header icon size

* fix(nc-gui): set 12px grid header horizontal padding

* fix(nc-gui): center align expand icon for short row height

* fix(nc-gui): rich text and select type field auto row height increase issue

* fix(nc-gui): lookup cell auto increase height issue

* fix(nc-gui): small changes

* fix(nc-gui): truncate text after no. of lines base on rowHeight

* fix(nc-gui): barcode & qrcode cell row height issue

* chore(nc-gui): lint

* fix(test): update row height pw test

* fix(test): grid toolbar rowHeight test update

* fix(nc-gui): ai review changes

* fix(test): multiselect pw test update

* fix(test): verify multiselct options test update

* fix(nc-gui): merge conflicts

* fix(nc-gui): small changes

* fix(nc-gui): small changes

* fix(nc-gui): display value should be in blue color

packages/nc-gui/components/virtual-cell/barcode/Barcode.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { ComputedRef } from 'vue'
 import JsBarcodeWrapper from './JsBarcodeWrapper.vue'
-import { RowHeightInj, computed, inject, ref } from '#imports'
+import { RowHeightInj, computed, inject, ref, rowHeightInPx } from '#imports'
 
 const maxNumberOfAllowedCharsForBarcodeValue = 100
 
@@ -66,7 +66,9 @@ const rowHeight = inject(RowHeightInj, ref(undefined))
       :barcode-value="barcodeValue"
       tabindex="-1"
       :barcode-format="barcodeMeta.barcodeFormat"
-      :custom-style="{ height: rowHeight ? `${rowHeight * 1.8}rem` : `1.8rem` }"
+      :custom-style="{
+        height: rowHeight ? `${rowHeight === 1 ? rowHeightInPx['1'] - 4 : rowHeightInPx[`${rowHeight}`] - 20}px` : `1.8rem`,
+      }"
       @on-click-barcode="showBarcodeModal"
     >
       <template #barcodeRenderError>