Responsive modifiers interfer with color modifiers

[hanneskaeufler]

Preface: You guys rock for making this, merry christmas, take some days off! 👍🏽

It appears the color modifiers get overruled by the responsive breakpoints, because the responsive breakpoints include link colors as well and win over the simple color modifiers (css specificity?).

I have made this playground which copy&pastes the responsive example from the readme and slaps on a prose-purple for good measure. Note that the link is not purple.

https://play.tailwindcss.com/gn3tZloO8a?size=1144x665

Could be related to #118 and #64

[adamwathan]

Hey thanks! Yeah this is a sort of annoying one, the issue is that you need to use sm:prose to change the size, but that also changes the color (this is only true of the prose class, no other prose modifiers change both color and size).

For now the workaround is to add sm:prose-indigo as well, you'll notice that's the only one you have to add and that the other breakpoints still work fine. Not sure if this is easily "fixable" honestly, no matter what there will be ambiguity in what should happen I think.

[hanneskaeufler]

Mhm, could we split up prose into prose prose-monochrome (prose-black ... prose-default ... uuugh dunno, you get the drift) or something like that? Could still be easily explained in the docs I guess and keep sizing and colors nicely separated?

[adamwathan]

Going to close this as no concrete plans to make changes here right now (just have other priorities and there is a straightforward user-land solution here).