diff --git a/__tests__/fixtures/tailwind-output-flagged.css b/__tests__/fixtures/tailwind-output-flagged.css index bed20bab4d3e..9ae18ebf40e5 100644 --- a/__tests__/fixtures/tailwind-output-flagged.css +++ b/__tests__/fixtures/tailwind-output-flagged.css @@ -7790,18 +7790,6 @@ video { --tw-bg-opacity: 1; } -.bg-origin-border { - background-origin: border-box; -} - -.bg-origin-padding { - background-origin: padding-box; -} - -.bg-origin-content { - background-origin: content-box; -} - .bg-bottom { background-position: bottom; } @@ -7874,6 +7862,18 @@ video { background-size: contain; } +.bg-origin-border { + background-origin: border-box; +} + +.bg-origin-padding { + background-origin: padding-box; +} + +.bg-origin-content { + background-origin: content-box; +} + .border-collapse { border-collapse: collapse; } @@ -37048,18 +37048,6 @@ video { --tw-bg-opacity: 1; } - .sm\:bg-origin-border { - background-origin: border-box; - } - - .sm\:bg-origin-padding { - background-origin: padding-box; - } - - .sm\:bg-origin-content { - background-origin: content-box; - } - .sm\:bg-bottom { background-position: bottom; } @@ -37132,6 +37120,18 @@ video { background-size: contain; } + .sm\:bg-origin-border { + background-origin: border-box; + } + + .sm\:bg-origin-padding { + background-origin: padding-box; + } + + .sm\:bg-origin-content { + background-origin: content-box; + } + .sm\:border-collapse { border-collapse: collapse; } @@ -66171,18 +66171,6 @@ video { --tw-bg-opacity: 1; } - .md\:bg-origin-border { - background-origin: border-box; - } - - .md\:bg-origin-padding { - background-origin: padding-box; - } - - .md\:bg-origin-content { - background-origin: content-box; - } - .md\:bg-bottom { background-position: bottom; } @@ -66255,6 +66243,18 @@ video { background-size: contain; } + .md\:bg-origin-border { + background-origin: border-box; + } + + .md\:bg-origin-padding { + background-origin: padding-box; + } + + .md\:bg-origin-content { + background-origin: content-box; + } + .md\:border-collapse { border-collapse: collapse; } @@ -95294,18 +95294,6 @@ video { --tw-bg-opacity: 1; } - .lg\:bg-origin-border { - background-origin: border-box; - } - - .lg\:bg-origin-padding { - background-origin: padding-box; - } - - .lg\:bg-origin-content { - background-origin: content-box; - } - .lg\:bg-bottom { background-position: bottom; } @@ -95378,6 +95366,18 @@ video { background-size: contain; } + .lg\:bg-origin-border { + background-origin: border-box; + } + + .lg\:bg-origin-padding { + background-origin: padding-box; + } + + .lg\:bg-origin-content { + background-origin: content-box; + } + .lg\:border-collapse { border-collapse: collapse; } @@ -124417,18 +124417,6 @@ video { --tw-bg-opacity: 1; } - .xl\:bg-origin-border { - background-origin: border-box; - } - - .xl\:bg-origin-padding { - background-origin: padding-box; - } - - .xl\:bg-origin-content { - background-origin: content-box; - } - .xl\:bg-bottom { background-position: bottom; } @@ -124501,6 +124489,18 @@ video { background-size: contain; } + .xl\:bg-origin-border { + background-origin: border-box; + } + + .xl\:bg-origin-padding { + background-origin: padding-box; + } + + .xl\:bg-origin-content { + background-origin: content-box; + } + .xl\:border-collapse { border-collapse: collapse; } @@ -153540,18 +153540,6 @@ video { --tw-bg-opacity: 1; } - .\32xl\:bg-origin-border { - background-origin: border-box; - } - - .\32xl\:bg-origin-padding { - background-origin: padding-box; - } - - .\32xl\:bg-origin-content { - background-origin: content-box; - } - .\32xl\:bg-bottom { background-position: bottom; } @@ -153624,6 +153612,18 @@ video { background-size: contain; } + .\32xl\:bg-origin-border { + background-origin: border-box; + } + + .\32xl\:bg-origin-padding { + background-origin: padding-box; + } + + .\32xl\:bg-origin-content { + background-origin: content-box; + } + .\32xl\:border-collapse { border-collapse: collapse; } diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css index 64d47e1c9696..fbf1d93582ea 100644 --- a/__tests__/fixtures/tailwind-output-important.css +++ b/__tests__/fixtures/tailwind-output-important.css @@ -7790,18 +7790,6 @@ video { --tw-bg-opacity: 1 !important; } -.bg-origin-border { - background-origin: border-box !important; -} - -.bg-origin-padding { - background-origin: padding-box !important; -} - -.bg-origin-content { - background-origin: content-box !important; -} - .bg-bottom { background-position: bottom !important; } @@ -7874,6 +7862,18 @@ video { background-size: contain !important; } +.bg-origin-border { + background-origin: border-box !important; +} + +.bg-origin-padding { + background-origin: padding-box !important; +} + +.bg-origin-content { + background-origin: content-box !important; +} + .border-collapse { border-collapse: collapse !important; } @@ -37048,18 +37048,6 @@ video { --tw-bg-opacity: 1 !important; } - .sm\:bg-origin-border { - background-origin: border-box !important; - } - - .sm\:bg-origin-padding { - background-origin: padding-box !important; - } - - .sm\:bg-origin-content { - background-origin: content-box !important; - } - .sm\:bg-bottom { background-position: bottom !important; } @@ -37132,6 +37120,18 @@ video { background-size: contain !important; } + .sm\:bg-origin-border { + background-origin: border-box !important; + } + + .sm\:bg-origin-padding { + background-origin: padding-box !important; + } + + .sm\:bg-origin-content { + background-origin: content-box !important; + } + .sm\:border-collapse { border-collapse: collapse !important; } @@ -66171,18 +66171,6 @@ video { --tw-bg-opacity: 1 !important; } - .md\:bg-origin-border { - background-origin: border-box !important; - } - - .md\:bg-origin-padding { - background-origin: padding-box !important; - } - - .md\:bg-origin-content { - background-origin: content-box !important; - } - .md\:bg-bottom { background-position: bottom !important; } @@ -66255,6 +66243,18 @@ video { background-size: contain !important; } + .md\:bg-origin-border { + background-origin: border-box !important; + } + + .md\:bg-origin-padding { + background-origin: padding-box !important; + } + + .md\:bg-origin-content { + background-origin: content-box !important; + } + .md\:border-collapse { border-collapse: collapse !important; } @@ -95294,18 +95294,6 @@ video { --tw-bg-opacity: 1 !important; } - .lg\:bg-origin-border { - background-origin: border-box !important; - } - - .lg\:bg-origin-padding { - background-origin: padding-box !important; - } - - .lg\:bg-origin-content { - background-origin: content-box !important; - } - .lg\:bg-bottom { background-position: bottom !important; } @@ -95378,6 +95366,18 @@ video { background-size: contain !important; } + .lg\:bg-origin-border { + background-origin: border-box !important; + } + + .lg\:bg-origin-padding { + background-origin: padding-box !important; + } + + .lg\:bg-origin-content { + background-origin: content-box !important; + } + .lg\:border-collapse { border-collapse: collapse !important; } @@ -124417,18 +124417,6 @@ video { --tw-bg-opacity: 1 !important; } - .xl\:bg-origin-border { - background-origin: border-box !important; - } - - .xl\:bg-origin-padding { - background-origin: padding-box !important; - } - - .xl\:bg-origin-content { - background-origin: content-box !important; - } - .xl\:bg-bottom { background-position: bottom !important; } @@ -124501,6 +124489,18 @@ video { background-size: contain !important; } + .xl\:bg-origin-border { + background-origin: border-box !important; + } + + .xl\:bg-origin-padding { + background-origin: padding-box !important; + } + + .xl\:bg-origin-content { + background-origin: content-box !important; + } + .xl\:border-collapse { border-collapse: collapse !important; } @@ -153540,18 +153540,6 @@ video { --tw-bg-opacity: 1 !important; } - .\32xl\:bg-origin-border { - background-origin: border-box !important; - } - - .\32xl\:bg-origin-padding { - background-origin: padding-box !important; - } - - .\32xl\:bg-origin-content { - background-origin: content-box !important; - } - .\32xl\:bg-bottom { background-position: bottom !important; } @@ -153624,6 +153612,18 @@ video { background-size: contain !important; } + .\32xl\:bg-origin-border { + background-origin: border-box !important; + } + + .\32xl\:bg-origin-padding { + background-origin: padding-box !important; + } + + .\32xl\:bg-origin-content { + background-origin: content-box !important; + } + .\32xl\:border-collapse { border-collapse: collapse !important; } diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css index c066fdf27acb..aefbe7cab27e 100644 --- a/__tests__/fixtures/tailwind-output-no-color-opacity.css +++ b/__tests__/fixtures/tailwind-output-no-color-opacity.css @@ -6938,18 +6938,6 @@ video { --tw-gradient-to: #831843; } -.bg-origin-border { - background-origin: border-box; -} - -.bg-origin-padding { - background-origin: padding-box; -} - -.bg-origin-content { - background-origin: content-box; -} - .bg-bottom { background-position: bottom; } @@ -7022,6 +7010,18 @@ video { background-size: contain; } +.bg-origin-border { + background-origin: border-box; +} + +.bg-origin-padding { + background-origin: padding-box; +} + +.bg-origin-content { + background-origin: content-box; +} + .border-collapse { border-collapse: collapse; } @@ -33640,18 +33640,6 @@ video { --tw-gradient-to: #831843; } - .sm\:bg-origin-border { - background-origin: border-box; - } - - .sm\:bg-origin-padding { - background-origin: padding-box; - } - - .sm\:bg-origin-content { - background-origin: content-box; - } - .sm\:bg-bottom { background-position: bottom; } @@ -33724,6 +33712,18 @@ video { background-size: contain; } + .sm\:bg-origin-border { + background-origin: border-box; + } + + .sm\:bg-origin-padding { + background-origin: padding-box; + } + + .sm\:bg-origin-content { + background-origin: content-box; + } + .sm\:border-collapse { border-collapse: collapse; } @@ -60207,18 +60207,6 @@ video { --tw-gradient-to: #831843; } - .md\:bg-origin-border { - background-origin: border-box; - } - - .md\:bg-origin-padding { - background-origin: padding-box; - } - - .md\:bg-origin-content { - background-origin: content-box; - } - .md\:bg-bottom { background-position: bottom; } @@ -60291,6 +60279,18 @@ video { background-size: contain; } + .md\:bg-origin-border { + background-origin: border-box; + } + + .md\:bg-origin-padding { + background-origin: padding-box; + } + + .md\:bg-origin-content { + background-origin: content-box; + } + .md\:border-collapse { border-collapse: collapse; } @@ -86774,18 +86774,6 @@ video { --tw-gradient-to: #831843; } - .lg\:bg-origin-border { - background-origin: border-box; - } - - .lg\:bg-origin-padding { - background-origin: padding-box; - } - - .lg\:bg-origin-content { - background-origin: content-box; - } - .lg\:bg-bottom { background-position: bottom; } @@ -86858,6 +86846,18 @@ video { background-size: contain; } + .lg\:bg-origin-border { + background-origin: border-box; + } + + .lg\:bg-origin-padding { + background-origin: padding-box; + } + + .lg\:bg-origin-content { + background-origin: content-box; + } + .lg\:border-collapse { border-collapse: collapse; } @@ -113341,18 +113341,6 @@ video { --tw-gradient-to: #831843; } - .xl\:bg-origin-border { - background-origin: border-box; - } - - .xl\:bg-origin-padding { - background-origin: padding-box; - } - - .xl\:bg-origin-content { - background-origin: content-box; - } - .xl\:bg-bottom { background-position: bottom; } @@ -113425,6 +113413,18 @@ video { background-size: contain; } + .xl\:bg-origin-border { + background-origin: border-box; + } + + .xl\:bg-origin-padding { + background-origin: padding-box; + } + + .xl\:bg-origin-content { + background-origin: content-box; + } + .xl\:border-collapse { border-collapse: collapse; } @@ -139908,18 +139908,6 @@ video { --tw-gradient-to: #831843; } - .\32xl\:bg-origin-border { - background-origin: border-box; - } - - .\32xl\:bg-origin-padding { - background-origin: padding-box; - } - - .\32xl\:bg-origin-content { - background-origin: content-box; - } - .\32xl\:bg-bottom { background-position: bottom; } @@ -139992,6 +139980,18 @@ video { background-size: contain; } + .\32xl\:bg-origin-border { + background-origin: border-box; + } + + .\32xl\:bg-origin-padding { + background-origin: padding-box; + } + + .\32xl\:bg-origin-content { + background-origin: content-box; + } + .\32xl\:border-collapse { border-collapse: collapse; } diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css index bed20bab4d3e..9ae18ebf40e5 100644 --- a/__tests__/fixtures/tailwind-output.css +++ b/__tests__/fixtures/tailwind-output.css @@ -7790,18 +7790,6 @@ video { --tw-bg-opacity: 1; } -.bg-origin-border { - background-origin: border-box; -} - -.bg-origin-padding { - background-origin: padding-box; -} - -.bg-origin-content { - background-origin: content-box; -} - .bg-bottom { background-position: bottom; } @@ -7874,6 +7862,18 @@ video { background-size: contain; } +.bg-origin-border { + background-origin: border-box; +} + +.bg-origin-padding { + background-origin: padding-box; +} + +.bg-origin-content { + background-origin: content-box; +} + .border-collapse { border-collapse: collapse; } @@ -37048,18 +37048,6 @@ video { --tw-bg-opacity: 1; } - .sm\:bg-origin-border { - background-origin: border-box; - } - - .sm\:bg-origin-padding { - background-origin: padding-box; - } - - .sm\:bg-origin-content { - background-origin: content-box; - } - .sm\:bg-bottom { background-position: bottom; } @@ -37132,6 +37120,18 @@ video { background-size: contain; } + .sm\:bg-origin-border { + background-origin: border-box; + } + + .sm\:bg-origin-padding { + background-origin: padding-box; + } + + .sm\:bg-origin-content { + background-origin: content-box; + } + .sm\:border-collapse { border-collapse: collapse; } @@ -66171,18 +66171,6 @@ video { --tw-bg-opacity: 1; } - .md\:bg-origin-border { - background-origin: border-box; - } - - .md\:bg-origin-padding { - background-origin: padding-box; - } - - .md\:bg-origin-content { - background-origin: content-box; - } - .md\:bg-bottom { background-position: bottom; } @@ -66255,6 +66243,18 @@ video { background-size: contain; } + .md\:bg-origin-border { + background-origin: border-box; + } + + .md\:bg-origin-padding { + background-origin: padding-box; + } + + .md\:bg-origin-content { + background-origin: content-box; + } + .md\:border-collapse { border-collapse: collapse; } @@ -95294,18 +95294,6 @@ video { --tw-bg-opacity: 1; } - .lg\:bg-origin-border { - background-origin: border-box; - } - - .lg\:bg-origin-padding { - background-origin: padding-box; - } - - .lg\:bg-origin-content { - background-origin: content-box; - } - .lg\:bg-bottom { background-position: bottom; } @@ -95378,6 +95366,18 @@ video { background-size: contain; } + .lg\:bg-origin-border { + background-origin: border-box; + } + + .lg\:bg-origin-padding { + background-origin: padding-box; + } + + .lg\:bg-origin-content { + background-origin: content-box; + } + .lg\:border-collapse { border-collapse: collapse; } @@ -124417,18 +124417,6 @@ video { --tw-bg-opacity: 1; } - .xl\:bg-origin-border { - background-origin: border-box; - } - - .xl\:bg-origin-padding { - background-origin: padding-box; - } - - .xl\:bg-origin-content { - background-origin: content-box; - } - .xl\:bg-bottom { background-position: bottom; } @@ -124501,6 +124489,18 @@ video { background-size: contain; } + .xl\:bg-origin-border { + background-origin: border-box; + } + + .xl\:bg-origin-padding { + background-origin: padding-box; + } + + .xl\:bg-origin-content { + background-origin: content-box; + } + .xl\:border-collapse { border-collapse: collapse; } @@ -153540,18 +153540,6 @@ video { --tw-bg-opacity: 1; } - .\32xl\:bg-origin-border { - background-origin: border-box; - } - - .\32xl\:bg-origin-padding { - background-origin: padding-box; - } - - .\32xl\:bg-origin-content { - background-origin: content-box; - } - .\32xl\:bg-bottom { background-position: bottom; } @@ -153624,6 +153612,18 @@ video { background-size: contain; } + .\32xl\:bg-origin-border { + background-origin: border-box; + } + + .\32xl\:bg-origin-padding { + background-origin: padding-box; + } + + .\32xl\:bg-origin-content { + background-origin: content-box; + } + .\32xl\:border-collapse { border-collapse: collapse; } diff --git a/jit/tests/basic-usage.test.css b/jit/tests/basic-usage.test.css index 6bb6752d4e75..784da2da1d4b 100644 --- a/jit/tests/basic-usage.test.css +++ b/jit/tests/basic-usage.test.css @@ -450,6 +450,12 @@ .bg-clip-border { background-clip: border-box; } +.bg-top { + background-position: top; +} +.bg-no-repeat { + background-repeat: no-repeat; +} .bg-origin-border { background-origin: border-box; } @@ -459,12 +465,6 @@ .bg-origin-content { background-origin: content-box; } -.bg-top { - background-position: top; -} -.bg-no-repeat { - background-repeat: no-repeat; -} .fill-current { fill: currentColor; } diff --git a/jit/tests/basic-usage.test.html b/jit/tests/basic-usage.test.html index 5df8e87e439f..ade6904419a5 100644 --- a/jit/tests/basic-usage.test.html +++ b/jit/tests/basic-usage.test.html @@ -19,11 +19,11 @@
-
+
diff --git a/src/corePluginList.js b/src/corePluginList.js index b383e5eaf7f6..48496869ccda 100644 --- a/src/corePluginList.js +++ b/src/corePluginList.js @@ -14,10 +14,10 @@ export const corePluginList = [ 'backgroundImage', 'gradientColorStops', 'backgroundOpacity', - 'backgroundOrigin', 'backgroundPosition', 'backgroundRepeat', 'backgroundSize', + 'backgroundOrigin', 'borderCollapse', 'borderColor', 'borderOpacity', diff --git a/src/plugins/index.js b/src/plugins/index.js index 7c43a930a543..60673fc3d5c1 100644 --- a/src/plugins/index.js +++ b/src/plugins/index.js @@ -20,10 +20,10 @@ export { default as backgroundClip } from './backgroundClip' export { default as backgroundColor } from './backgroundColor' export { default as backgroundImage } from './backgroundImage' export { default as backgroundOpacity } from './backgroundOpacity' -export { default as backgroundOrigin } from './backgroundOrigin' export { default as backgroundPosition } from './backgroundPosition' export { default as backgroundRepeat } from './backgroundRepeat' export { default as backgroundSize } from './backgroundSize' +export { default as backgroundOrigin } from './backgroundOrigin' export { default as blur } from './blur' export { default as borderCollapse } from './borderCollapse' export { default as borderColor } from './borderColor' diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js index 866c8006d062..8e7bed9513f8 100644 --- a/stubs/defaultConfig.stub.js +++ b/stubs/defaultConfig.stub.js @@ -838,10 +838,10 @@ module.exports = { backgroundColor: ['responsive', 'dark', 'group-hover', 'focus-within', 'hover', 'focus'], backgroundImage: ['responsive'], backgroundOpacity: ['responsive', 'dark', 'group-hover', 'focus-within', 'hover', 'focus'], - backgroundOrigin: ['responsive'], backgroundPosition: ['responsive'], backgroundRepeat: ['responsive'], backgroundSize: ['responsive'], + backgroundOrigin: ['responsive'], blur: ['responsive'], borderCollapse: ['responsive'], borderColor: ['responsive', 'dark', 'group-hover', 'focus-within', 'hover', 'focus'],