Option to pass a --no-daisy flag when creating a new phoenix project

The Problem

Phoenix 1.8 comes aggressively coupled with Daisy UI, a decision which many developers in the community have had mixed feelings about.

While some agree that Daisy brings a lot of flexibility for quick and easy prototyping, there are many that are not happy with its look & how it cripples tailwind (sizes, color pallet etc)

Library maintainers are forced to provide 2 options for their UI elements- one with Daisy and one without it.

The mix phx.new command generates a web app with daisy- so there’s no option if anyone wants to opt out.

Migrating from a generated Daisy app to a pure tailwind app is a huge headache- as simply removing Daisy wont cut it. The generated core_components.ex & root.html.heex contain references to Daisy styles which will not work out of the box with tailwind, causing unexpected behavior in many cases. Its required to change all these styles manually.

Even the dark mode toggle won’t function as expected after deleting daisy.

From the time I’ve upgraded to Phoenix 1.8 release candidates, I’ve found myself using Daisy rarely, and migrating every time has became a nuisance.

Proposed Solution

I propose we allow a --no-daisy flag to be passed when creating a new project. This creates a phoenix app with just tailwind - allowing comfortable migration for developers who want to opt out.

This will be analogous to the existing --no-tailwind flag, which creates a project without any css framework.

Would love to work on this. Any suggestions or advice is welcome! :smiley:

7 Likes

I agree, I see the coupling with DaisyUI quite negatively.

I understand the need for a more comprehensive JS library, as many things are hard or impossible to do without a proper JS library (mostly animations).

But I always had a feeling of “understanding” of what was in my phoenix application, and with DaisyUI it seems way more opaque.

I am not against the integration, but I think the option should exist and perhaps even have an interactive prompt when generating a new app.

A post was split to a new topic: Is DaisyUI like bootstrap on top of Tailwind? Isn’t this the opposite of what Tailwind advocates?

I thought I mistakenly created another topic so I deleted it. Sorry I didn’t see that you intentionally did split my reply into another topic.

1 Like

No worries, it seems like a good candidate for a dedicated thread as you’re probably not the only one wondering where it fits. I’ve undeleted the thread - however we can delete it if you prefer :023:

I understand the need for a more comprehensive JS library, as many things are hard or impossible to do without a proper JS library (mostly animations).

DaisyUI 5 is pure CSS, there’s no JS involved.

I thought it was a JS library to manage transition and such. My bad. But I still think it should be optional.