Group classes under a modifier

[unlocomqx]

Hi,

I'm sure this is a duplicate because it looks kinda obvious (I searched but didn't find a similar discussion)

Instead of repeating a modifier many times, why not regroup the classes
Example

 <input type="file" class="file:mr-6 file:px-4 file:py-2"/>

becomes something like

<input type="file" class="file:(mr-6|px-4|py-2)"/>

This could be useful especially for more complex modifiers like lg:dark:hover:...

wdyt?
Thanks

[billriess]

If I recall correctly, space and comma are invalid characters in the spec.

[unlocomqx]

I forgot that the class should be compatible with the browser
I suggest maybe

<input type="file" class="file:(mr-6|px-4|py-2)"/>

[billriess]

IF this were to be added, I think it would follow the _ syntax used for arbitrary properties in Tailwind 3.0.

[JonathanFager]

I'd really like this but my prefered style would be

<input type="file" class="file(mr-6 px-4 py-2) />

Without putting too much thought into it, I see two ways of stacking.

<input type="file" class="file(mr-6 px-4 py-2 hover(bg-red-200)) />

or

<input type="file" class="file(mr-6 px-4 py-2) file:hover(bg-pink-300) />

I would suggest this also apply to breakpoints. I've found myself having real issue of keeping track of my styles when styling for mobile, tablet, laptop, desktop with having 4 slight variations of the same style.

<div class="flex flex-col md(flex-row)>

[unlocomqx]

I forgot that you can't have spaces in the class name, so I changed my suggestion.
Your idea is great too imo
It can become like this

<input type="file" class="file(mr-6|px-4|py-2|hover(bg-red-200)) />

[cjayyy]

Isn't there any solution to this by now? 🙏

[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

[cjayyy]

Thank you for the redirection, that pretty much sums it up. Hopefully soon the performance issue will get solved somehow. 🤞