If it's a new Waterhole project, there is a CSS entry point at resources/css/waterhole/app.css. If it's a Laravel project and you pulled in Waterhole as a package, the CSS entry point would be here resources/css/app.css. Assuming all settings were kept as default.
However, I'm not sure if Tailwind classes would interfere with Waterhole's Design System. Maybe
@Toby could clarify that.
Edit: Unless I misunderstood your question, and you wanted to use TailwindCSS instead of Waterhole's Design System?
Also, you can add your own CSS files via Waterhole\Extend, see docs for more info.
So I kinda tried doing this recently and it wasn't as straight forward as just pointing to the CSS entry point where the Tailwind directives are in my app.css. I'm using Laravel 11 and I'm pulling in Waterhole into my app. I think the issue I'm having is that v11 uses Vite and Waterhole doesn't. I tried to set up Laravel mix and have basically 2 tailwinds but that felt hacky. I also played with the idea of using a cdn for Tailwind but that would be bad for performance. I'm new to Laravel and just got Waterhole setup and running in my app. I would love for someone smarter than me to help me get Tailwind working with Waterhole
I agree - my app also uses laravel 11 and the mix-generated CSS was being included in places that didn't work for my app. I looked at the waterhole repo and haven't seen any commits in the past 5 months - so Toby's hiatus is a long one. I went ahead and forked the repo and asked cursor to replace mix with vite. I've pushed my changes to my local fork: https://github.com/ElvisIsKing666/waterhole-core - you're welcome to take a look.
Development
3 Comments
Yeah, you should be able to use TailwindCSS.
If it's a new Waterhole project, there is a CSS entry point at
resources/css/waterhole/app.css. If it's a Laravel project and you pulled in Waterhole as a package, the CSS entry point would be hereresources/css/app.css. Assuming all settings were kept as default.However, I'm not sure if Tailwind classes would interfere with Waterhole's Design System. Maybe @Toby could clarify that.
Edit: Unless I misunderstood your question, and you wanted to use TailwindCSS instead of Waterhole's Design System?
Also, you can add your own CSS files via
Waterhole\Extend, see docs for more info.So I kinda tried doing this recently and it wasn't as straight forward as just pointing to the CSS entry point where the Tailwind directives are in my app.css. I'm using Laravel 11 and I'm pulling in Waterhole into my app. I think the issue I'm having is that v11 uses Vite and Waterhole doesn't. I tried to set up Laravel mix and have basically 2 tailwinds but that felt hacky. I also played with the idea of using a cdn for Tailwind but that would be bad for performance. I'm new to Laravel and just got Waterhole setup and running in my app. I would love for someone smarter than me to help me get Tailwind working with Waterhole
I agree - my app also uses laravel 11 and the mix-generated CSS was being included in places that didn't work for my app. I looked at the waterhole repo and haven't seen any commits in the past 5 months - so Toby's hiatus is a long one. I went ahead and forked the repo and asked cursor to replace mix with vite. I've pushed my changes to my local fork: https://github.com/ElvisIsKing666/waterhole-core - you're welcome to take a look.