ant-design · jc9702507 · Oct 28, 2022 · Oct 28, 2022 · Oct 28, 2022
diff --git a/demo/pages/Checklist/index.acss b/demo/pages/Checklist/index.acss
@@ -1,6 +1,5 @@
 .demo-checklist-label {
   font-size: 32rpx;
-  color: #999;
   padding: 36rpx 0 16rpx 16rpx;
 }
 

diff --git a/demo/pages/Checklist/index.axml b/demo/pages/Checklist/index.axml
@@ -40,7 +40,7 @@
     onChange="onChange"
   >
     <view slot="icon">
-      <icon color='red' type="LikeOutline" size="x-small" class="demo-checklist-checked-icon"/>
+      <icon style='color:red' type="LikeOutline" class="demo-checklist-checked-icon"/>
     </view>
     <view slot="content" slot-scope="props">
       title: {{props.item.title}}

diff --git a/demo/pages/ImageUpload/index.acss b/demo/pages/ImageUpload/index.acss
@@ -1,10 +1,10 @@
 .demo-image-upload-show {
   padding: 8rpx;
-  background-color: #fff;
 }
 
 .demo-image-upload-title {
   font-size: 28rpx;
   padding: 16rpx;
   height: 32rpx;
+  color: rgb(105 123  140);
 }
diff --git a/demo/pages/ImageUpload/index.axml b/demo/pages/ImageUpload/index.axml
@@ -28,7 +28,7 @@
       onChange="onChange"
     >
       <view slot="uploadIcon">
-        <am-icon type="CameraOutline" color="#999" size="small"/>
+        <am-icon type="CameraOutline" style="color:#999"/>
       </view>
     </uploader>
   </view>

diff --git a/demo/pages/TabBar/index.js b/demo/pages/TabBar/index.js
@@ -45,19 +45,16 @@ Page({
         text: '首页',
       },
       {
-        type: 'image',
-        icon: 'https://gw.alipayobjects.com/mdn/rms_616c05/afts/img/A*lyJlRJMLJEEAAAAAAAAAAAAAARQnAQ',
+        icon: 'https://gw.alipayobjects.com/mdn/industry_lifee/afts/img/A*rF7uRZrUpiEAAAAAAAAAAAAAARQnAQ',
         activeIcon:
-          'https://gw.alipayobjects.com/mdn/rms_616c05/afts/img/A*lyJlRJMLJEEAAAAAAAAAAAAAARQnAQ',
-        text: '新车报价',
+          'https://gw.alipayobjects.com/mdn/industry_lifee/afts/img/A*a29CQa2-9VIAAAAAAAAAAAAAARQnAQ',
+        text: '导航',
       },
       {
-        type: 'image',
-        icon: 'https://gw.alipayobjects.com/mdn/rms_616c05/afts/img/A*lyJlRJMLJEEAAAAAAAAAAAAAARQnAQ',
+        icon: 'https://gw.alipayobjects.com/mdn/industry_lifee/afts/img/A*lZCJTa_1JSYAAAAAAAAAAAAAARQnAQ',
         activeIcon:
-          'https://gw.alipayobjects.com/mdn/rms_616c05/afts/img/A*lyJlRJMLJEEAAAAAAAAAAAAAARQnAQ',
-        text: '新车报价',
-        imageMode: 'scaleToFill',
+          'https://gw.alipayobjects.com/mdn/industry_lifee/afts/img/A*W7e3R58X0XkAAAAAAAAAAAAAARQnAQ',
+        text: '我的',
       },
     ],
 

diff --git a/demo/pages/Tabs/index.acss b/demo/pages/Tabs/index.acss
@@ -1,13 +1,3 @@
-.demo-block-title {  
-  height: 48rpx;
-  padding: 48rpx 0 24rpx 8px;
-  line-height: 1.4;
-  font-size: 15px;
-  color: #999;
-  background-color: #FAFBFC;
-}
-
-
 .content {
   padding: 24rpx;
 }

