From add51c658cce597fa0a5404b25a3f52dbdcefc45 Mon Sep 17 00:00:00 2001 From: Luke Warlow Date: Thu, 2 Nov 2023 19:28:50 +0000 Subject: [PATCH] Add `forced-colors` variant (#11694) * Add forced-colors variant Also add a contrast-custom variant to match custom contrast preferences * use `toMatchSnapshot` instead of `toMatchFormattedCss` More info: https://github.com/tailwindlabs/tailwindcss/pull/12170 * remove `contrast-custom` variant * move `forcedColorsVariants` next to `prefersContrastVariants` * update changelog --------- Co-authored-by: Robin Malfait --- CHANGELOG.md | 1 + src/corePlugins.js | 4 ++++ src/lib/setupContextUtils.js | 1 + 3 files changed, 6 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e77ef13f7..5c6810c28 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Add utilities for CSS subgrid ([#12298](https://github.com/tailwindlabs/tailwindcss/pull/12298)) - Add spacing scale to `min-w-*`, `min-h-*`, and `max-w-*` utilities ([#12300](https://github.com/tailwindlabs/tailwindcss/pull/12300)) - Add `forced-color-adjust` utilities ([#11931](https://github.com/tailwindlabs/tailwindcss/pull/11931)) +- Add `forced-colors` variant ([#11694](https://github.com/tailwindlabs/tailwindcss/pull/11694)) ## [3.3.7] - 2023-12-18 diff --git a/src/corePlugins.js b/src/corePlugins.js index 7f4aa6a9c..9e7eb9b70 100644 --- a/src/corePlugins.js +++ b/src/corePlugins.js @@ -461,6 +461,10 @@ export let variantPlugins = { addVariant('contrast-more', '@media (prefers-contrast: more)') addVariant('contrast-less', '@media (prefers-contrast: less)') }, + + forcedColorsVariants: ({ addVariant }) => { + addVariant('forced-colors', '@media (forced-colors: active)') + }, } let cssTransformValue = [ diff --git a/src/lib/setupContextUtils.js b/src/lib/setupContextUtils.js index 4fc8468a4..28991dc83 100644 --- a/src/lib/setupContextUtils.js +++ b/src/lib/setupContextUtils.js @@ -767,6 +767,7 @@ function resolvePlugins(context, root) { variantPlugins['directionVariants'], variantPlugins['reducedMotionVariants'], variantPlugins['prefersContrastVariants'], + variantPlugins['forcedColorsVariants'], variantPlugins['darkVariants'], variantPlugins['printVariant'], variantPlugins['screenVariants'],