mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 02:59:58 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

feat: migrate less to token for Drawer (#42084)

Browse Source
This commit is contained in:
kiner-tang(文辉) 2023-05-04 15:38:07 +08:00 committed by GitHub
parent 70c76b737f
commit 5e4e9970dc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 33 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/drawer/style/index.ts
View File

@ -4,13 +4,12 @@ import genMotionStyle from './motion';
export interface ComponentToken {
zIndexPopup: number;
}
export interface DrawerToken extends FullToken<'Drawer'> {
drawerFooterPaddingVertical: number;
drawerFooterPaddingHorizontal: number;
}
export interface DrawerToken extends FullToken<'Drawer'> {}
// =============================== Base ===============================
const genDrawerStyle: GenerateStyle<DrawerToken> = (token: DrawerToken) => {
const {
@ -217,14 +216,13 @@ const genDrawerStyle: GenerateStyle<DrawerToken> = (token: DrawerToken) => {
export default genComponentStyleHook(
'Drawer',
(token) => {
const drawerToken = mergeToken<DrawerToken>(token, {
drawerFooterPaddingVertical: token.paddingXS,
drawerFooterPaddingHorizontal: token.padding,
});
const drawerToken = mergeToken<DrawerToken>(token, {});
return [genDrawerStyle(drawerToken), genMotionStyle(drawerToken)];
},
(token) => ({
zIndexPopup: token.zIndexPopupBase,
drawerFooterPaddingVertical: token.paddingXS,
drawerFooterPaddingHorizontal: token.padding,
}),
);

15
docs/react/migrate-less-variables.en-US.md
View File

@ -39,7 +39,20 @@ This document contains the correspondence between all the less variables related
<!-- ### Divider -->
<!-- ### Drawer -->
## Drawer
<!-- prettier-ignore -->
| Less variables | Component Token | Note |
| --- | --- | --- |
| `@drawer-bg` | `colorBgElevated` | - |
| `@drawer-header-padding` | `padding`、`paddingLG` | `${padding}px ${paddingLG}px` |
| `@drawer-title-font-size` | `fontSizeLG` | - |
| `@drawer-title-line-height` | `lineHeightLG` | - |
| `@drawer-body-padding` | `paddingLG` | - |
| `@drawer-footer-padding-vertical` | `drawerFooterPaddingVertical` | `drawerFooterPaddingVertical` is a number without units, `@drawer-footer-padding-vertical` with units |
| `@drawer-footer-padding-horizontal` | `drawerFooterPaddingHorizontal` | `drawerFooterPaddingHorizontal` is a number without units, `@drawer-footer-padding-horizontal` with units |
<!-- ### Dropdown -->

15
docs/react/migrate-less-variables.zh-CN.md
View File

@ -39,7 +39,20 @@ title: Less 变量迁移 Design Token
<!-- ### Divider 分割线 -->
<!-- ### Drawer 抽屉 -->
## Drawer 抽屉
<!-- prettier-ignore -->
| Less 变量 | Component Token | 备注 |
| --- | --- | --- |
| `@drawer-bg` | `colorBgElevated` | - |
| `@drawer-header-padding` | `padding`、`paddingLG` | `${padding}px ${paddingLG}px` |
| `@drawer-title-font-size` | `fontSizeLG` | - |
| `@drawer-title-line-height` | `lineHeightLG` | - |
| `@drawer-body-padding` | `paddingLG` | - |
| `@drawer-footer-padding-vertical` | `drawerFooterPaddingVertical` | `drawerFooterPaddingVertical` 为数字，不带单位，`@drawer-footer-padding-vertical` 带单位 |
| `@drawer-footer-padding-horizontal` | `drawerFooterPaddingHorizontal` | `drawerFooterPaddingHorizontal` 为数字，不带单位，`@drawer-footer-padding-horizontal` 带单位 |
<!-- ### Dropdown 下拉菜单 -->