diff --git a/demo/pages/VTabs/index.acss b/demo/pages/VTabs/index.acss
@@ -1,11 +1,11 @@
 .vtabItem {
   transition: all 200ms linear;
-  background-color: #fff;
+
 }
 
 .currentItem {
   color: #f00;
-  background-color: #fff;
+
 }
 
 .vtabItem text {

diff --git a/src/Checklist/ChecklistItem/index.less b/src/Checklist/ChecklistItem/index.less
@@ -1,19 +1,20 @@
-@import (reference) "../variable.less";
-@import (reference) "../../style/mixins/hairline.less";
+@import (reference) '../variable.less';
+@import (reference) '../../style/mixins/hairline.less';
 
 @checklistItemPrefix: amd-checklist-item;
 
 .@{checklistItemPrefix} {
-  background-color: @color-fill-grey-inverse;
+  background-color: @COLOR_CARD;
 
   &-hover {
-    background-color: #eee;
+    background-color: @COLOR_BORDER;
   }
 
   &-content {
     display: flex;
     align-items: center;
     padding: @v-spacing-large @h-spacing-large;
+    color: @COLOR_TEXT_PRIMARY;
     &-disabled {
       opacity: @opacity-disabled;
     }
@@ -43,22 +44,22 @@
     }
 
     &-title {
-      color: @color-text-title;
+      color: @COLOR_TEXT_PRIMARY;
       font-size: @font-size-list;
       line-height: 48 * @rpx;
     }
 
     &-description {
       font-size: @font-size-content;
-      color: @color-text-subtitle;
+      color: @COLOR_TEXT_ASSIST;
       margin-top: 2 * @rpx;
       line-height: 36 * @rpx;
     }
   }
 
   &-checked {
     &-disabled {
-     opacity: @opacity-disabled;
+      opacity: @opacity-disabled;
     }
   }
 
@@ -71,6 +72,6 @@
   &-line {
     margin-left: @h-spacing-large;
     position: relative;
-    .hairline("bottom",  @color-divider-line);
+    .hairline('bottom',  @COLOR_BORDER);
   }
 }
diff --git a/src/Checklist/index.axml b/src/Checklist/index.axml
@@ -22,7 +22,7 @@
       </view>
       <view slot="icon">
         <slot name="icon">
-          <icon type="CheckOutline" fontSize="18px" color="#1677ff" class="amd-checklist-item-check-icon" />
+          <icon type="CheckOutline" class="amd-checklist-item-check-icon" />
         </slot>
       </view>
     </checklist-item>

diff --git a/src/Checklist/index.less b/src/Checklist/index.less
@@ -8,7 +8,8 @@
     overflow: hidden;
   }
 
-  &-item-checked-icon {
+  &-item-check-icon {
     font-size: @font-size-title;
+    color: @COLOR_BRAND1;
   }
 }
diff --git a/src/Checklist/variable.less b/src/Checklist/variable.less
@@ -1 +1 @@
-@import (reference) "../_base/index.less";
+@import (reference) '../style/themes/index.less';
diff --git a/src/ImageUpload/index.axml b/src/ImageUpload/index.axml
@@ -16,7 +16,7 @@
         <view class="amd-image-upload-cover-loading-text">上传中...</view>
       </view>
       <view a:if="{{item.status === 'error'}}" class="amd-image-upload-cover-error">
-        <am-icon class="amd-image-upload-cover-error-icon" type="CloseCircleOutline" color="#fff" size="small" />
+        <am-icon class="amd-image-upload-cover-error-icon" type="CloseCircleOutline"/>
         <view class="amd-image-upload-cover-error-text">上传失败</view>
       </view>
     </view>
@@ -37,7 +37,7 @@
     onTap="onChooseImage"
   >
     <slot name='uploadIcon'>
-      <am-icon size="small" type="AddOutline" color="#999" />
+      <am-icon type="AddOutline" className="amd-image-upload-add-image-icon" />
     </slot>
   </view>
 </view> 
