Move forced-colors variant after dark variant (#12582)

Also add test for the order of the forced-colors variant
This commit is contained in:
Luke Warlow 2023-12-13 15:03:14 +00:00 • committed by GitHub
parent b3242e99ed
commit fb85c8fd17
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 9 additions and 1 deletions

View file

@ -758,8 +758,8 @@ function resolvePlugins(context, root) {
variantPlugins['directionVariants'],
variantPlugins['reducedMotionVariants'],
variantPlugins['prefersContrastVariants'],
variantPlugins['forcedColorsVariants'],
variantPlugins['darkVariants'],
variantPlugins['forcedColorsVariants'],
variantPlugins['printVariant'],
variantPlugins['screenVariants'],
variantPlugins['orientationVariants'],

View file

@ -300,6 +300,11 @@
:is(.dark .peer:disabled:focus:hover ~ .dark\:peer-disabled\:peer-focus\:peer-hover\:flex) {
display: flex;
}
@media (forced-colors: active) {
.forced-colors\:flex {
display: flex;
}
}
@media print {
.print\:flex {
display: flex;

View file

@ -121,6 +121,9 @@
<!-- Dark mode variants -->
<div class="dark:flex"></div>
<!-- Forced colors variant -->
<div class="forced-colors:flex"></div>
<!-- Print variant -->
<div class="print:flex"></div>