CSS class sorting shouldn't sort if a razor tag is present.

[rwhitelaw]

The auto format that sorts class names works great, but if a razor tag is present, it sorts that to the front which can cause undesirable results. Here is a simple example:

<div class="text-gray p-4 @Css">Some content here</div>

becomes this when the file is saved

<div class="@Css p-4 text-gray">Some content here</div>

So if @Css was set to something like text-red, the final rendered html would have the dynamic css value sorted to the front which would then be overridden so the red would never be shown.

<div class="text-red p-4 text-gray">Some content here</div>

I think the desired outcome would be to not have any of the class names sorted if there is a presence of any non-tailwind class names. This would make sure if there are any dynamically generated elements using any kind of css concatenation, they would just be ignored during formatting. If all css values are tailwind classes, then formatting should work as it does now.

[theron-wang]

Thanks for letting me know, fixed in 1.3.2. Rather than disabling class sort when a non-Tailwind class is present, I opted to just maintain the same order when Razor is detected within (i.e. if there is a razor token at the second class, it will sort to the second class; if it is last, it will sort last as well), as it is difficult to know if a class is Tailwind or not especially with customization. If you run into any issues, please let me know!

[rwhitelaw]

Fantastic. Thanks!