From 575178c0298ff916d5c791d68f8d6c55aa2e8cb1 Mon Sep 17 00:00:00 2001
From: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
Date: Thu, 28 Mar 2024 06:27:25 +0530
Subject: [PATCH] Nc fix(nc-gui): Reduce gap between icons in rating field to
 fit 10 icons in default width of column (#7986)

* fix(nc-gui): reduce rating field gap between icons to fit 10 icons in column default width

* fix(nc-gui): keep rating field cell content left align
---
 packages/nc-gui/components/cell/Rating.vue                | 8 +++++++-
 packages/nc-gui/components/smartsheet/Cell.vue            | 2 +-
 .../nc-gui/components/smartsheet/column/RatingOptions.vue | 2 +-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/packages/nc-gui/components/cell/Rating.vue b/packages/nc-gui/components/cell/Rating.vue
index 6cd4e158ee..be981cd3a7 100644
--- a/packages/nc-gui/components/cell/Rating.vue
+++ b/packages/nc-gui/components/cell/Rating.vue
@@ -77,7 +77,7 @@ watch(rateDomRef, () => {
     :disabled="readOnly"
     :count="ratingMeta.max"
     :class="readOnly ? 'pointer-events-none' : ''"
-    :style="`color: ${ratingMeta.color}; padding: ${isExpandedFormOpen ? '0px 8px' : '0px 5px'};`"
+    :style="`color: ${ratingMeta.color}; padding: ${isExpandedFormOpen ? '0px 8px' : '0px 2px'};`"
     :key="ratingMeta.icon.full"
     @keydown="onKeyPress"
   >
@@ -90,3 +90,9 @@ watch(rateDomRef, () => {
     </template>
   </a-rate>
 </template>
+
+<style scoped lang="scss">
+:deep(li:not(:last-child)) {
+  @apply mr-[1.5px];
+}
+</style>
diff --git a/packages/nc-gui/components/smartsheet/Cell.vue b/packages/nc-gui/components/smartsheet/Cell.vue
index ab00a08cc2..7618e9fe1d 100644
--- a/packages/nc-gui/components/smartsheet/Cell.vue
+++ b/packages/nc-gui/components/smartsheet/Cell.vue
@@ -195,7 +195,7 @@ onUnmounted(() => {
       `nc-cell-${(column?.uidt || 'default').toLowerCase()}`,
       {
         'text-brand-500': isPrimary(column) && !props.virtual && !isForm && !isCalendar,
-        'nc-grid-numeric-cell-right': isGrid && isNumericField && !isEditColumnMenu && !isForm && !isExpandedFormOpen,
+        'nc-grid-numeric-cell-right': isGrid && isNumericField && !isEditColumnMenu && !isForm && !isExpandedFormOpen && !isRating(column),
         'h-10': !isEditColumnMenu && isForm && !isAttachment(column) && !isTextArea(column) && !isJSON(column) && !props.virtual,
         'nc-grid-numeric-cell-left': (isForm && isNumericField && isExpandedFormOpen) || isEditColumnMenu,
         '!min-h-30': isTextArea(column) && (isForm || isSurveyForm),
diff --git a/packages/nc-gui/components/smartsheet/column/RatingOptions.vue b/packages/nc-gui/components/smartsheet/column/RatingOptions.vue
index fefdbe9c41..5a22355aac 100644
--- a/packages/nc-gui/components/smartsheet/column/RatingOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/RatingOptions.vue
@@ -78,7 +78,7 @@ watch(
               <div class="flex-1">
                 <component
                   :is="getMdiIcon(icon.full)"
-                  class="mx-1"
+                  class="mr-[2px]"
                   :style="{
                     color: vModel.meta.color,
                   }"