[darkhorse13]

This is really great, and I'm really happy people are finally waking up to this. I've stuck with Django through all of this and never looked back. Nowadays with stuff like HTMX, things have never been better!

Could we do this for CSS-in-JS next please? With React 18 making a strong push for compiled CSS, we have libraries now that let you write CSS (compiled) using Typescript. This is also absolutely crazy to me because we COULD BE JUST WRITING CSS instead (especially with variable support).

[cutler]

CSS has been mangled so many different ways, including the loathsome Tailwind, that I can't imagine what a newb web dev has to plough through these days. Some of us with longer memories were overjoyed to see browsers finally adopting standards after the erosion of Microsoft's reign but now it appears we're intent on destroying the value of what we waited 15 years for. Fer Kreissakes just write raw, unadulterated CSS and enjoy your freedom from the CSS hacks that were unavoidable back in the late 90s/early 2000s.

[beezlewax]

Refreshing to see someone else who hates Tailwind. It's a nightmare.

[naasking]

Haha, I love Tailwind and Tachyons! Writing CSS is still a PITA.

[cutler]

The worst Tailwind I've seen is HTML littered with a, a:hover etc. declarations on every hyperlink. OK, you can create a global Tailwind stylesheet in your config but doesn't that defeat Tailwind's purpose?

[brycewray]

According to Adam Wathan himself in 2020, yes, it does:

https://twitter.com/adamwathan/status/1226511611592085504

[cutler]

Oh, and that's discounting responsive breakpoints. So if you have 3 of those that can be 3 lots of a, a:hover etc. for every hyperlink. You couldn't make this up.

[pydry]

What do you prefer & why?

As a somewhat outsider to CSS I look at tailwind and don't feel excited but I do wonder if thats as good as it gets.

[cutler]

I prefer CSS. We even have browser support for CSS variables now so what else do you need? Tailwind wipes out half of the features of CSS and replaces them with mindless inline repetition and bloat all in the name of convenience. I call it inconvenience and refuse to work on Tailwind projects.

[Zababa]

> We even have browser support for CSS variables now so what else do you need?

Not writing CSS in a different file and have it applied to all my page would be a start. Creating a class for each different component and then writing CSS for that component is not really great. I like the Svelte way where you have your components that have HTML, CSS and JS, and some global CSS too.

[komali2]

> Not writing CSS in a different file and have it applied to all my page would be a start.

Are you saying you do or don't want CSS in a different file? You can have whichever you please. You can put your CSS in style tags on an html document if you want, or use javascript to inject a style tag wherever, that you can write inside a template string, I guess. Depending on whatever templating language system you're using, you can put css in that language's version of style blocks, such as in React or Vue I've seen .jsx or .vue files with blocks of styling code in them (usually just option 2 above with sugar, using js to inject a style tag).

> Creating a class for each different component and then writing CSS for that component is not really great.

You can use CSS variables and basic rules to combine styles if you'd like? I'm not exactly sure what you mean. I mean, the styles cascade, what are you trying to accomplish that can't be done easily by using a universal rule to apply some baseline fonts or what have you?

[earthling8118]

From what I can tell, this is a very common take. Especially on this site.

[Kiro]

Wow, I truly hope you are wrong. Non-scoped CSS where you have to come up with names for everything and that doesn't live right next to the markup in the same file as the component is the worst. The whole cascading part is also something I hope I never have to deal with again with conflicting styles being inherited and overridden all over the place. Just let me isolate everything and let me freely copy a component file with all styling included without relying on any global CSS.

[jstummbillig]

What do you do to keep your inter component styling in sync?

[darkhorse13]

In my experience, this is usually solved with more TS/JS abstractions, something like global theming. Often they are hacky and poorly implemented, and always they are leaky.

[di4na]

I have a whole piece coming down the pipeline on this.

I think a huge reason the js crowd got away with the "better DX" spiel is because CSS got left on the side.

So doing it CSS-in-JS allowed to paper over the CSS painpoint for componentisation and composition.

If you look at it this way, Tailwind make sense. Because what it gives you is mixins and variable. Just... Mixins in html `class`