diff --git a/packages/components/button/README.en-US.md b/packages/components/button/README.en-US.md index dda91741b..6661a174a 100644 --- a/packages/components/button/README.en-US.md +++ b/packages/components/button/README.en-US.md @@ -178,11 +178,10 @@ Name | Default Value | Description --td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - ---td-button-extra-small-font-size | @font-size-base | - +--td-button-extra-small-font | @font-mark-medium | - --td-button-extra-small-height | 56rpx | - --td-button-extra-small-icon-size | 36rpx | - --td-button-extra-small-padding-horizontal | 16rpx | - ---td-button-font-weight | 600 | - --td-button-ghost-border-color | @button-ghost-color | - --td-button-ghost-color | @text-color-anti | - --td-button-ghost-danger-border-color | @error-color | - @@ -195,7 +194,7 @@ Name | Default Value | Description --td-button-ghost-primary-hover-color | @brand-color-active | - --td-button-icon-border-radius | 8rpx | - --td-button-icon-spacer | @spacer | - ---td-button-large-font-size | @font-size-m | - +--td-button-large-font | @font-mark-large | - --td-button-large-height | 96rpx | - --td-button-large-icon-size | 48rpx | - --td-button-large-padding-horizontal | 40rpx | - @@ -215,7 +214,7 @@ Name | Default Value | Description --td-button-light-outline-disabled-color | @brand-color-disabled | - --td-button-light-text-active-bg-color | @bg-color-container-active | - --td-button-light-text-color | @brand-color | - ---td-button-medium-font-size | @font-size-m | - +--td-button-medium-font | @font-mark-large | - --td-button-medium-height | 80rpx | - --td-button-medium-icon-size | 40rpx | - --td-button-medium-padding-horizontal | 32rpx | - @@ -238,7 +237,7 @@ Name | Default Value | Description --td-button-primary-text-active-bg-color | @bg-color-container-active | - --td-button-primary-text-color | @brand-color | - --td-button-primary-text-disabled-color | @brand-color-disabled | - ---td-button-small-font-size | @font-size-base | - +--td-button-small-font | @font-mark-medium | - --td-button-small-height | 64rpx | - --td-button-small-icon-size | 36rpx | - --td-button-small-padding-horizontal | 24rpx | - diff --git a/packages/components/button/README.md b/packages/components/button/README.md index 2dd324a17..81969c29c 100644 --- a/packages/components/button/README.md +++ b/packages/components/button/README.md @@ -180,11 +180,10 @@ t-class-loading | 加载样式类 --td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - ---td-button-extra-small-font-size | @font-size-base | - +--td-button-extra-small-font | @font-mark-medium | - --td-button-extra-small-height | 56rpx | - --td-button-extra-small-icon-size | 36rpx | - --td-button-extra-small-padding-horizontal | 16rpx | - ---td-button-font-weight | 600 | - --td-button-ghost-border-color | @button-ghost-color | - --td-button-ghost-color | @text-color-anti | - --td-button-ghost-danger-border-color | @error-color | - @@ -197,7 +196,7 @@ t-class-loading | 加载样式类 --td-button-ghost-primary-hover-color | @brand-color-active | - --td-button-icon-border-radius | 8rpx | - --td-button-icon-spacer | @spacer | - ---td-button-large-font-size | @font-size-m | - +--td-button-large-font | @font-mark-large | - --td-button-large-height | 96rpx | - --td-button-large-icon-size | 48rpx | - --td-button-large-padding-horizontal | 40rpx | - @@ -217,7 +216,7 @@ t-class-loading | 加载样式类 --td-button-light-outline-disabled-color | @brand-color-disabled | - --td-button-light-text-active-bg-color | @bg-color-container-active | - --td-button-light-text-color | @brand-color | - ---td-button-medium-font-size | @font-size-m | - +--td-button-medium-font | @font-mark-large | - --td-button-medium-height | 80rpx | - --td-button-medium-icon-size | 40rpx | - --td-button-medium-padding-horizontal | 32rpx | - @@ -240,7 +239,7 @@ t-class-loading | 加载样式类 --td-button-primary-text-active-bg-color | @bg-color-container-active | - --td-button-primary-text-color | @brand-color | - --td-button-primary-text-disabled-color | @brand-color-disabled | - ---td-button-small-font-size | @font-size-base | - +--td-button-small-font | @font-mark-medium | - --td-button-small-height | 64rpx | - --td-button-small-icon-size | 36rpx | - --td-button-small-padding-horizontal | 24rpx | - diff --git a/packages/components/button/button.less b/packages/components/button/button.less index c3733b940..c92fe822e 100644 --- a/packages/components/button/button.less +++ b/packages/components/button/button.less @@ -2,12 +2,11 @@ @button-border-width: var(--td-button-border-width, 4rpx); @button-border-radius: var(--td-button-border-radius, @radius-default); -@button-font-weight: var(--td-button-font-weight, 600); -@button-extra-small-font-size: var(--td-button-extra-small-font-size, @font-size-base); -@button-small-font-size: var(--td-button-small-font-size, @font-size-base); -@button-medium-font-size: var(--td-button-medium-font-size, @font-size-m); -@button-large-font-size: var(--td-button-large-font-size, @font-size-m); +@button-extra-small-font: var(--td-button-extra-small-font, @font-mark-medium); +@button-small-font: var(--td-button-small-font, @font-mark-medium); +@button-medium-font: var(--td-button-medium-font, @font-mark-large); +@button-large-font: var(--td-button-large-font, @font-mark-large); @button-extra-small-height: var(--td-button-extra-small-height, 56rpx); @button-small-height: var(--td-button-small-height, 64rpx); @@ -128,17 +127,16 @@ @button: ~'@{prefix}-button'; .button-size(@size) { - @fontSize: 'button-@{size}-font-size'; + @font: 'button-@{size}-font'; @padding: 'button-@{size}-padding-horizontal'; @height: 'button-@{size}-height'; @iconSize: 'button-@{size}-icon-size'; .@{button}--size-@{size} { - font-size: @@fontSize; + font: @@font; padding-left: @@padding; padding-right: @@padding; height: @@height; - line-height: @@height; & .@{button}__icon { font-size: @@iconSize; @@ -251,11 +249,6 @@ touch-action: manipulation; border-radius: @button-border-radius; outline: none; - font-family: - PingFang SC, - Microsoft YaHei, - Arial Regular; - font-weight: @button-font-weight; vertical-align: top; box-sizing: border-box; diff --git a/packages/tdesign-miniprogram/.changelog/pr-4501.md b/packages/tdesign-miniprogram/.changelog/pr-4501.md new file mode 100644 index 000000000..60fcbfd14 --- /dev/null +++ b/packages/tdesign-miniprogram/.changelog/pr-4501.md @@ -0,0 +1,6 @@ +--- +pr_number: 4501 +contributor: liweijie0812 +--- + +- fix(Button): ⚠️ `--td-button-xx-font-size` 系列变更为 `--td-button-xx-font`；⚠️ 移除 `--td-button-font-weight`，请改用 `--td-button-xx-font`，或者[组件库级别的 css var ](https://github.com/Tencent/tdesign-miniprogram/blob/develop/packages/components/common/style/theme/_font.less)调整字号、行高、字重、字体等文本样式 @liweijie0812 ([#4501](https://github.com/Tencent/tdesign-miniprogram/pull/4501)) diff --git a/packages/tdesign-uniapp/.changelog/pr-4501.md b/packages/tdesign-uniapp/.changelog/pr-4501.md new file mode 100644 index 000000000..60fcbfd14 --- /dev/null +++ b/packages/tdesign-uniapp/.changelog/pr-4501.md @@ -0,0 +1,6 @@ +--- +pr_number: 4501 +contributor: liweijie0812 +--- + +- fix(Button): ⚠️ `--td-button-xx-font-size` 系列变更为 `--td-button-xx-font`；⚠️ 移除 `--td-button-font-weight`，请改用 `--td-button-xx-font`，或者[组件库级别的 css var ](https://github.com/Tencent/tdesign-miniprogram/blob/develop/packages/components/common/style/theme/_font.less)调整字号、行高、字重、字体等文本样式 @liweijie0812 ([#4501](https://github.com/Tencent/tdesign-miniprogram/pull/4501)) diff --git a/packages/uniapp-components/button/README.en-US.md b/packages/uniapp-components/button/README.en-US.md index 2107360b4..5d1459db5 100644 --- a/packages/uniapp-components/button/README.en-US.md +++ b/packages/uniapp-components/button/README.en-US.md @@ -175,11 +175,10 @@ Name | Default Value | Description --td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - ---td-button-extra-small-font-size | @font-size-base | - +--td-button-extra-small-font | @font-mark-medium | - --td-button-extra-small-height | 56rpx | - --td-button-extra-small-icon-size | 36rpx | - --td-button-extra-small-padding-horizontal | 16rpx | - ---td-button-font-weight | 600 | - --td-button-ghost-border-color | @button-ghost-color | - --td-button-ghost-color | @text-color-anti | - --td-button-ghost-danger-border-color | @error-color | - @@ -192,7 +191,7 @@ Name | Default Value | Description --td-button-ghost-primary-hover-color | @brand-color-active | - --td-button-icon-border-radius | 8rpx | - --td-button-icon-spacer | @spacer | - ---td-button-large-font-size | @font-size-m | - +--td-button-large-font | @font-mark-large | - --td-button-large-height | 96rpx | - --td-button-large-icon-size | 48rpx | - --td-button-large-padding-horizontal | 40rpx | - @@ -212,7 +211,7 @@ Name | Default Value | Description --td-button-light-outline-disabled-color | @brand-color-disabled | - --td-button-light-text-active-bg-color | @bg-color-container-active | - --td-button-light-text-color | @brand-color | - ---td-button-medium-font-size | @font-size-m | - +--td-button-medium-font | @font-mark-large | - --td-button-medium-height | 80rpx | - --td-button-medium-icon-size | 40rpx | - --td-button-medium-padding-horizontal | 32rpx | - @@ -235,7 +234,7 @@ Name | Default Value | Description --td-button-primary-text-active-bg-color | @bg-color-container-active | - --td-button-primary-text-color | @brand-color | - --td-button-primary-text-disabled-color | @brand-color-disabled | - ---td-button-small-font-size | @font-size-base | - +--td-button-small-font | @font-mark-medium | - --td-button-small-height | 64rpx | - --td-button-small-icon-size | 36rpx | - --td-button-small-padding-horizontal | 24rpx | - diff --git a/packages/uniapp-components/button/README.md b/packages/uniapp-components/button/README.md index 3b536cd7f..bd70f046b 100644 --- a/packages/uniapp-components/button/README.md +++ b/packages/uniapp-components/button/README.md @@ -168,11 +168,10 @@ t-class-loading | 加载样式类 --td-button-default-outline-color | @text-color-primary | - --td-button-default-outline-disabled-color | @component-border | - --td-button-default-text-active-bg-color | @bg-color-container-active | - ---td-button-extra-small-font-size | @font-size-base | - +--td-button-extra-small-font | @font-mark-medium | - --td-button-extra-small-height | 56rpx | - --td-button-extra-small-icon-size | 36rpx | - --td-button-extra-small-padding-horizontal | 16rpx | - ---td-button-font-weight | 600 | - --td-button-ghost-border-color | @button-ghost-color | - --td-button-ghost-color | @text-color-anti | - --td-button-ghost-danger-border-color | @error-color | - @@ -185,7 +184,7 @@ t-class-loading | 加载样式类 --td-button-ghost-primary-hover-color | @brand-color-active | - --td-button-icon-border-radius | 8rpx | - --td-button-icon-spacer | @spacer | - ---td-button-large-font-size | @font-size-m | - +--td-button-large-font | @font-mark-large | - --td-button-large-height | 96rpx | - --td-button-large-icon-size | 48rpx | - --td-button-large-padding-horizontal | 40rpx | - @@ -205,7 +204,7 @@ t-class-loading | 加载样式类 --td-button-light-outline-disabled-color | @brand-color-disabled | - --td-button-light-text-active-bg-color | @bg-color-container-active | - --td-button-light-text-color | @brand-color | - ---td-button-medium-font-size | @font-size-m | - +--td-button-medium-font | @font-mark-large | - --td-button-medium-height | 80rpx | - --td-button-medium-icon-size | 40rpx | - --td-button-medium-padding-horizontal | 32rpx | - @@ -228,7 +227,7 @@ t-class-loading | 加载样式类 --td-button-primary-text-active-bg-color | @bg-color-container-active | - --td-button-primary-text-color | @brand-color | - --td-button-primary-text-disabled-color | @brand-color-disabled | - ---td-button-small-font-size | @font-size-base | - +--td-button-small-font | @font-mark-medium | - --td-button-small-height | 64rpx | - --td-button-small-icon-size | 36rpx | - --td-button-small-padding-horizontal | 24rpx | - diff --git a/packages/uniapp-components/button/button.less b/packages/uniapp-components/button/button.less index 8bba090d4..c92fe822e 100644 --- a/packages/uniapp-components/button/button.less +++ b/packages/uniapp-components/button/button.less @@ -2,12 +2,11 @@ @button-border-width: var(--td-button-border-width, 4rpx); @button-border-radius: var(--td-button-border-radius, @radius-default); -@button-font-weight: var(--td-button-font-weight, 600); -@button-extra-small-font-size: var(--td-button-extra-small-font-size, @font-size-base); -@button-small-font-size: var(--td-button-small-font-size, @font-size-base); -@button-medium-font-size: var(--td-button-medium-font-size, @font-size-m); -@button-large-font-size: var(--td-button-large-font-size, @font-size-m); +@button-extra-small-font: var(--td-button-extra-small-font, @font-mark-medium); +@button-small-font: var(--td-button-small-font, @font-mark-medium); +@button-medium-font: var(--td-button-medium-font, @font-mark-large); +@button-large-font: var(--td-button-large-font, @font-mark-large); @button-extra-small-height: var(--td-button-extra-small-height, 56rpx); @button-small-height: var(--td-button-small-height, 64rpx); @@ -128,17 +127,16 @@ @button: ~'@{prefix}-button'; .button-size(@size) { - @fontSize: 'button-@{size}-font-size'; + @font: 'button-@{size}-font'; @padding: 'button-@{size}-padding-horizontal'; @height: 'button-@{size}-height'; @iconSize: 'button-@{size}-icon-size'; .@{button}--size-@{size} { - font-size: @@fontSize; + font: @@font; padding-left: @@padding; padding-right: @@padding; height: @@height; - line-height: @@height; & .@{button}__icon { font-size: @@iconSize; @@ -251,8 +249,6 @@ touch-action: manipulation; border-radius: @button-border-radius; outline: none; - font-family: PingFang SC, Microsoft YaHei, Arial Regular; - font-weight: @button-font-weight; vertical-align: top; box-sizing: border-box;