Responsive- and Pseudo-Class Variants

[buffalom]

Is anybody already working on sorting responsive- and pseudo-class variants. If not, then that's definitely something worth looking into I'd say.

Currently they're considered custom classes unless they're all also added to the defaultSortOrder config, right? Maybe it can be done with another config like defaultVariantSortOrder which describes the sort order used for each variant within one class/group.

For instance

"headwind.defaultVariantSortOrder": [
    "sm",
    "md",
    "lg",
    "xl",
    "hover",
    "focus",
    ...
]

would result in

class="mx-auto md:mx-2 bg-gray-800 hover:bg-gray-700"

This only works, if the classes are defined in groups so it knows that mx-auto should still go before mx-2 even though in the defaultSortOrder this might be configured differently.

Not yet quite sure how to properly achieve this. We probably just need a map from Tailwinds' config as described here already.

Isn't very well-thought-out yet but wanted to get that brainwork going. 🙂 Any ideas?

[akaibukai]

@Buffalom @heybourn

Currently they're considered custom classes unless they're all also added to the defaultSortOrder config, right?

Just to understand correctly, does it mean that currently variants aren't taken into account. And if I want to them sorted, I should add each prefix by making a combination (every combination possible with each variant) with that almost 2000 lines defaultSortOrder array?

Or do I miss something?

I'm also interested to sort classes including the variants...

[patrickquijano]

any updates on this? without adding all the default classes in the config.