ant-design/migrate-less-variables.zh-CN.md at 03a7374aa142a5158d572f5916026ad45648836f

mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-15 01:11:26 +08:00

* feat: component token naming rules

* dcos: update

* feat: modal token rename

* feat: rename result token

* feat: statsitic token rename

* feat: steps token remane

* chore: update snapshot

* chore: fix lint

* feat: semantic part component

* revert: button & notification

* revert: files

* chore: code clean

2023-05-09 19:24:50 +08:00

6.1 KiB

Raw Blame History

order	title
9	Less 变量迁移 Design Token

本文档包含了所有 4.x 版本中组件相关的 less 变量与 5.x 版本的 Component Token 的对照关系。如果你是从 4.x 版本升级到 5.x 版本，可以通过这份对照表快速找到对应的 Component Token。

组件变量

Drawer 抽屉

Less 变量	Component Token	备注
`@drawer-bg`	`colorBgElevated`	全局 Token
`@drawer-header-padding`	`padding`、`paddingLG`	全局 Token，对应值为 `${padding}px ${paddingLG}px`
`@drawer-title-font-size`	`fontSizeLG`	全局 Token
`@drawer-title-line-height`	`lineHeightLG`	全局 Token
`@drawer-body-padding`	`paddingLG`	全局 Token
`@drawer-footer-padding-vertical`	`footerPaddingBlock`	`footerPaddingBlock` 为数字，不带单位，`@drawer-footer-padding-vertical` 带单位
`@drawer-footer-padding-horizontal`	`footerPaddingInline`	`footerPaddingInline` 为数字，不带单位，`@drawer-footer-padding-horizontal` 带单位

Message 全局提示

Less 变量	Component Token	备注
`@zindex-message`	`zIndexPopup`	-
`@message-notice-content-padding`	`contentPadding`	-
`@message-notice-content-bg`	`contentBg`	-

Less 变量	Component Token	备注
`@modal-header-padding-vertical`	-	由于样式变化已废弃
`@modal-header-padding-horizontal`	-	由于样式变化已废弃
`@modal-body-padding`	-	由于样式变化已废弃
`@modal-header-bg`	`headerBg`	-
`@modal-header-padding`	-	由于样式变化已废弃
`@modal-header-border-width`	-	由于样式变化已废弃
`@modal-header-border-style`	-	由于样式变化已废弃
`@modal-header-title-line-height`	`titleLineHeight`	-
`@modal-header-title-font-size`	`titleFontSize`	-
`@modal-header-border-color-split`	-	由于样式变化已废弃
`@modal-header-close-size`	-	由于样式变化已废弃
`@modal-content-bg`	`contentBg`	-
`@modal-heading-color`	`titleColor`	-
`@modal-close-color`	`colorIcon`	全局 Token
`@modal-footer-bg`	`footerBg`	-
`@modal-footer-border-color-split`	-	由于样式变化已废弃
`@modal-footer-border-style`	-	由于样式变化已废弃
`@modal-footer-padding-vertical`	-	由于样式变化已废弃
`@modal-footer-padding-horizontal`	-	由于样式变化已废弃
`@modal-footer-border-width`	-	由于样式变化已废弃
`@modal-mask-bg`	`colorBgMask`	全局 Token
`@modal-confirm-body-padding`	-	由于样式变化已废弃
`@modal-confirm-title-font-size`	`titleFontSize`	-
`@modal-border-radius`	`borderRadiusLG`	全局 Token

Result 结果

Less 变量	Component Token	备注
`@result-icon-font-size`	`iconFontSize`	-
`@result-title-font-size`	`titleFontSize`	-
`@result-subtitle-font-size`	`subtitleFontSize`	-
`@result-extra-margin`	`extraMargin`	-

Statistic 统计数值

Less 变量	Component Token	备注
`@statistic-title-font-size`	`titleFontSize`	-
`@statistic-content-font-size`	`contentFontSize`	-
`@statistic-font-family`	`fontFamily`	全局 Token

Step 步骤条

Less 变量	Component Token	备注
`@process-tail-color`	`colorSplit`	全局 Token
`@steps-nav-arrow-color`	`navArrowColor`	-
`@steps-background`	`colorBgContainer`	-
`@steps-icon-size`	`iconSize`	-
`@steps-icon-custom-size`	`customIconSize`	-
`@steps-icon-custom-top`	`customIconTop`	-
`@steps-icon-custom-font-size`	`customIconFontSize`	-
`@steps-icon-top`	`iconTop`	-
`@steps-icon-font-size`	`iconFontSize`	-
`@steps-icon-margin`	-	已废弃
`@steps-title-line-height`	`titleLineHeight`	-
`@steps-small-icon-size`	`iconSizeSM`	-
`@steps-small-icon-margin`	-	已废弃
`@steps-dot-size`	`dotSize`	-
`@steps-dot-top`	-	已废弃
`@steps-current-dot-size`	`dotCurrentSize`	-
`@steps-description-max-width`	`descriptionMaxWidth`	-
`@steps-nav-content-max-width`	`stepsNavContentMaxWidth`	-
`@steps-vertical-icon-width`	`iconSize`	-
`@steps-vertical-tail-width`	-	已废弃
`@steps-vertical-tail-width-sm`	-	已废弃

6.1 KiB Raw Blame History Unescape Escape