custom css classes not applied somehow

Hi, i have this code:

<For each={alertsManager.getAlerts()}>
                        {(alert) => (
                            <div class={"flex alert alert-" + alert.type}>

<For each={alertsManager.getAlerts()}>
                        {(alert) => (
                            <div class={"flex alert alert-" + alert.type}>

alert.type is success and with daisyui and tailwindcss the div should have a green background color. However the div is colored like default just like alert-success wasnt there. If i manually add alert-success to the class prop it works. If I remove it after the concatinated version works somehow.. Can someone help me?

1 Reply

Greenman999OP•2mo ago

Ok i found the issue. Because the class was generated dynamically, tailwind couldnt find it and didnt compile the classes alert-.... To fix this I safelisted these classes in the tailwind config. https://tailwindcss.com/docs/content-configuration#safelisting-classes

Content Configuration - Tailwind CSS

Configuring the content sources for your project.

Gaming

Programming

custom css classes not applied somehow