Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

DaisyUI: Tailwind CSS Components

daisyui.com

Post reply on HN
Print view View original

131–140 of 181 posts

Re: DaisyUI: Tailwind CSS Components

#131

Post by wrs »

Calavar wrote: post #26
sudhirj wrote: post #10

This is a rebuild of the antithesis of Tailwind on Tailwind. Bootstrap had this for decades (Daisy even copies the same semantic class names in some cases). Tailwind was supposed to break away from this, to specific actual styles directly, but looks like we're coming back full circle again. Why not just use Bootstrap?

Tailwind is already a full circle. It is essentially a toolkit for using CSS to emulate the pre-CSS era approach of putting styling info inside attributes on the markup (remember the HTML2 days of bgcolor and cellpadding?).

Don’t forget it adds the “feature” of a build step that literally greps the source code to see which style shortcuts you used, or seemed to use, so it can render them into CSS definitions so they can be turned back into inline styles.

Re: DaisyUI: Tailwind CSS Components

#132

Post by gizzlon »

varbhat wrote: post #53

I don't like the way how Daisy UI looks. But, I do like the way how Bootstrap or Semantic-UI CSS frameworks look. Has anyone tried to recreate the components of Bootstrap or Semantic UI using Tailwind CSS (including the looks)?

Why not use Bootstrap or Semantic-UI?

See they have actually updated Bootstrap =)

Re: DaisyUI: Tailwind CSS Components

#133

Post by wrs »

Tailwind gives me the same feeling of impotent nerdrage that Helm does. In both cases, as soon as I figured it what it was really doing, I was like, no. This is just…wrong.

(I’m sure people find it useful in some way, despite that.)

Re: DaisyUI: Tailwind CSS Components

#134

Post by dang »

Related:

DaisyUI: The most popular component library for Tailwind CSS - https://news.ycombinator.com/item?id=38978290 - Jan 2024 (1 comment)

My Journey to build daisyUI: Why Tailwind CSS was not enough? - https://news.ycombinator.com/item?id=38727252 - Dec 2023 (16 comments)

DaisyUI – Tailwind CSS Components - https://news.ycombinator.com/item?id=28004515 - July 2021 (166 comments)

Re: DaisyUI: Tailwind CSS Components

#135

Post by intrasight »

sgt wrote: post #73

For those interested in how to use this with HTMX, read on. DaisyJS supports HTMX as it can work with just plain HTML without needing a fancy JS framework like Vue or React. You start by setting up something that can serve HTML and with a template engine. My favorite is Django. You also need daisyui, tailwindcss etc in a local NodeJS dir. Those parts aren't too hard, I'll skip over it. Now you make sure you build a s…

Any repos or articles you can reference that further explore this approach?

Re: DaisyUI: Tailwind CSS Components

#136

Post by cheald »

90s_dev wrote: post #119
cheald wrote: post #55

Earlier quoted context omitted.

I've been writing CSS by hand since the late 90s. I resisted Tailwind for a long time, but I tried it on a pet project and I get it now. It doesn't fundamentally do anything that you can't do in CSS already, but it sort of "quantizes" the DX such that the vast majority of the CSS you'd usually end up writing boils down to a set of conventions. You can still write your own CSS as needed (and probably should, for some…

Right but it comes after a long line of similar CSS frameworks with the same promise, starting with Bootstrap, and there were large movements about 10 years ago of whole orgs deserting those frameworks because of serious issues. Are you saying Tailwind somehow has resolved those? That was the main reason I didn't try to learn it considering it to be just yet another CSS framework's conventions.

Tailwind solves a somewhat different problem. It's maybe easiest to think of it as a bunch of aliases for writing inline styles. The fundamental problem with CSS at scale is leaky abstractions, right? Tailwind moves the abstractions down a level, so that rather than attaching semantic classes, you're just composing the properties of an element directly, except you don't have to remember if you used px or rem for this padding, or what the media query for a mobile breakpoint is. This tends to reduce the incidence of high-gravity classes which tend to accumulate features, at the cost of some verbosity vs something like Bootstrap, though it's significantly less verbose than equivalent inline styles would be.

Re: DaisyUI: Tailwind CSS Components

#137

Post by kolanos »

A bit baffled by all the "Why not just use CSS?" comments here.

Did we forget how much of a pain CSS still is?

For example, I recently made a UI with a series of numbered steps. To the left of each step is a number with a circle around it as a highlight.

The CSS I came up with looked like this:

.step-number { align-items: center; background-color: #0074cc; border-radius: 50%; color: white; display: flex; font-size: 14px; font-weight: bold; height: 24px; justify-content: center; line-height: 24px; margin-right: 10px; width: 24px; }

Did it produce a circle? Of course not. It produced a squished egg shape.

What did I have to do? I had to add "min-width: 24px;" to the class. Why? Hell if I know. "width: 24px;" should've done the job.

Bootstrap (and now Tailwind) exist for a reason: CSS still sucks.

Re: DaisyUI: Tailwind CSS Components

#140

Post by sgt »

intrasight wrote: post #135
sgt wrote: post #73

For those interested in how to use this with HTMX, read on. DaisyJS supports HTMX as it can work with just plain HTML without needing a fancy JS framework like Vue or React. You start by setting up something that can serve HTML and with a template engine. My favorite is Django. You also need daisyui, tailwindcss etc in a local NodeJS dir. Those parts aren't too hard, I'll skip over it. Now you make sure you build a s…

Any repos or articles you can reference that further explore this approach?

Not really. I think I'll do that and put it on my Medium or something.
Post reply on HN