Support font-weight in font-size utilities (#8763)

* Support font-weight in font-size utilities

* WIP update tests

* Update changelog

Co-authored-by: Jordan Pittman <jordan@cryptica.me>
This commit is contained in:
Tmk 2022-07-05 05:01:06 +08:00 • committed by GitHub
parent 1318cb6064
commit 6729524185
4 changed files with 35 additions and 1 deletions

View file

@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- Fix usage of special-character prefixes ([#8772](https://github.com/tailwindlabs/tailwindcss/pull/8772))
- Don’t prefix selectors in arbitrary variants ([#8773](https://github.com/tailwindlabs/tailwindcss/pull/8773))
- Add support for alpha values in safe list ([#8774](https://github.com/tailwindlabs/tailwindcss/pull/8774))
- Support default `font-weight`s in font size utilities ([#8763](https://github.com/tailwindlabs/tailwindcss/pull/8763))
## [3.1.4] - 2022-06-21

View file

@ -1613,7 +1613,7 @@ export let corePlugins = {
{
text: (value) => {
let [fontSize, options] = Array.isArray(value) ? value : [value]
let { lineHeight, letterSpacing } = isPlainObject(options)
let { lineHeight, letterSpacing, fontWeight } = isPlainObject(options)
? options
: { lineHeight: options }
@ -1621,6 +1621,7 @@ export let corePlugins = {
'font-size': fontSize,
...(lineHeight === undefined ? {} : { 'line-height': lineHeight }),
...(letterSpacing === undefined ? {} : { 'letter-spacing': letterSpacing }),
...(fontWeight === undefined ? {} : { 'font-weight': fontWeight }),
}
},
},

View file

@ -88,3 +88,34 @@ test('font-size utilities can include a default line-height and letter-spacing',
`)
})
})
test('font-size utilities can include a font-weight', () => {
let config = {
content: [{ raw: html`<div class="text-md text-sm text-lg"></div>` }],
theme: {
fontSize: {
sm: '12px',
md: ['16px', { lineHeight: '24px', fontWeight: 500 }],
lg: ['20px', { lineHeight: '28px', fontWeight: 'bold' }],
},
},
}
return run('@tailwind utilities', config).then((result) => {
expect(result.css).toMatchCss(css`
.text-md {
font-size: 16px;
line-height: 24px;
font-weight: 500;
}
.text-sm {
font-size: 12px;
}
.text-lg {
font-size: 20px;
line-height: 28px;
font-weight: bold;
}
`)
})
})

1
types/config.d.ts vendored
View file

@ -164,6 +164,7 @@ interface ThemeConfig {
configuration: Partial<{
lineHeight: string
letterSpacing: string
fontWeight: string | number
}>
]
>