Custom prefix instead of animate__

[En3Tho]

addUtilities(
            [
                Object.entries(utilities).map(([key, value]) => {
                    return {
// "animate__" can be a custom variable here instead with "animate__" being a default value if custom is undefined.
                        [`.${e(`animate__${key}`)}`]: value, 
                    }
                })
            ]
        )

What do you think of this idea? Tailwind usually uses '-' as delimiter and I would really like to have things being consistent to one style.
Also, can you please tell me if there was something preventing you from just using "animated", "fadeIn" etc. styles without prefix? Because I would like to have "" prefix as a valid one too.

[bentzibentz]

Hi,

i used the prefix to prevent problems if the projects contains other libraries with same class names. But i get your point to make the class names more tailwind like:

.animated-fadeIn {}

or maybe even shorter:

.ani-fadeIn {}

The option to remove the prefix at all is also a good idea, maybe we could do something like this to make it optional:

// tailwind.config.js
module.exports = {
    theme: {
        animatedSettings: {
            useAnimatedClassName: true/false,
      }
    },
}

You are welcome to make a pull request.
If not i will have a look at it as soon as possible.