News for hackers. Stuff that matters.
[dead]
Re:Play with TailwindCSS in the Browser by config_yml on Friday June 10, 2022 @07:40AM (#31692671)
As someone who's been doing CSS for 20 years now, I think Tailwind is an absolute blessing. They've gone a bit crazy with the latest features, but the core of it is so productive to use, especially in teams. Big fan here.
Re:Play with TailwindCSS in the Browser by My90thaccount on Friday June 10, 2022 @08:42AM (#31693257)
Once again, productivity is not the ultimate goal of a profession. Your product is suffering in quality because you are taking shortcuts.
Re:Play with TailwindCSS in the Browser by config_yml on Friday June 10, 2022 @10:12AM (#31694497)
It's not, but it's important. And contrary to what you say, using Tailwind is productive for me AND increases quality. So that's a win for my product.
Re:Play with TailwindCSS in the Browser by kaba0 on Friday June 10, 2022 @10:10AM (#31694470)
Do you have any basis on claiming that the product suffers in quality from using tailwind?
Re:Play with TailwindCSS in the Browser by irrational on Friday June 10, 2022 @08:47AM (#31693320)
> They've gone a bit crazy with the latest features

Can you elaborate? What are the latest features?

Re:Play with TailwindCSS in the Browser by yurishimo on Friday June 10, 2022 @12:47PM (#31696535)
I think they are referring to custom values. As a part of the move to the JIT compiler, it's possible to define arbitrary classes and have Tailwind pick up on it and create a class.

Consider this. `text-red-500` is an out of the box class from TW that gives you a solid red text color. With the new JIT compiler, I can write `text-[#BADA55]` and the compiler is smart enough to generate a class with that hex code as the value for the color. You can use this syntax for almost any available class.

This feature is useful for some cases (marketing sites with finicky pixel perfect requirements) but it can also be abused. It's up to your team to decide where it makes sense to break out of the design system, or if you should add that new value as a token to be reused throughout the app.

Re:Play with TailwindCSS in the Browser by config_yml on Friday June 10, 2022 @10:15AM (#31694522)
Arbitrary Variants looks a bit crazy to me (I haven't used it yet though): https://github.com/tailwindlabs/tailwindcss/pull/8299
Re:Play with TailwindCSS in the Browser by criswell on Friday June 10, 2022 @12:02PM (#31695997)
I know it's going to be abused to hell like everything popular but definitely a useful power tool.

It'll be really nice for container queries when they're ready. Something like: `wider-than-[500px]:hover:text-red-500` and so on.

Also super nice for `:has` (although ordering is a concern at the moment): `[:has(:invalid)]:bg-red-500`.

Re:Play with TailwindCSS in the Browser by julianbuse on Friday June 10, 2022 @07:46AM (#31692717)
I agree that tailwind may not be the most elegant way to style a webpage, and I also prefer classes and regular css or sass, but I don't think you will convince anyone to give up tailwind with such a toxic comment. Perhaps it would just be better if you stopped ruining hn for the rest of us. Additionally, styling and accessibility are not related (unless your layout is terrible, but that is just as doable with css).
Re:Play with TailwindCSS in the Browser by dgb23 on Friday June 10, 2022 @07:43AM (#31692696)
That’s making a whole bunch of assumptions about professional web devs, including the people who maintain Tailwind and similar libraries.

Also accessibility and HTML classes are completely orthogonal concerns.

Re:Play with TailwindCSS in the Browser by EudaimonBlue on Friday June 10, 2022 @07:46AM (#31692722)
"People who know these things think tailwind is a travesty"

Sounds like people don't like changes to things that they are used to.

Overall Tailwind really does make styling cleaner.

Re:Play with TailwindCSS in the Browser by My90thaccount on Friday June 10, 2022 @08:16AM (#31693002)
It makes your job easier at the expense of the quality of your product.
Re:Play with TailwindCSS in the Browser by jonwinstanley on Friday June 10, 2022 @08:33AM (#31693148)
How does it affect quality?
Re:Play with TailwindCSS in the Browser by My90thaccount on Friday June 10, 2022 @08:43AM (#31693268)
Tailwind means making your HTML non-semantic, usually backed by JavaScript. This has created an arms race where parsers such as screen readers need to do ever-evolving heuristics to provide a reader mode. The code usually cannot be modified or even viewed in a readable form by users. Of all things, it's not user-centric.

You're going to tell me next that you have a JSON interface instead. But that's a site-specific API that's designed for vendor lock-in. You're going to find that doesn't work and need to create a universal format. And now you have completely recreated the problem HTML was intended to solve originally.

All of this wasted effort that web Devs do doesn't come from nowhere. The people with slow browsers or accessibility needs are absorbing your productivity gains 1:1.

Re:Play with TailwindCSS in the Browser by danielvaughn on Friday June 10, 2022 @08:59AM (#31693445)
I'm sorry but this doesn't make any sense at all, what on earth are you talking about? I'm all for constructive criticism, even if it's harsh, but this makes it sound like you've literally never read anything about Tailwind at all.

First, Tailwind has literally no opinion on whether your html is semantic or not. Second, it isn't "backed by javascript", that's nonsense and is just self-evidently not true. Third, "people with slow browsers" benefit because the CSS footprint is smaller. Fourth, the quality of the site improves with Tailwind because developers can spend their unused energy on other enhancements.

Why get on this thread and spew a bunch of bullshit? What's the point dude.

Re:Play with TailwindCSS in the Browser by EudaimonBlue on Friday June 10, 2022 @11:14AM (#31695313)
The JS part is just clean up the final result result of classes.

From what I've seen online using Tailwind over other frameworks like Styled Components, gives +5x speed ups. So it is not wasted effort.

> The code usually cannot be modified or even viewed in a readable form by users.

That's right, most of the time it is even minified. It' is not meant to be read by humans but by the browser. Poor accessibility is is a result of it not being prioritized designing/development of a product.

Re:Play with TailwindCSS in the Browser by kaba0 on Friday June 10, 2022 @10:16AM (#31694530)
Semantic web is a lie. HTML and CSS is not expressive enough in itself to pull that off - you are guaranteed to put many many divs purely for stylistic reason all around your website. Also, as mentioned there is nothing in tailwind requiring only divs, you can use any semantic tag you want, and the whole page can be completely static without an ounce of js..

At least know the topic you criticize.

Re:Play with TailwindCSS in the Browser by criswell on Friday June 10, 2022 @12:05PM (#31696033)
Looking forward to the takes on your 91st account.
Re:Play with TailwindCSS in the Browser by atonse on Friday June 10, 2022 @10:53AM (#31695045)
The semantic web feels like yet more yak shaving. Focus on adding value to people.

I know this cuz I was a big ra ra cheerleader for the semantic web 15 years ago.

But then I found it made no bloody difference in actually helping people.

I’d much prefer if we all spent our energy building better, smarter screen readers.

Re:Play with TailwindCSS in the Browser by jonwinstanley on Friday June 10, 2022 @10:21AM (#31694607)
Pretty sure you haven’t really looked at Tailwind.

It’s as semantic as you make it. And it works without JS.

Re:Play with TailwindCSS in the Browser by jozzy-james on Friday June 10, 2022 @03:21PM (#31698352)
class names have no bearing on semantics