diff --git a/__tests__/fixtures/tailwind-output-ie11.css b/__tests__/fixtures/tailwind-output-ie11.css index 7e06186a7..ea5ce43fa 100644 --- a/__tests__/fixtures/tailwind-output-ie11.css +++ b/__tests__/fixtures/tailwind-output-ie11.css @@ -6133,6 +6133,42 @@ video { -webkit-overflow-scrolling: auto; } +.overscroll-auto { + overscroll-behavior: auto; +} + +.overscroll-contain { + overscroll-behavior: contain; +} + +.overscroll-none { + overscroll-behavior: none; +} + +.overscroll-y-auto { + overscroll-behavior-y: auto; +} + +.overscroll-y-contain { + overscroll-behavior-y: contain; +} + +.overscroll-y-none { + overscroll-behavior-y: none; +} + +.overscroll-x-auto { + overscroll-behavior-x: auto; +} + +.overscroll-x-contain { + overscroll-behavior-x: contain; +} + +.overscroll-x-none { + overscroll-behavior-x: none; +} + .p-0 { padding: 0; } diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css index c8c61c633..406488135 100644 --- a/__tests__/fixtures/tailwind-output-important.css +++ b/__tests__/fixtures/tailwind-output-important.css @@ -7813,6 +7813,42 @@ video { -webkit-overflow-scrolling: auto !important; } +.overscroll-auto { + overscroll-behavior: auto !important; +} + +.overscroll-contain { + overscroll-behavior: contain !important; +} + +.overscroll-none { + overscroll-behavior: none !important; +} + +.overscroll-y-auto { + overscroll-behavior-y: auto !important; +} + +.overscroll-y-contain { + overscroll-behavior-y: contain !important; +} + +.overscroll-y-none { + overscroll-behavior-y: none !important; +} + +.overscroll-x-auto { + overscroll-behavior-x: auto !important; +} + +.overscroll-x-contain { + overscroll-behavior-x: contain !important; +} + +.overscroll-x-none { + overscroll-behavior-x: none !important; +} + .p-0 { padding: 0 !important; } diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css index 14ab13e58..6a7c0f3f6 100644 --- a/__tests__/fixtures/tailwind-output-no-color-opacity.css +++ b/__tests__/fixtures/tailwind-output-no-color-opacity.css @@ -6385,6 +6385,42 @@ video { -webkit-overflow-scrolling: auto; } +.overscroll-auto { + overscroll-behavior: auto; +} + +.overscroll-contain { + overscroll-behavior: contain; +} + +.overscroll-none { + overscroll-behavior: none; +} + +.overscroll-y-auto { + overscroll-behavior-y: auto; +} + +.overscroll-y-contain { + overscroll-behavior-y: contain; +} + +.overscroll-y-none { + overscroll-behavior-y: none; +} + +.overscroll-x-auto { + overscroll-behavior-x: auto; +} + +.overscroll-x-contain { + overscroll-behavior-x: contain; +} + +.overscroll-x-none { + overscroll-behavior-x: none; +} + .p-0 { padding: 0; } diff --git a/__tests__/fixtures/tailwind-output.css b/__tests__/fixtures/tailwind-output.css index 064db9040..de92257bf 100644 --- a/__tests__/fixtures/tailwind-output.css +++ b/__tests__/fixtures/tailwind-output.css @@ -7813,6 +7813,42 @@ video { -webkit-overflow-scrolling: auto; } +.overscroll-auto { + overscroll-behavior: auto; +} + +.overscroll-contain { + overscroll-behavior: contain; +} + +.overscroll-none { + overscroll-behavior: none; +} + +.overscroll-y-auto { + overscroll-behavior-y: auto; +} + +.overscroll-y-contain { + overscroll-behavior-y: contain; +} + +.overscroll-y-none { + overscroll-behavior-y: none; +} + +.overscroll-x-auto { + overscroll-behavior-x: auto; +} + +.overscroll-x-contain { + overscroll-behavior-x: contain; +} + +.overscroll-x-none { + overscroll-behavior-x: none; +} + .p-0 { padding: 0; } diff --git a/src/corePlugins.js b/src/corePlugins.js index 41e2f79ab..74c989b9b 100644 --- a/src/corePlugins.js +++ b/src/corePlugins.js @@ -46,6 +46,7 @@ import objectPosition from './plugins/objectPosition' import opacity from './plugins/opacity' import outline from './plugins/outline' import overflow from './plugins/overflow' +import overscroll from './plugins/overscroll' import padding from './plugins/padding' import placeholderColor from './plugins/placeholderColor' import pointerEvents from './plugins/pointerEvents' @@ -155,6 +156,7 @@ export default function({ corePlugins: corePluginConfig }) { opacity, outline, overflow, + overscroll, padding, placeholderColor, placeholderOpacity, diff --git a/src/plugins/overscroll.js b/src/plugins/overscroll.js new file mode 100644 index 000000000..5ef010ae7 --- /dev/null +++ b/src/plugins/overscroll.js @@ -0,0 +1,18 @@ +export default function() { + return function({ addUtilities, variants }) { + addUtilities( + { + '.overscroll-auto': { 'overscroll-behavior': 'auto' }, + '.overscroll-contain': { 'overscroll-behavior': 'contain' }, + '.overscroll-none': { 'overscroll-behavior': 'none' }, + '.overscroll-y-auto': { 'overscroll-behavior-y': 'auto' }, + '.overscroll-y-contain': { 'overscroll-behavior-y': 'contain' }, + '.overscroll-y-none': { 'overscroll-behavior-y': 'none' }, + '.overscroll-x-auto': { 'overscroll-behavior-x': 'auto' }, + '.overscroll-x-contain': { 'overscroll-behavior-x': 'contain' }, + '.overscroll-x-none': { 'overscroll-behavior-x': 'none' }, + }, + variants('overscroll') + ) + } +}