egoist / tailwindcss-icons

Use any icon (100,000+) from Iconify, for TailwindCSS
MIT License
830 stars 17 forks source link

Using `:` as separator #39

Closed zcf0508 closed 5 months ago

zcf0508 commented 5 months ago

I check the source code and find that the dynamic plugin support using : as separator.

https://github.com/egoist/tailwindcss-icons/blob/main/src/dynamic.ts#L23

const nameParts = icon.split(/--|\:/)

But when I write a class like i-[mdi:home] or hover:i-[mdi:home], the plugin does not generate the css code. And I change the class to i-[mdi--home] and hover:i-[mdi--home], the plugin works fine.

hyoban commented 5 months ago

Sorry, you cannot use : as delimiter, because i-[mdi:home] is not a valid selector.

You can try it at https://www.cssportal.com/css-validator