diff --git a/site/theme/dark.ts b/site/theme/dark.ts index 8ce200c98..8b152e068 100644 --- 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 index db8beae23..e9813b207 100644 --- 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 index ff8982005..835bec6ac 100644 --- 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 index 6de7540cb..156281e8e 100644 --- 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 index 7d072e836..ccf8d080b 100644 --- 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 index 3c2914d7d..b340a1be7 100644 --- 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 index 6e3656614..13363dbac 100644 --- 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 index a4833ea59..1451c4f30 100644 --- 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 index 385845dc5..36d3b72e0 100644 --- 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 index 6e35c102b..20790df53 100644 --- 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 index a9b57e8fa..8310d7e6b 100644 --- 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 index a31e6b18b..1d48e32ad 100644 --- 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 index 209ddd93c..619241332 100644 --- 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 index b34493845..069a4aff9 100644 --- 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 index f3e97c8ce..e7e1f9e06 100644 --- 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 index b3cdfe5ec..c1ba43bb3 100644 --- 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 index a5497d4cb..89775023b 100644 --- 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; }