diff --git a/CHANGELOG.md b/CHANGELOG.md index 92b0214f772e..f9e14df7e014 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -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 diff --git a/src/corePlugins.js b/src/corePlugins.js index 5781905db4b5..62f9d24aa8f0 100644 --- a/src/corePlugins.js +++ b/src/corePlugins.js @@ -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 }), } }, }, diff --git a/tests/plugins/fontSize.test.js b/tests/plugins/fontSize.test.js index 7304ae3bb839..f26735db94e5 100644 --- a/tests/plugins/fontSize.test.js +++ b/tests/plugins/fontSize.test.js @@ -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`
` }], + 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; + } + `) + }) +}) diff --git a/types/config.d.ts b/types/config.d.ts index 703d56c2a472..344ddc28ee16 100644 --- a/types/config.d.ts +++ b/types/config.d.ts @@ -164,6 +164,7 @@ interface ThemeConfig { configuration: Partial<{ lineHeight: string letterSpacing: string + fontWeight: string | number }> ] >