Group classes sharing the same modifier

[a2sc]

It could be nice and easier if we can write:

focus:(outline-none ring-2 ring-indigo-500 ring-offset-2)

Instead of:

focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2

This would also improve the readability of modified classes.

What do you think?

[wongjn]

There have been suggestions about adding such a feature. The maintainers have addressed this request before, that you may wish to read up on if you have not already done so:

• A Twitter thread from the creator of Tailwind, Adam Wathan
• A previous GitHub discussion thread with maintainer responses

[a2sc]

@wongjn Thanks for your answer and the reading links.

It’s very instructive to read the maintainer’s explanations about Adam Wathan’s answer.

It's now obvious to me that this wasn't a good idea… but I got so used to the magic of Tailwind that I forgot the fundamental principle which is the granularity of each class!