diff --git a/src/ImageUpload/index.less b/src/ImageUpload/index.less
@@ -5,6 +5,7 @@
 .@{imageUploadPrefix} {
   display: flex;
   flex-wrap: wrap;
+  background: @COLOR_CARD;
 
   &-show {
     position: relative;
@@ -31,10 +32,12 @@
     align-items: center;
     justify-content: center;
     margin: @image-upload-add-image-container-margin;
-    background-color: @color-divider-background;
+    background-color: @COLOR_BACKGROUND;
     border-radius: @corner-radius-md;
   }
-
+  &-add-image-icon {
+    color: @COLOR_TEXT_ASSIST;
+  }
   &-cover {
     position: absolute;
     margin: @image-upload-common-margin;
@@ -56,7 +59,7 @@
       }
 
       &-text {
-        color: #fff;
+        color: @COLOR_WHITE;
         font-size: 24rpx;
         margin-top: 8rpx;
       }
@@ -67,10 +70,11 @@
 
       &-icon {
         font-size: 48rpx;
+        color: @COLOR_WHITE;
       }
 
       &-text {
-        color: #fff;
+        color: @COLOR_WHITE;
         font-size: 24rpx;
         margin-top: 8rpx;
       }

diff --git a/src/ImageUpload/variable.less b/src/ImageUpload/variable.less
@@ -1,4 +1,4 @@
-@import (reference) "../_base/index.less";
+@import (reference) '../style/themes/index.less';
 
 @image-upload-size-base: 4 * @rpx;
 

diff --git a/src/InputItem/index.axml b/src/InputItem/index.axml
@@ -1,4 +1,4 @@
-<view class="amd-input-item {{disabled ? 'amd-input-item-content-disabled' : ''}} {{className ? className : ''}}">
+<view class="amd-input-item {{disabled ? 'amd-input-item-disabled' : ''}} {{className ? className : ''}}">
   <view class="amd-input-item-line">
     <view class="amd-input-item-layer">
       <input 

diff --git a/src/InputItem/index.less b/src/InputItem/index.less
@@ -4,7 +4,7 @@
 .@{inputItemPrefix} {
   display: flex;
   align-items: center;
-  background: @color-fill-grey-inverse;
+  background: @COLOR_CARD;
   &-disabled {
     opacity: 0.4;
   }
@@ -50,12 +50,12 @@
     padding: 0;
     font-size: 34 * @rpx;
     text-align: left;
-    color: #333;
-
+    color: @input-item-color;
+    background: @COLOR_CARD;
     .a-input-placeholder {
       font-family: PingFangSC-Regular;
       font-size: 34 * @rpx;
-      color: #ccc;
+      color: @input-item-placeholder-color;
     }
   }
 
@@ -69,7 +69,7 @@
     align-items: center;
     border-radius: 16 * @rpx;
     &-icon {
-      color: #ccc;
+      color: @COLOR_TEXT_WEAK;
       font-size: 34 * @rpx;
     }
   }
@@ -82,6 +82,6 @@
     pointer-events: none;
   }
   &-placeholder-base {
-    color: #ccc;
+    color: @input-item-placeholder-color;
   }
 }
diff --git a/src/InputItem/variable.less b/src/InputItem/variable.less
@@ -1,12 +1,10 @@
-@import (reference) "../_base/index.less";
+@import (reference) '../style/themes/index.less';
 
 // input 字体颜色
-@input-item-color: @color-text-title;
+@input-item-color: @COLOR_TEXT_PRIMARY;
 // input 字体大小
 @input-item-size: @font-size-content;
-// input disabled color
-@input-item-color-disabled: #bbb;
 // input placeholder 颜色
-@input-item-placeholder-color: @color-text-weak;
+@input-item-placeholder-color: @COLOR_TEXT_WEAK;
 // input 清除 颜色
-@input-item-clear-color: @color-text-subtitle;
+@input-item-clear-color: @COLOR_TEXT_ASSIST;
diff --git a/src/TabBar/index.less b/src/TabBar/index.less
@@ -8,7 +8,7 @@
   &-wrap {
     display: flex;
     align-items: center;
-    background-color: #fff;
+    background-color: @COLOR_CARD;
   }
   &-item {
     flex: 1;
@@ -17,9 +17,9 @@
     align-items: center;
     justify-content: center;
     padding: 8 * @rpx 0;
-    color: #666;
+    color: @COLOR_TEXT_SECONDARY;
     &-active {
-      color: #1677ff;
+      color: @COLOR_BRAND1;
     }
   }
 

diff --git a/src/TabBar/variable.less b/src/TabBar/variable.less
@@ -1,4 +1,4 @@
-@import (reference) "../_base/index.less";
+@import (reference) '../style/themes/index.less';
 
 // 基础类型的颜色 文本和下划线同一个颜色、未选中的文本颜色，无背景色
 // 胶囊类型的颜色，文本和背景色，选中状态的文本和背景色
@@ -15,8 +15,4 @@
 // 混合：主标题文本黑色，文本灰色无背景
 
 // 黑色、灰色、白色、蓝色
-@tabs-basis-color: @color-text-title;
-@tabs-weaken-color: @color-text-subtitle;
-@tabs-inverse-color: @color-text-base;
-@tabs-active-color: @color-brand-1;
-@tabs-active-decorate-color: @color-brand-1;
+
diff --git a/src/Tabs/TabItem/index.less b/src/Tabs/TabItem/index.less
@@ -7,6 +7,7 @@
   height: auto;
   flex-shrink: 0;
   align-self: flex-start;
+  color: @tabs-basis-color;
   &-pane {
     width: 100%;
     will-change: auto;