Skip to content

Commit 4205242

Browse files
authored
improve(design): line-height for fontSizeSM including Breadcrumb, Descriptions, Empty, Form, Table, Typography and DateRanger (#1386)
1 parent 899c974 commit 4205242

File tree

8 files changed

+13
-4
lines changed

8 files changed

+13
-4
lines changed

packages/design/src/alert/style/index.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -161,7 +161,6 @@ export const genAlertStyle: GenerateStyle<AlertToken> = (token: AlertToken): CSS
161161
alignItems: 'center',
162162
justifyContent: 'center',
163163
lineHeight: 1,
164-
//
165164
fontSize: token.fontSizeSM,
166165
},
167166
[`${componentCls}-message`]: {

packages/design/src/descriptions/style/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ export const genVerticalStyle = (
4444
[`${componentCls}-item`]: {
4545
[`${componentCls}-item-label`]: {
4646
fontSize: token.fontSizeSM,
47+
lineHeight: token.lineHeightSM,
4748
},
4849
},
4950
},

packages/design/src/empty/style/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ export const genEmptyStyle: GenerateStyle<EmptyToken> = (token: EmptyToken): CSS
6464
[`${antCls}-steps-item-description`]: {
6565
color: colorTextTertiary,
6666
fontSize: token.fontSizeSM,
67+
lineHeight: token.lineHeightSM,
6768
marginTop: token.marginXS,
6869
},
6970
},

packages/design/src/form/style/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ export const genFormStyle: GenerateStyle<FormToken> = (token: FormToken): CSSObj
1212
[`${componentCls}-item-explain, ${componentCls}-item-extra`]: {
1313
paddingTop: token.paddingXXS,
1414
fontSize: token.fontSizeSM,
15+
lineHeight: token.lineHeightSM,
1516
},
1617
[`${componentCls}-item-explain + ${componentCls}-item-extra`]: {
1718
paddingTop: 0,
@@ -30,6 +31,7 @@ export const genFormStyle: GenerateStyle<FormToken> = (token: FormToken): CSSObj
3031
[`${componentCls}-item-description`]: {
3132
paddingTop: token.paddingXXS,
3233
fontSize: token.fontSizeSM,
34+
lineHeight: token.lineHeightSM,
3335
color: token.colorTextDescription,
3436
},
3537
// action style

packages/design/src/table/style/index.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ const genSmallBtnStyle = (token: TableToken): CSSObject => {
1212
[`${antCls}-btn:not(${antCls}-btn-sm):not(${antCls}-btn-lg)`]: {
1313
height: token.controlHeightSM,
1414
fontSize: token.fontSizeSM,
15+
lineHeight: token.lineHeightSM,
1516
[`&:not(${antCls}-btn-icon-only):not(${antCls}-btn-circle)`]: {
1617
paddingInline: token.paddingXS,
1718
},
@@ -46,6 +47,8 @@ export const genTableStyle = (token: TableToken): CSSObject => {
4647
return {
4748
// 表格通用样式
4849
[`${componentCls}-wrapper ${componentCls}`]: {
50+
// to match fontSizeSM lineHeight
51+
lineHeight: token.lineHeightSM,
4952
color: colorText,
5053
backgroundColor: colorBgBase,
5154
borderRadius: borderRadiusLG,

packages/design/src/theme/default.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,8 @@ export const fontWeightWeakEn = 300;
8989
export const fontWeightEn = 500;
9090
export const fontWeightStrongEn = 600;
9191

92+
const lineHeightSM = 20 / 12;
93+
9294
const defaultTheme: ThemeConfig = {
9395
token: {
9496
fontFamily: `-apple-system, 'Noto Sans', BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
@@ -102,7 +104,7 @@ const defaultTheme: ThemeConfig = {
102104
borderRadiusLG,
103105
fontSizeSM,
104106
fontSize: 13,
105-
lineHeightSM: 20 / 12,
107+
lineHeightSM: lineHeightSM,
106108
lineHeight: 20 / 13,
107109
lineHeightLG: 24 / 16,
108110
fontHeight: 20,
@@ -283,6 +285,7 @@ const defaultTheme: ThemeConfig = {
283285
},
284286
Breadcrumb: {
285287
fontSize: fontSizeSM,
288+
lineHeight: lineHeightSM,
286289
fontHeight: 20,
287290
lastItemColor: colorTextSecondary,
288291
},

packages/design/src/typography/style/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ export const genTypographyStyle: GenerateStyle<TypographyToken> = (
2929
},
3030
[`${componentCls}-caption`]: {
3131
fontSize: token.fontSizeSM,
32+
lineHeight: token.lineHeightSM,
3233
fontWeight: token.fontWeightWeak,
3334
},
3435
[`${componentCls}${componentCls}-editable-text:not(${componentCls}-edit-content)`]: {

packages/ui/src/DateRanger/style/index.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -125,13 +125,12 @@ export const genDateRangerStyle: GenerateStyle<DateRangerToken> = (
125125
},
126126
[`${componentCls}-label`]: {
127127
fontSize: token.fontSizeSM,
128+
lineHeight: token.lineHeightSM,
128129
backgroundColor: colorFillSecondary,
129130
color: colorTextSecondary,
130131
display: 'inline-block',
131132
width: 52,
132-
padding: '4px 0',
133133
borderRadius: token.borderRadiusSM,
134-
lineHeight: 1,
135134
textAlign: 'center',
136135
},
137136
[`${componentCls}-back-radio-focused`]: {

0 commit comments

Comments
 (0)