nebulab / erb-formatter

Format ERB files with speed and precision
MIT License
135 stars 22 forks source link

Fix order of classes starting with digits in tailwindcss class sorter #58

Open enescakir opened 1 month ago

enescakir commented 1 month ago

CSS classes cannot begin with digits. For this reason, Tailwind uses \3 to escape them. For instance, 2xl:col-span-10 is transformed into .\32xl\:col-span-10 { grid-column: span 10 / span 10; } in the final CSS file.

https://github.com/tailwindlabs/tailwindcss/issues/3069

The current Tailwind CSS class sorter implementation does not handle this correctly. As it cannot identify suitable classes beginning with digits, it places them at the start of the sorted list.

Expected output:

divide-y divide-gray-200 lg:col-span-8 xl:col-span-9 2xl:col-span-10 pb-10

Current output:

2xl:col-span-10 divide-y divide-gray-200 pb-10 lg:col-span-8 xl:col-span-9

I simply remove the escape characters from the class name.

enescakir commented 1 month ago

Hi @elia, do you have any reviews for this PR?