mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 17:44:35 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

feat: Text Button tokens (#47870)

Browse Source
This commit is contained in:
章鱼怪 2024-09-18 23:26:56 +08:00 committed by GitHub
parent 436aa9ad2d
commit b5b0918970
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -224,11 +224,13 @@ const genFilledButtonStyle = (
const genTextLinkButtonStyle = (
token: ButtonToken,
textColor: string,
variant: 'text' | 'link',
hoverStyle: CSSObject,
activeStyle: CSSObject,
) => ({
[`&${token.componentCls}-${variant}`]: {
color: textColor,
boxShadow: 'none',
...genVariantButtonStyle(token, hoverStyle, activeStyle, variant),
@ -284,18 +286,20 @@ const genDefaultButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) =>
...genTextLinkButtonStyle(
token,
token.textTextColor,
'text',
{
color: token.colorText,
color: token.textTextHoverColor,
background: token.textHoverBg,
},
{
color: token.colorText,
color: token.textTextActiveColor,
background: token.colorBgTextActive,
},
),
...genTextLinkButtonStyle(
token,
token.textTextColor,
'link',
{
color: token.colorLinkHover,
@ -364,6 +368,7 @@ const genPrimaryButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) =>
...genTextLinkButtonStyle(
token,
token.colorPrimary,
'text',
{
color: token.colorPrimaryTextHover,
@ -377,6 +382,7 @@ const genPrimaryButtonStyle: GenerateStyle<ButtonToken, CSSObject> = (token) =>
...genTextLinkButtonStyle(
token,
token.colorPrimary,
'link',
{
color: token.colorPrimaryTextHover,
@ -450,6 +456,7 @@ const genDangerousStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => ({
...genTextLinkButtonStyle(
token,
token.colorError,
'text',
{
color: token.colorErrorHover,
@ -463,6 +470,7 @@ const genDangerousStyle: GenerateStyle<ButtonToken, CSSObject> = (token) => ({
...genTextLinkButtonStyle(
token,
token.colorError,
'link',
{
color: token.colorErrorHover,

18
components/button/style/token.ts
View File

@ -111,6 +111,21 @@ export interface ComponentToken {
* @descEN Default text color for solid buttons.
*/
solidTextColor: string;
/**
* @desc 默认文本按钮的文本色
* @descEN Default text color for text buttons
*/
textTextColor: string;
/**
* @desc 默认文本按钮悬浮态文本颜色
* @descEN Default text color for text buttons on hover
*/
textTextHoverColor: string;
/**
* @desc 默认文本按钮激活态文字颜色
* @descEN Default text color for text buttons on active
*/
textTextActiveColor: string;
/**
* @desc 按钮横向内间距
* @descEN Horizontal padding of button
@ -265,6 +280,9 @@ export const prepareComponentToken: GetDefaultToken<'Button'> = (token) => {
onlyIconSizeLG: token.fontSizeLG + 2,
groupBorderColor: token.colorPrimaryHover,
linkHoverBg: 'transparent',
textTextColor: token.colorText,
textTextHoverColor: token.colorText,
textTextActiveColor: token.colorText,
textHoverBg: token.colorBgTextHover,
defaultColor: token.colorText,
defaultBg: token.colorBgContainer,