chore: use @text-color-anti var (#3203)

anlyyao · web-flow · commit 2c7e8e488000 · 2024-10-15T22:19:14.000+08:00
diff --git a/site/theme/dark.ts b/site/theme/dark.ts
@@ -113,7 +113,7 @@ const darkModeCss = `
     --td-text-color-secondary: var(--td-font-white-2);
     --td-text-color-placeholder: var(--td-font-white-3);
     --td-text-color-disabled: var(--td-font-white-4);
-    --td-text-color-anti: var(--td-font-gray-1);
+    --td-text-color-anti: var(--td-font-white-1);
     --td-text-color-brand: var(--td-brand-color-8);
     --td-text-color-link: var(--td-brand-color-8);
 
diff --git a/src/back-top/back-top.less b/src/back-top/back-top.less
@@ -15,7 +15,7 @@
 @back-top-round-bg-color: var(--td-back-top-round-bg-color, @bg-color-container);
 @back-top-round-border-color: var(--td-back-top-round-border-color, @component-border);
 @back-top-round-border-radius: var(--td-back-top-round-border-radius, @radius-circle); // 'round'主题圆角大小
-@back-top-round-dark-color: var(--td-back-top-round-dark-color, @font-white-1); // 'round-dark'主题内容颜色
+@back-top-round-dark-color: var(--td-back-top-round-dark-color, @text-color-anti); // 'round-dark'主题内容颜色
 @back-top-round-dark-bg-color: var(--td-back-top-round-dark-bg-color, @gray-color-13); // 'round-dark'主题背景颜色
 @back-top-half-round-border-radius: var(
   --td-back-top-half-round-border-radius,
diff --git a/src/badge/badge.less b/src/badge/badge.less
@@ -1,6 +1,6 @@
 @import '../common/style/index.less';
 
-@badge-text-color: var(--td-badge-text-color, @font-white-1);
+@badge-text-color: var(--td-badge-text-color, @text-color-anti);
 @badge-content-text-color: var(--td-badge-content-text-color, @text-color-primary);
 @badge-color: var(--td-badge-bg-color, @error-color);
 @badge-font-size: var(--td-badge-font-size, @font-size-xs);
diff --git a/src/button/button.less b/src/button/button.less
@@ -38,10 +38,10 @@
 @button-default-disabled-bg: var(--td-button-default-disabled-bg, @bg-color-component-disabled);
 @button-default-disabled-border-color: var(--td-button-default-disabled-border-color, @bg-color-component-disabled);
 // primary
-@button-primary-color: var(--td-button-primary-color, @font-white-1);
+@button-primary-color: var(--td-button-primary-color, @text-color-anti);
 @button-primary-border-color: var(--td-button-primary-border-color, @brand-color);
 @button-primary-bg-color: var(--td-button-primary-bg-color, @brand-color);
-@button-primary-disabled-color: var(--td-button-primary-disabled-color, @font-white-1);
+@button-primary-disabled-color: var(--td-button-primary-disabled-color, @text-color-anti);
 @button-primary-disabled-bg: var(--td-button-primary-disabled-bg, @brand-color-disabled);
 @button-primary-disabled-border-color: var(--td-button-primary-disabled-border-color, @brand-color-disabled);
 // light
@@ -52,7 +52,7 @@
 @button-light-disabled-bg: var(--td-button-light-disabled-bg, @brand-color-light);
 @button-light-disabled-border-color: var(--td-button-light-disabled-border-color, @brand-color-light);
 // danger
-@button-danger-color: var(--td-button-danger-color, @font-white-1);
+@button-danger-color: var(--td-button-danger-color, @text-color-anti);
 @button-danger-border-color: var(--td-button-danger-border-color, @error-color);
 @button-danger-bg-color: var(--td-button-danger-bg-color, @error-color);
 @button-danger-disabled-color: var(--td-button-danger-disabled-color, @error-color-disabled);
@@ -92,7 +92,7 @@
 // light + text
 @button-light-text-color: var(--td-button-light-text-color, @brand-color);
 // ghost 优先级高于 theme，固定透明背景，白色边框，白色字体
-@button-ghost-color: var(--td-button-ghost-color, #fff);
+@button-ghost-color: var(--td-button-ghost-color, @text-color-anti);
 @button-ghost-border-color: var(--td-button-ghost-border-color, @button-ghost-color);
 @button-ghost-disabled-color: var(--td-button-ghost-disabled-color, @font-white-4);
 @button-ghost-hover-color: var(--td-button-ghost-hover-color, @font-white-2);
diff --git a/src/calendar/calendar.less b/src/calendar/calendar.less
@@ -3,7 +3,7 @@
 @calendar-radius: var(--td-calendar-radius, 24rpx);
 @calendar-bg-color: var(--td-calendar-bg-color, @bg-color-container);
 @calendar-active-color: var(--td-calendar-active-color, @brand-color);
-@calendar-selected-color: var(--td-calendar-selected-color, @font-white-1);
+@calendar-selected-color: var(--td-calendar-selected-color, @text-color-anti);
 @calendar-title-font-size: var(--td-calendar-title-font-size, 18px);
 @calendar-title-color: var(--td-calendar-title-color, @text-color-primary);
 @calendar-days-color: var(--td-calendar-days-color, @text-color-secondary);
diff --git a/src/check-tag/check-tag.less b/src/check-tag/check-tag.less
@@ -53,7 +53,7 @@
     @theme-light-color: 'tag-@{value}-light-color';
 
     &.@{prefix}-tag--@{value} {
-      color: if(@variant = dark, @font-white-1, @@theme-color);
+      color: if(@variant = dark, @text-color-anti, @@theme-color);
       border-color: if(@variant = light, @@theme-light-color, @@theme-color);
       background-color: if(@variant = dark, @@theme-color, @@theme-light-color);
     }
diff --git a/src/common/style/theme/_dark.less b/src/common/style/theme/_dark.less
@@ -126,7 +126,7 @@
     --td-text-color-secondary: var(--td-font-white-2); // 色彩-文字-次要
     --td-text-color-placeholder: var(--td-font-white-3); // 色彩-文字-占位符/说明
     --td-text-color-disabled: var(--td-font-white-4); // 色彩-文字-禁用
-    --td-text-color-anti: var(--td-font-gray-1); // 色彩-文字-反色
+    --td-text-color-anti: var(--td-font-white-1); // 色彩-文字-反色
     --td-text-color-brand: var(--td-primary-color-8); // 色彩-文字-品牌
     --td-text-color-link: var(--td-primary-color-8); // 色彩-文字-链接
 
diff --git a/src/count-down/count-down.less b/src/count-down/count-down.less
@@ -30,7 +30,7 @@
 // 纯数字倒计时文本颜色
 @countdown-default-text-color: var(--td-countdown-default-color, @text-color-primary);
 // 方形/圆形底倒计时文本颜色
-@countdown-text-color: var(--td-countdown-round-color, @font-white-1);
+@countdown-text-color: var(--td-countdown-round-color, @text-color-anti);
 // 方形/圆形底背景颜色
 @countdown-bg-color: var(--td-countdown-bg-color, @error-color-6);
 // 带方形底倒计时圆角大小
diff --git a/src/image-viewer/image-viewer.less b/src/image-viewer/image-viewer.less
@@ -6,7 +6,7 @@
 
 @image-viewer-nav-height: var(--td-image-viewer-nav-height, 96rpx);
 @image-viewer-nav-bg-color: var(--td-image-viewer-nav-bg-color, @font-gray-3);
-@image-viewer-nav-color: var(--td-image-viewer-nav-color, @font-white-1);
+@image-viewer-nav-color: var(--td-image-viewer-nav-color, @text-color-anti);
 @image-viewer-nav-index-font-size: var(--td-image-viewer-nav-index-font-size, @font-size-base);
 @image-viewer-close-margin-left: var(--td-image-viewer-close-margin-left, @spacer-1);
 @image-viewer-delete-margin-right: var(--td-image-viewer-delete-margin-right, @spacer-1);
diff --git a/src/indexes/indexes.less b/src/indexes/indexes.less
@@ -4,7 +4,7 @@
 @indexes-sidebar-item-size: var(--td-indexes-sidebar-item-size, 40rpx);
 @indexes-sidebar-font-size: var(--td-indexes-sidebar-font-size, 24rpx);
 @indexes-sidebar-line-height: var(--td-indexes-sidebar-line-height, 40rpx);
-@indexes-sidebar-active-color: var(--td-indexes-sidebar-active-color, @font-white-1);
+@indexes-sidebar-active-color: var(--td-indexes-sidebar-active-color, @text-color-anti);
 @indexes-sidebar-active-bg-color: var(--td-indexes-sidebar-active-bg-color, @brand-color);
 @indexes-sidebar-right: var(--td-indexes-sidebar-right, 16rpx);
 
diff --git a/src/progress/progress.less b/src/progress/progress.less
@@ -38,9 +38,9 @@
 ); // 进度条深色label字体颜色(在进度条外或未完成进度灰色色块里显示的色值)
 @progress-info-light-color: var(
   --td-progress-info-light-color,
-  @font-white-1
+  @text-color-anti
 ); // 进度条浅色label字体颜色(在进度条色块内显示的色值)
-@progress-circle-inner-bg-color: var(--td-progress-circle-inner-bg-color, @font-white-1); // 环境进度条内圆背景色
+@progress-circle-inner-bg-color: var(--td-progress-circle-inner-bg-color, @text-color-anti); // 环境进度条内圆背景色
 
 @progress: ~'@{prefix}-progress';
 
diff --git a/src/step-item/step-item.less b/src/step-item/step-item.less
@@ -11,7 +11,7 @@
 @step-item-default-icon-color: var(--td-step-item-default-icon-color, @text-color-placeholder);
 @step-item-default-dot-border-color: var(--td-step-item-default-dot-border-color, @component-border);
 
-@step-item-process-circle-color: var(--td-step-item-process-circle-color, @font-white-1);
+@step-item-process-circle-color: var(--td-step-item-process-circle-color, @text-color-anti);
 @step-item-process-circle-bg: var(--td-step-item-process-circle-bg, @brand-color);
 @step-item-process-title-color: var(--td-step-item-process-title-color, @brand-color);
 @step-item-process-icon-color: var(--td-step-item-process-icon-color, @brand-color);
diff --git a/src/swiper-nav/swiper-nav.less b/src/swiper-nav/swiper-nav.less
@@ -2,18 +2,18 @@
 
 // dot & dots-bar
 @swiper-nav-dot-color: var(--td-swiper-nav-dot-color, @font-white-2);
-@swiper-nav-dot-active-color: var(--td-swiper-nav-dot-active-color, @font-white-1);
+@swiper-nav-dot-active-color: var(--td-swiper-nav-dot-active-color, @text-color-anti);
 @swiper-nav-dot-size: var(--td-swiper-nav-dot-size, 12rpx);
 @swiper-nav-dots-bar-active-width: var(--td-swiper-nav-dots-bar-active-width, 40rpx);
 
 // fraction
-@swiper-nav-fraction-color: var(--td-swiper-nav-fraction-color, @font-white-1);
+@swiper-nav-fraction-color: var(--td-swiper-nav-fraction-color, @text-color-anti);
 @swiper-nav-fraction-bg-color: var(--td-swiper-nav-fraction-bg-color, @font-gray-3);
 @swiper-nav-fraction-height: var(--td-swiper-nav-fraction-height, 48rpx);
 @swiper-nav-fraction-font-size: var(--td-swiper-nav-fraction-font-size, 24rpx);
 
 // button
-@swiper-nav-btn-color: var(--td-swiper-nav-btn-color, @font-white-1);
+@swiper-nav-btn-color: var(--td-swiper-nav-btn-color, @text-color-anti);
 @swiper-nav-btn-bg-color: var(--td-swiper-nav-btn-bg-color, @font-gray-3);
 @swiper-nav-btn-size: var(--td-swiper-nav-btn-size, 48rpx);
 
diff --git a/src/switch/switch.less b/src/switch/switch.less
@@ -148,7 +148,7 @@
     width: @switch-dot-size;
     height: @switch-dot-size;
     border-radius: 50%;
-    background-color: @font-white-1;
+    background-color: @text-color-anti;
     transition: all 0.3s;
     transform: translateY(-50%);
     box-shadow: @switch-dot-shadow;
diff --git a/src/tag/tag.less b/src/tag/tag.less
@@ -55,7 +55,7 @@
     @theme-light-color: 'tag-@{value}-light-color';
 
     &.@{prefix}-tag--@{value} {
-      color: if(@variant = dark, @font-white-1, @@theme-color);
+      color: if(@variant = dark, @text-color-anti, @@theme-color);
       border-color: if(@variant = light, @@theme-light-color, @@theme-color);
       background-color: if(@variant = dark, @@theme-color, @@theme-light-color);
     }
diff --git a/src/toast/toast.less b/src/toast/toast.less
@@ -1,6 +1,6 @@
 @import '../common/style/index.less';
 
-@toast-color: var(--td-toast-color, @font-white-1);
+@toast-color: var(--td-toast-color, @text-color-anti);
 @toast-bg-color: var(--td-toast-bg-color, @font-gray-2);
 @toast-max-width: var(--td-toast-max-width, 374rpx);
 @toast-radius: var(--td-toast-radius, 8rpx);
diff --git a/src/upload/upload.less b/src/upload/upload.less
@@ -92,7 +92,7 @@
       flex-direction: column;
       align-items: center;
       border-radius: @upload-radius;
-      color: @font-white-1;
+      color: @text-color-anti;
       padding: 32rpx 0;
     }
 

Original file line number	Diff line number	Diff line change
`@@ -53,7 +53,7 @@`
`53`	`53`	`@theme-light-color: 'tag-@{value}-light-color';`
`54`	`54`
`55`	`55`	`&.@{prefix}-tag--@{value} {`
`56`		`- color: if(@variant = dark, @font-white-1, @@theme-color);`
	`56`	`+ color: if(@variant = dark, @text-color-anti, @@theme-color);`
`57`	`57`	`border-color: if(@variant = light, @@theme-light-color, @@theme-color);`
`58`	`58`	`background-color: if(@variant = dark, @@theme-color, @@theme-light-color);`
`59`	`59`	`}`