fix(dropdown-menu): resolve checkbox style (#1129)

Tencent · Nov 28, 2022 · 5051ee2 · 5051ee2
1 parent a9be36b
commit 5051ee2
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 5 deletions.
diff --git a/src/checkbox/checkbox.less b/src/checkbox/checkbox.less
@@ -17,6 +17,8 @@
 @checkbox-icon-disabled-color: var(--td-checkbox-icon-disabled-color, @primary-color-3);
 @checkbox-icon-disabled-bg-color: var(--td-checkbox-icon-disabled-bg-color, @gray-color-2);
 @checkbox-icon-checked-color: var(--td-checkbox-icon-checked-color, @primary-color);
+@checkbox-tag-active-bg-color: var(--td-checkbox-tag-active-bg-color, @primary-color-1);
+@checkbox-tag-active-color: var(--td-checkbox-tag-active-color, @primary-color);
 
 .@{checkbox} {
   display: inline-flex;
@@ -202,9 +204,13 @@
     background-color: #f3f3f3;
     border-radius: 8rpx;
 
-    &.@{prefix}-is-actived {
-      color: #0052d9;
-      background-color: #ecf2fe;
+    &.@{checkbox}--checked {
+      color: @checkbox-tag-active-color;
+      background-color: @checkbox-tag-active-bg-color;
+    }
+
+    .@{checkbox}__title--checked {
+      color: @checkbox-tag-active-color;
     }
 
     .@{checkbox}__content {

diff --git a/src/checkbox/checkbox.wxml b/src/checkbox/checkbox.wxml
@@ -31,7 +31,7 @@
   </view>
   <view class="{{classPrefix}}__content" data-target="text" bind:tap="onChange">
     <view
-      class="{{_.cls(classPrefix + '__title', [['disabled', disabled]])}} {{prefix}}-class-label"
+      class="{{_.cls(classPrefix + '__title', [['disabled', disabled], ['checked', checked]])}} {{prefix}}-class-label"
       style="-webkit-line-clamp:{{maxLabelRow}}"
     >
       {{label}}

diff --git a/src/dropdown-menu/dropdown-item.wxml b/src/dropdown-menu/dropdown-item.wxml
@@ -30,7 +30,7 @@
               wx:for="{{options}}"
               wx:key="index"
               class="{{classPrefix}}__radio-item {{prefix}}-class-column-item"
-              icon="stroke-line"
+              icon="line"
               align="right"
               t-class="radio"
               t-class-label="radio__label radio__label--{{value == item[valueAlias] ? 'active' : ''}} {{prefix}}-class-column-item-label"