From 0ab90d6722859d690e79f2099294e37f77df5c1d Mon Sep 17 00:00:00 2001
From: zhanyini <zhanyini666@163.com>
Date: Sat, 28 Oct 2023 00:05:41 -0700
Subject: [PATCH] fix(option): Fixed incorrect style when using the multiple
 limit attribute in the Select component

---
 packages/theme/src/option/index.less | 9 +++++----
 packages/vue/src/option/src/pc.vue   | 8 ++++++--
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/packages/theme/src/option/index.less b/packages/theme/src/option/index.less
index f843ffc2f7..78ffee377d 100644
--- a/packages/theme/src/option/index.less
+++ b/packages/theme/src/option/index.less
@@ -37,9 +37,9 @@
             background-color: var(--ti-option-disabled-bg-color);
           }
         }
-        > :first-child{
+        .@{option-prefix-cls}__checkbox-wrap {
           color: var(--ti-option-selected-text-color);
-          }
+        }
       }
     }
   }
@@ -77,7 +77,8 @@
     .@{checkbox-prefix-cls}__inner {
       border-color: var(--ti-option-checkbox-border-color-hover);
     }
-    .halfselect, .checked-sur{
+    .halfselect,
+    .checked-sur {
       .@{checkbox-prefix-cls}__inner {
         border-color: var(--ti-option-checkbox-all-select-border-color-hover);
       }
@@ -114,4 +115,4 @@
   &.memorize-highlight.selected {
     color: var(--ti-option-highlight-selected-text-color);
   }
-}
\ No newline at end of file
+}
diff --git a/packages/vue/src/option/src/pc.vue b/packages/vue/src/option/src/pc.vue
index 3320802d5e..3e6606574a 100644
--- a/packages/vue/src/option/src/pc.vue
+++ b/packages/vue/src/option/src/pc.vue
@@ -28,11 +28,15 @@
       highlightClass
     ]"
   >
-    <span v-if="state.select.multiple && (state.select.optimization || !state.select.state.multipleLimit)">
+    <span
+      v-if="state.select.multiple && (state.select.optimization || !state.select.state.multipleLimit)"
+      class="tiny-option__checkbox-wrap"
+    >
       <tiny-checkbox
         :model-value="state.itemSelected"
         :disabled="disabled || state.groupDisabled || state.limitReached"
-      ></tiny-checkbox>
+      >
+      </tiny-checkbox>
     </span>
     <slot>
       <span>{{ state.currentLabel }}</span>