wip : changed bg color for select component

packages/nc-gui/assets/style.scss

@@ -52,13 +52,16 @@ main {
   @apply m-0 h-full w-full bg-white;
 }
 
-
 .nc-input-md {
   @apply !rounded-lg !py-2 !px-3 mb-1;
 }
 
 .mobile {
-  .nc-scrollbar-md, .nc-scrollbar-x-md, .nc-scrollbar-dark-md, .nc-scrollbar-x-md-dark, .nc-scrollbar-x-lg {
+  .nc-scrollbar-md,
+  .nc-scrollbar-x-md,
+  .nc-scrollbar-dark-md,
+  .nc-scrollbar-x-md-dark,
+  .nc-scrollbar-x-lg {
     &::-webkit-scrollbar {
       width: 0px;
     }
@@ -93,7 +96,6 @@ main {
   overflow-x: scroll;
   scrollbar-width: thin !important;
 
-
   &::-webkit-scrollbar {
     width: 4px;
     height: 4px;
@@ -108,7 +110,6 @@ main {
     -webkit-border-radius: 10px;
     border-radius: 10px;
 
-
     width: 4px;
     @apply bg-gray-200;
   }
@@ -122,7 +123,6 @@ main {
   overflow-x: hidden;
   scrollbar-width: thin !important;
 
-
   &::-webkit-scrollbar {
     width: 4px;
     height: 4px;
@@ -154,7 +154,6 @@ main {
   overflow-x: scroll;
   scrollbar-width: thin !important;
 
-  
   &::-webkit-scrollbar {
     width: 4px;
     height: 4px;
@@ -169,14 +168,11 @@ main {
     -webkit-border-radius: 10px;
     border-radius: 10px;
 
-
     width: 4px;
-    background-color: rgba(0, 0, 0, 0.3)
-
+    background-color: rgba(0, 0, 0, 0.3);
   }
   &::-webkit-scrollbar-thumb:hover {
-    background-color: rgba(0, 0, 0, 0.4)
-
+    background-color: rgba(0, 0, 0, 0.4);
   }
 }
 
@@ -197,7 +193,6 @@ main {
     -webkit-border-radius: 10px;
     border-radius: 10px;
 
-
     width: 8px;
     @apply bg-gray-200;
   }
@@ -498,8 +493,9 @@ a {
   @apply p-4;
 }
 
+.ant-select-item-option-selected:not(.ant-select-item-option-disabled),
 .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
-  @apply bg-primary bg-opacity-20;
+  @apply bg-gray-300 bg-opacity-20;
 }
 
 .ant-select-selection-search-input:focus {
@@ -653,7 +649,8 @@ input[type='number'] {
   .nc-emoji {
     @apply xs:(text-lg);
   }
-  .material-symbols, .nc-icon {
+  .material-symbols,
+  .nc-icon {
     @apply !xs:(text-xl -mt-0.25);
   }
 
@@ -662,7 +659,7 @@ input[type='number'] {
   }
 
   .nc-sidebar-node-btn:not(.nc-sidebar-expand) {
-    @apply !xs:(hidden)
+    @apply !xs:(hidden);
   }
 }
 
@@ -670,15 +667,14 @@ input[type='number'] {
   @apply opacity-0 group-hover:(opacity-100) text-gray-600 hover:(bg-gray-400 bg-opacity-20 text-gray-900) duration-100;
 }
 
-
 .nc-button.ant-btn.nc-sidebar-node-btn.nc-sidebar-expand {
   @apply xs:(opacity-100 hover:bg-gray-50);
 
   .nc-icon {
-    @apply xs:(visible opacity-100 !text-gray-500)
+    @apply xs:(visible opacity-100 !text-gray-500);
   }
 }
 
 .ant-message-notice-content {
   @apply !rounded-md;
-}
+}

packages/nc-gui/components/nc/Select.vue

@@ -65,6 +65,10 @@ const onChange = (value: string) => {
   @apply !xs:mt-1.75;
 }
 
+.ant-select-item-option {
+  @apply !rounded-md my-0.5;
+}
+
 .nc-select.ant-select {
   height: fit-content;
   .ant-select-selector {
@@ -90,7 +94,7 @@ const onChange = (value: string) => {
 }
 
 .nc-select-dropdown {
-  @apply !rounded-xl py-1.5;
+  @apply !rounded-xl p-1.5;
 
   .rc-virtual-list-holder {
     overflow-y: scroll;