diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css index cecaefa4b..779af9979 100644 --- a/__tests__/fixtures/tailwind-output-important.css +++ b/__tests__/fixtures/tailwind-output-important.css @@ -5736,10 +5736,6 @@ video { display: inline !important; } -.flow-root { - display: flow-root !important; -} - .flex { display: flex !important; } @@ -5748,14 +5744,6 @@ video { display: inline-flex !important; } -.grid { - display: grid !important; -} - -.inline-grid { - display: inline-grid !important; -} - .table { display: table !important; } @@ -5792,6 +5780,18 @@ video { display: table-row !important; } +.flow-root { + display: flow-root !important; +} + +.grid { + display: grid !important; +} + +.inline-grid { + display: inline-grid !important; +} + .hidden { display: none !important; } @@ -19473,10 +19473,6 @@ video { display: inline !important; } - .sm\:flow-root { - display: flow-root !important; - } - .sm\:flex { display: flex !important; } @@ -19485,14 +19481,6 @@ video { display: inline-flex !important; } - .sm\:grid { - display: grid !important; - } - - .sm\:inline-grid { - display: inline-grid !important; - } - .sm\:table { display: table !important; } @@ -19529,6 +19517,18 @@ video { display: table-row !important; } + .sm\:flow-root { + display: flow-root !important; + } + + .sm\:grid { + display: grid !important; + } + + .sm\:inline-grid { + display: inline-grid !important; + } + .sm\:hidden { display: none !important; } @@ -33211,10 +33211,6 @@ video { display: inline !important; } - .md\:flow-root { - display: flow-root !important; - } - .md\:flex { display: flex !important; } @@ -33223,14 +33219,6 @@ video { display: inline-flex !important; } - .md\:grid { - display: grid !important; - } - - .md\:inline-grid { - display: inline-grid !important; - } - .md\:table { display: table !important; } @@ -33267,6 +33255,18 @@ video { display: table-row !important; } + .md\:flow-root { + display: flow-root !important; + } + + .md\:grid { + display: grid !important; + } + + .md\:inline-grid { + display: inline-grid !important; + } + .md\:hidden { display: none !important; } @@ -46949,10 +46949,6 @@ video { display: inline !important; } - .lg\:flow-root { - display: flow-root !important; - } - .lg\:flex { display: flex !important; } @@ -46961,14 +46957,6 @@ video { display: inline-flex !important; } - .lg\:grid { - display: grid !important; - } - - .lg\:inline-grid { - display: inline-grid !important; - } - .lg\:table { display: table !important; } @@ -47005,6 +46993,18 @@ video { display: table-row !important; } + .lg\:flow-root { + display: flow-root !important; + } + + .lg\:grid { + display: grid !important; + } + + .lg\:inline-grid { + display: inline-grid !important; + } + .lg\:hidden { display: none !important; } @@ -60687,10 +60687,6 @@ video { display: inline !important; } - .xl\:flow-root { - display: flow-root !important; - } - .xl\:flex { display: flex !important; } @@ -60699,14 +60695,6 @@ video { display: inline-flex !important; } - .xl\:grid { - display: grid !important; - } - - .xl\:inline-grid { - display: inline-grid !important; - } - .xl\:table { display: table !important; } @@ -60743,6 +60731,18 @@ video { display: table-row !important; } + .xl\:flow-root { + display: flow-root !important; + } + + .xl\:grid { + display: grid !important; + } + + .xl\:inline-grid { + display: inline-grid !important; + } + .xl\:hidden { display: none !important; } diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css index d847dd59f..e16f646f9 100644 --- a/__tests__/fixtures/tailwind-output.css +++ b/__tests__/fixtures/tailwind-output.css @@ -5736,10 +5736,6 @@ video { display: inline; } -.flow-root { - display: flow-root; -} - .flex { display: flex; } @@ -5748,14 +5744,6 @@ video { display: inline-flex; } -.grid { - display: grid; -} - -.inline-grid { - display: inline-grid; -} - .table { display: table; } @@ -5792,6 +5780,18 @@ video { display: table-row; } +.flow-root { + display: flow-root; +} + +.grid { + display: grid; +} + +.inline-grid { + display: inline-grid; +} + .hidden { display: none; } @@ -19473,10 +19473,6 @@ video { display: inline; } - .sm\:flow-root { - display: flow-root; - } - .sm\:flex { display: flex; } @@ -19485,14 +19481,6 @@ video { display: inline-flex; } - .sm\:grid { - display: grid; - } - - .sm\:inline-grid { - display: inline-grid; - } - .sm\:table { display: table; } @@ -19529,6 +19517,18 @@ video { display: table-row; } + .sm\:flow-root { + display: flow-root; + } + + .sm\:grid { + display: grid; + } + + .sm\:inline-grid { + display: inline-grid; + } + .sm\:hidden { display: none; } @@ -33211,10 +33211,6 @@ video { display: inline; } - .md\:flow-root { - display: flow-root; - } - .md\:flex { display: flex; } @@ -33223,14 +33219,6 @@ video { display: inline-flex; } - .md\:grid { - display: grid; - } - - .md\:inline-grid { - display: inline-grid; - } - .md\:table { display: table; } @@ -33267,6 +33255,18 @@ video { display: table-row; } + .md\:flow-root { + display: flow-root; + } + + .md\:grid { + display: grid; + } + + .md\:inline-grid { + display: inline-grid; + } + .md\:hidden { display: none; } @@ -46949,10 +46949,6 @@ video { display: inline; } - .lg\:flow-root { - display: flow-root; - } - .lg\:flex { display: flex; } @@ -46961,14 +46957,6 @@ video { display: inline-flex; } - .lg\:grid { - display: grid; - } - - .lg\:inline-grid { - display: inline-grid; - } - .lg\:table { display: table; } @@ -47005,6 +46993,18 @@ video { display: table-row; } + .lg\:flow-root { + display: flow-root; + } + + .lg\:grid { + display: grid; + } + + .lg\:inline-grid { + display: inline-grid; + } + .lg\:hidden { display: none; } @@ -60687,10 +60687,6 @@ video { display: inline; } - .xl\:flow-root { - display: flow-root; - } - .xl\:flex { display: flex; } @@ -60699,14 +60695,6 @@ video { display: inline-flex; } - .xl\:grid { - display: grid; - } - - .xl\:inline-grid { - display: inline-grid; - } - .xl\:table { display: table; } @@ -60743,6 +60731,18 @@ video { display: table-row; } + .xl\:flow-root { + display: flow-root; + } + + .xl\:grid { + display: grid; + } + + .xl\:inline-grid { + display: inline-grid; + } + .xl\:hidden { display: none; } diff --git a/src/plugins/backgroundColor.js b/src/plugins/backgroundColor.js index 4a49a1ce7..235eafd98 100644 --- a/src/plugins/backgroundColor.js +++ b/src/plugins/backgroundColor.js @@ -3,7 +3,19 @@ import flattenColorPalette from '../util/flattenColorPalette' import withAlphaVariable from '../util/withAlphaVariable' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + const utilities = _.fromPairs( + _.map(flattenColorPalette(theme('backgroundColor')), (value, modifier) => { + return [`.${e(`bg-${modifier}`)}`, { 'background-color': value }] + }) + ) + + addUtilities(utilities, variants('backgroundColor')) + + return + } + const utilities = _.fromPairs( _.map(flattenColorPalette(theme('backgroundColor')), (value, modifier) => { return [ diff --git a/src/plugins/backgroundOpacity.js b/src/plugins/backgroundOpacity.js index c24fdcaf5..ada666f42 100644 --- a/src/plugins/backgroundOpacity.js +++ b/src/plugins/backgroundOpacity.js @@ -1,5 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('backgroundOpacity', [['bg-opacity', ['--bg-opacity']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('backgroundOpacity', [['bg-opacity', ['--bg-opacity']]])({ + config, + ...args, + }) + } } diff --git a/src/plugins/borderColor.js b/src/plugins/borderColor.js index 104059bf0..1b8c06665 100644 --- a/src/plugins/borderColor.js +++ b/src/plugins/borderColor.js @@ -3,7 +3,21 @@ import flattenColorPalette from '../util/flattenColorPalette' import withAlphaVariable from '../util/withAlphaVariable' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + const colors = flattenColorPalette(theme('borderColor')) + + const utilities = _.fromPairs( + _.map(_.omit(colors, 'default'), (value, modifier) => { + return [`.${e(`border-${modifier}`)}`, { 'border-color': value }] + }) + ) + + addUtilities(utilities, variants('borderColor')) + + return + } + const colors = flattenColorPalette(theme('borderColor')) const utilities = _.fromPairs( diff --git a/src/plugins/borderOpacity.js b/src/plugins/borderOpacity.js index fcc8e02de..0c3f85862 100644 --- a/src/plugins/borderOpacity.js +++ b/src/plugins/borderOpacity.js @@ -1,5 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('borderOpacity', [['border-opacity', ['--border-opacity']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('borderOpacity', [['border-opacity', ['--border-opacity']]])({ + config, + ...args, + }) + } } diff --git a/src/plugins/display.js b/src/plugins/display.js index 561697694..f45f647c8 100644 --- a/src/plugins/display.js +++ b/src/plugins/display.js @@ -1,5 +1,5 @@ export default function() { - return function({ addUtilities, variants }) { + return function({ addUtilities, variants, config }) { addUtilities( { '.block': { @@ -11,21 +11,12 @@ export default function() { '.inline': { display: 'inline', }, - '.flow-root': { - display: 'flow-root', - }, '.flex': { display: 'flex', }, '.inline-flex': { display: 'inline-flex', }, - '.grid': { - display: 'grid', - }, - '.inline-grid': { - display: 'inline-grid', - }, '.table': { display: 'table', }, @@ -53,6 +44,19 @@ export default function() { '.table-row': { display: 'table-row', }, + ...(config('target') === 'ie11' + ? {} + : { + '.flow-root': { + display: 'flow-root', + }, + '.grid': { + display: 'grid', + }, + '.inline-grid': { + display: 'inline-grid', + }, + }), '.hidden': { display: 'none', }, diff --git a/src/plugins/divideOpacity.js b/src/plugins/divideOpacity.js index 06dc5e08a..e64f8e9ac 100644 --- a/src/plugins/divideOpacity.js +++ b/src/plugins/divideOpacity.js @@ -1,7 +1,11 @@ import _ from 'lodash' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + return + } + const utilities = _.fromPairs( _.map(theme('divideOpacity'), (value, modifier) => { return [ diff --git a/src/plugins/gap.js b/src/plugins/gap.js index bd5e73125..16a099390 100644 --- a/src/plugins/gap.js +++ b/src/plugins/gap.js @@ -1,9 +1,15 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gap', [ - ['gap', ['gridGap', 'gap']], - ['col-gap', ['gridColumnGap', 'columnGap']], - ['row-gap', ['gridRowGap', 'rowGap']], - ]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gap', [ + ['gap', ['gridGap', 'gap']], + ['col-gap', ['gridColumnGap', 'columnGap']], + ['row-gap', ['gridRowGap', 'rowGap']], + ])({ config, ...args }) + } } diff --git a/src/plugins/gridAutoFlow.js b/src/plugins/gridAutoFlow.js index a2fa74c44..ac7521d96 100644 --- a/src/plugins/gridAutoFlow.js +++ b/src/plugins/gridAutoFlow.js @@ -1,5 +1,9 @@ export default function() { - return function({ addUtilities, variants }) { + return function({ addUtilities, variants, config }) { + if (config('target') === 'ie11') { + return + } + addUtilities( { '.grid-flow-row': { gridAutoFlow: 'row' }, diff --git a/src/plugins/gridColumn.js b/src/plugins/gridColumn.js index 107538718..186686446 100644 --- a/src/plugins/gridColumn.js +++ b/src/plugins/gridColumn.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridColumn', [['col', ['gridColumn']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridColumn', [['col', ['gridColumn']]])({ config, ...args }) + } } diff --git a/src/plugins/gridColumnEnd.js b/src/plugins/gridColumnEnd.js index d483227f7..2fe647ea6 100644 --- a/src/plugins/gridColumnEnd.js +++ b/src/plugins/gridColumnEnd.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridColumnEnd', [['col-end', ['gridColumnEnd']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridColumnEnd', [['col-end', ['gridColumnEnd']]])({ config, ...args }) + } } diff --git a/src/plugins/gridColumnStart.js b/src/plugins/gridColumnStart.js index dc3f997d8..9dd26b604 100644 --- a/src/plugins/gridColumnStart.js +++ b/src/plugins/gridColumnStart.js @@ -1,5 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridColumnStart', [['col-start', ['gridColumnStart']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridColumnStart', [['col-start', ['gridColumnStart']]])({ + config, + ...args, + }) + } } diff --git a/src/plugins/gridRow.js b/src/plugins/gridRow.js index d89529bd5..6fdc14f0a 100644 --- a/src/plugins/gridRow.js +++ b/src/plugins/gridRow.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridRow', [['row', ['gridRow']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridRow', [['row', ['gridRow']]])({ config, ...args }) + } } diff --git a/src/plugins/gridRowEnd.js b/src/plugins/gridRowEnd.js index 1aa9e6eaa..544e35a87 100644 --- a/src/plugins/gridRowEnd.js +++ b/src/plugins/gridRowEnd.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridRowEnd', [['row-end', ['gridRowEnd']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridRowEnd', [['row-end', ['gridRowEnd']]])({ config, ...args }) + } } diff --git a/src/plugins/gridRowStart.js b/src/plugins/gridRowStart.js index 2f4fe1d03..59da2ea67 100644 --- a/src/plugins/gridRowStart.js +++ b/src/plugins/gridRowStart.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridRowStart', [['row-start', ['gridRowStart']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridRowStart', [['row-start', ['gridRowStart']]])({ config, ...args }) + } } diff --git a/src/plugins/gridTemplateColumns.js b/src/plugins/gridTemplateColumns.js index 56e9f5b00..567783fca 100644 --- a/src/plugins/gridTemplateColumns.js +++ b/src/plugins/gridTemplateColumns.js @@ -1,5 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridTemplateColumns', [['grid-cols', ['gridTemplateColumns']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridTemplateColumns', [['grid-cols', ['gridTemplateColumns']]])({ + config, + ...args, + }) + } } diff --git a/src/plugins/gridTemplateRows.js b/src/plugins/gridTemplateRows.js index 90d8c962c..8ee2f5f92 100644 --- a/src/plugins/gridTemplateRows.js +++ b/src/plugins/gridTemplateRows.js @@ -1,5 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('gridTemplateRows', [['grid-rows', ['gridTemplateRows']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('gridTemplateRows', [['grid-rows', ['gridTemplateRows']]])({ + config, + ...args, + }) + } } diff --git a/src/plugins/objectFit.js b/src/plugins/objectFit.js index 0bd4dcb1f..5c2b31c1c 100644 --- a/src/plugins/objectFit.js +++ b/src/plugins/objectFit.js @@ -1,14 +1,21 @@ export default function() { - return function({ addUtilities, variants }) { - addUtilities( + return function({ addUtilities, variants, target }) { + target( { - '.object-contain': { 'object-fit': 'contain' }, - '.object-cover': { 'object-fit': 'cover' }, - '.object-fill': { 'object-fit': 'fill' }, - '.object-none': { 'object-fit': 'none' }, - '.object-scale-down': { 'object-fit': 'scale-down' }, + ie11: () => {}, }, - variants('objectFit') + () => { + addUtilities( + { + '.object-contain': { 'object-fit': 'contain' }, + '.object-cover': { 'object-fit': 'cover' }, + '.object-fill': { 'object-fit': 'fill' }, + '.object-none': { 'object-fit': 'none' }, + '.object-scale-down': { 'object-fit': 'scale-down' }, + }, + variants('objectFit') + ) + } ) } } diff --git a/src/plugins/objectPosition.js b/src/plugins/objectPosition.js index 10cb8b18a..d55a9cc05 100644 --- a/src/plugins/objectPosition.js +++ b/src/plugins/objectPosition.js @@ -1,18 +1,25 @@ import _ from 'lodash' export default function() { - return function({ addUtilities, e, theme, variants }) { - const utilities = _.fromPairs( - _.map(theme('objectPosition'), (value, modifier) => { - return [ - `.${e(`object-${modifier}`)}`, - { - 'object-position': value, - }, - ] - }) - ) + return function({ addUtilities, e, theme, variants, target }) { + target( + { + ie11: () => {}, + }, + () => { + const utilities = _.fromPairs( + _.map(theme('objectPosition'), (value, modifier) => { + return [ + `.${e(`object-${modifier}`)}`, + { + 'object-position': value, + }, + ] + }) + ) - addUtilities(utilities, variants('objectPosition')) + addUtilities(utilities, variants('objectPosition')) + } + ) } } diff --git a/src/plugins/placeholderColor.js b/src/plugins/placeholderColor.js index 31b4eed62..b69291fe8 100644 --- a/src/plugins/placeholderColor.js +++ b/src/plugins/placeholderColor.js @@ -3,7 +3,19 @@ import flattenColorPalette from '../util/flattenColorPalette' import withAlphaVariable from '../util/withAlphaVariable' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + const utilities = _.fromPairs( + _.map(flattenColorPalette(theme('placeholderColor')), (value, modifier) => { + return [`.${e(`placeholder-${modifier}`)}::placeholder`, { color: value }] + }) + ) + + addUtilities(utilities, variants('placeholderColor')) + + return + } + const utilities = _.fromPairs( _.map(flattenColorPalette(theme('placeholderColor')), (value, modifier) => { return [ diff --git a/src/plugins/placeholderOpacity.js b/src/plugins/placeholderOpacity.js index 3164add62..b3e36357d 100644 --- a/src/plugins/placeholderOpacity.js +++ b/src/plugins/placeholderOpacity.js @@ -1,7 +1,11 @@ import _ from 'lodash' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + return + } + const utilities = _.fromPairs( _.map(theme('placeholderOpacity'), (value, modifier) => { return [ diff --git a/src/plugins/rotate.js b/src/plugins/rotate.js index f07c46f40..6313d781b 100644 --- a/src/plugins/rotate.js +++ b/src/plugins/rotate.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('rotate', [['rotate', ['--transform-rotate']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('rotate', [['rotate', ['--transform-rotate']]])({ config, ...args }) + } } diff --git a/src/plugins/scale.js b/src/plugins/scale.js index 9696ac6e1..4c086b5d4 100644 --- a/src/plugins/scale.js +++ b/src/plugins/scale.js @@ -1,9 +1,15 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('scale', [ - ['scale', ['--transform-scale-x', '--transform-scale-y']], - ['scale-x', ['--transform-scale-x']], - ['scale-y', ['--transform-scale-y']], - ]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('scale', [ + ['scale', ['--transform-scale-x', '--transform-scale-y']], + ['scale-x', ['--transform-scale-x']], + ['scale-y', ['--transform-scale-y']], + ])({ config, ...args }) + } } diff --git a/src/plugins/skew.js b/src/plugins/skew.js index 803aa57b3..f6d69cce4 100644 --- a/src/plugins/skew.js +++ b/src/plugins/skew.js @@ -1,8 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('skew', [ - ['skew-x', ['--transform-skew-x']], - ['skew-y', ['--transform-skew-y']], - ]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('skew', [ + ['skew-x', ['--transform-skew-x']], + ['skew-y', ['--transform-skew-y']], + ])({ config, ...args }) + } } diff --git a/src/plugins/textColor.js b/src/plugins/textColor.js index f792b5036..d6bcd9993 100644 --- a/src/plugins/textColor.js +++ b/src/plugins/textColor.js @@ -3,7 +3,19 @@ import flattenColorPalette from '../util/flattenColorPalette' import withAlphaVariable from '../util/withAlphaVariable' export default function() { - return function({ addUtilities, e, theme, variants }) { + return function({ addUtilities, e, theme, variants, config }) { + if (config('target') === 'ie11') { + const utilities = _.fromPairs( + _.map(flattenColorPalette(theme('textColor')), (value, modifier) => { + return [`.${e(`text-${modifier}`)}`, { color: value }] + }) + ) + + addUtilities(utilities, variants('textColor')) + + return + } + const utilities = _.fromPairs( _.map(flattenColorPalette(theme('textColor')), (value, modifier) => { return [ diff --git a/src/plugins/textOpacity.js b/src/plugins/textOpacity.js index a6ab50ffa..1ae4477a9 100644 --- a/src/plugins/textOpacity.js +++ b/src/plugins/textOpacity.js @@ -1,5 +1,11 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('textOpacity', [['text-opacity', ['--text-opacity']]]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('textOpacity', [['text-opacity', ['--text-opacity']]])({ config, ...args }) + } } diff --git a/src/plugins/transform.js b/src/plugins/transform.js index 10e80aa62..89a89a540 100644 --- a/src/plugins/transform.js +++ b/src/plugins/transform.js @@ -1,5 +1,9 @@ export default function() { - return function({ addUtilities, variants }) { + return function({ addUtilities, variants, config }) { + if (config('target') === 'ie11') { + return + } + addUtilities( { '.transform': { diff --git a/src/plugins/translate.js b/src/plugins/translate.js index 1a170163d..1ed42dddc 100644 --- a/src/plugins/translate.js +++ b/src/plugins/translate.js @@ -1,8 +1,14 @@ import createUtilityPlugin from '../util/createUtilityPlugin' export default function() { - return createUtilityPlugin('translate', [ - ['translate-x', ['--transform-translate-x']], - ['translate-y', ['--transform-translate-y']], - ]) + return function({ config, ...args }) { + if (config('target') === 'ie11') { + return + } + + createUtilityPlugin('translate', [ + ['translate-x', ['--transform-translate-x']], + ['translate-y', ['--transform-translate-y']], + ])({ config, ...args }) + } } diff --git a/src/util/processPlugins.js b/src/util/processPlugins.js index c0404a2d9..62ec32370 100644 --- a/src/util/processPlugins.js +++ b/src/util/processPlugins.js @@ -27,6 +27,9 @@ export default function(plugins, config) { return prefixSelector(config.prefix, selector) } const getConfigValue = (path, defaultValue) => _.get(config, path, defaultValue) + const target = (targets, defaultTarget) => { + return _.get(targets, getConfigValue('target'), defaultTarget)() + } plugins.forEach(plugin => { if (plugin.__isOptionsFunction) { @@ -38,6 +41,7 @@ export default function(plugins, config) { handler({ postcss, config: getConfigValue, + target, theme: (path, defaultValue) => getConfigValue(`theme.${path}`, defaultValue), variants: (path, defaultValue) => { if (Array.isArray(config.variants)) {