diff --git a/CHANGELOG.md b/CHANGELOG.md index 55bfc84809e6..82a986be1a90 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Extend default `opacity` scale to include all steps of 5 ([#11832](https://github.com/tailwindlabs/tailwindcss/pull/11832)) - Update Preflight `html` styles to include shadow DOM `:host` pseudo-class ([#11200](https://github.com/tailwindlabs/tailwindcss/pull/11200)) - Increase default values for `grid-rows-*` utilities from 1–6 to 1–12 ([#12180](https://github.com/tailwindlabs/tailwindcss/pull/12180)) +- Add `size-*` utilities ([#12287](https://github.com/tailwindlabs/tailwindcss/pull/12287)) ## [3.3.6] - 2023-12-04 diff --git a/src/corePlugins.js b/src/corePlugins.js index 9cb62af58e80..8f296bb0f443 100644 --- a/src/corePlugins.js +++ b/src/corePlugins.js @@ -779,6 +779,8 @@ export let corePlugins = { aspectRatio: createUtilityPlugin('aspectRatio', [['aspect', ['aspect-ratio']]]), + size: createUtilityPlugin('size', [['size', ['width', 'height']]]), + height: createUtilityPlugin('height', [['h', ['height']]]), maxHeight: createUtilityPlugin('maxHeight', [['max-h', ['maxHeight']]]), minHeight: createUtilityPlugin('minHeight', [['min-h', ['minHeight']]]), diff --git a/stubs/config.full.js b/stubs/config.full.js index a4931114f2a7..2e78294abd71 100644 --- a/stubs/config.full.js +++ b/stubs/config.full.js @@ -975,6 +975,40 @@ module.exports = { '3/4': '75%', full: '100%', }), + size: ({ theme }) => ({ + auto: 'auto', + ...theme('spacing'), + '1/2': '50%', + '1/3': '33.333333%', + '2/3': '66.666667%', + '1/4': '25%', + '2/4': '50%', + '3/4': '75%', + '1/5': '20%', + '2/5': '40%', + '3/5': '60%', + '4/5': '80%', + '1/6': '16.666667%', + '2/6': '33.333333%', + '3/6': '50%', + '4/6': '66.666667%', + '5/6': '83.333333%', + '1/12': '8.333333%', + '2/12': '16.666667%', + '3/12': '25%', + '4/12': '33.333333%', + '5/12': '41.666667%', + '6/12': '50%', + '7/12': '58.333333%', + '8/12': '66.666667%', + '9/12': '75%', + '10/12': '83.333333%', + '11/12': '91.666667%', + full: '100%', + min: 'min-content', + max: 'max-content', + fit: 'fit-content', + }), width: ({ theme }) => ({ auto: 'auto', ...theme('spacing'),