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

TailwindCSS v2.0

blog.tailwindcss.com

Post reply on HN
Print view View original

101–110 of 474 posts

Re: TailwindCSS v2.0

#101

Post by aidos »

lemonberry wrote: post #23

The things I love the most about TailwindCSS: 1. After purged the CSS file is really, really small. 2. Hopping into all of my projects and not having to remember new class names. 3. Not having to come up with new class names. 4. Not worrying about making a change in a class and having unintended consequences. 5. Not skipping back and forth between HTML or CSS files. That said, if you don't dig it, there are plenty of…

I’ve been keeping an eye on Tailwind. Over the last few years we’ve switched from old school single css file to css in js, and while that helps with the class spread issues, by lots of other measures it’s inferior. This was solidified for me last week when we rebranded our app and I needed to hack in both new and old code. Editing is js controlled css in the browser is just too painful.

Anyway, couple of weeks back I needed to make a website for a mate and decided I’d give tailwind a spin. My god does it make css fun again. I’m not sure how you look after sprawling styles in a bigger app (though I’m sure I’ll figure something out) but having the right combination of safe css, everything right there and responsive styling locally is a dream. I’m totally sold.

Re: TailwindCSS v2.0

#102

Post by Ralfp »

CapriciousCptl wrote: post #8

> Incompatibility with IE11, so you can tell the man upstairs "sorry boss it's out of my hands, blame Tailwind" For those who don't know, IE11 is the last major release of IE. Between a major frontend framework feeling confident dropping IE, and Apple dropping Intel it kind of feels like the end of an era.

I have a Windows 7 machine around that used to run IE 11, but one day it silently updated that to "Edgium", which is great.

Re: TailwindCSS v2.0

#103

Post by nfRfqX5n »

timdorr wrote: post #27

For those complaining about dense HTML using Tailwind, the headline feature of 2.0 should be @apply for everything: https://tailwindcss.com/docs/functions-and-directives#apply It lets you move all of those excessive class attributes into your CSS, where it realistically belongs. And that makes your CSS look a little more like CSS. But you get guard rails on it by applying a known set of properties to each rule. It's…

using @apply adds all of those properties and values into a new css class right? you're adding extra lines to your bundle

Re: TailwindCSS v2.0

#104

Post by k__ »

HEHENE wrote: post #68
k__ wrote: post #42

Half-OT: Are there good UI toolkits out there based on Tailwind? I read it is really flexible, but I don't want to start from zero. Most of the time I want to throw some pre-made UI components together and then sprinkel them with customizations when required.

Tailwind themselves offer a paid one called TailwindUI[0]. It's still in early access, and I commonly run up against components that are missing and I have to devise a style for myself, but it provides a pretty good starting point for building out a clean looking web app. [0] https://tailwindui.com/

Pretty nice, thanks!

Re: TailwindCSS v2.0

#105

Post by [deleted] »

seancoleman wrote: post #52

"Incompatibility with IE11, so you can tell the man upstairs 'sorry boss it's out of my hands, blame Tailwind'..." I know it's said tongue-in-cheek, but popular frameworks taking this stance is valuable when convincing clients, leaders, authority, etc. to not require IE support. I've consulted on dozens of front-end projects, and showing the stance of "industry leaders" is the most convincing argument.

[deleted]

Re: TailwindCSS v2.0

#106

Post by IggleSniggle »

adamzapasnik wrote: post #85
usaphp wrote: post #76

Earlier quoted context omitted.

that's ridiculous, why not just write padding: 2px 5px; display: flex; align-items: center; color: #fff; You are basically just creating a set of attributes that just mimic standard css properties, I find this approach of tailwind absolutely counter productive, and I am surprised that it gets so much popularity.

I think there are two reasons: - you can copy the classes from html directly into @apply (you need to tinker a bit more to get responsive/hover/etc classes to work, though) - you work with predefined values, so if you switch color in tailwind.config.js, it's gonna get correct value in the @apply class too. That's the way I see it

For the second one, couldn’t you get the same effect by just using css variables?

Re: TailwindCSS v2.0

#107

Post by Scarbutt »

jwr wrote: post #88
damnencryption wrote: post #15

Earlier quoted context omitted.

You can use postcss and @apply tag to compose single classes that you can use in your html code like .btn-blue .btn-blue { @apply py-2 px-5 flex items-center bg-blue-500 text-white rounded } So I don't really see that as a problem. You are supposed to refactor your styles later to be more reusable. What tailwind provides is fast iteration and design. I love that.

You mean that @apply tag? https://caniuse.com/css-apply-rule That is supported by 0% of browsers? Or am I missing something?

you missed reading 'postcss'

Re: TailwindCSS v2.0

#108

Post by samuelstancl »

timdorr wrote: post #27

For those complaining about dense HTML using Tailwind, the headline feature of 2.0 should be @apply for everything: https://tailwindcss.com/docs/functions-and-directives#apply It lets you move all of those excessive class attributes into your CSS, where it realistically belongs. And that makes your CSS look a little more like CSS. But you get guard rails on it by applying a known set of properties to each rule. It's…

> It lets you move all of those excessive class attributes into your CSS, where it realistically belongs

No. Adam said multiple times that he basically added the feature to make onboarding people smoother.

The right way to use Tailwind is to extract components, for example in Vue.

That way you have the markup, behavior, and styling in self-contained in a single file, that can be used anywhere, without leaking any internal implementation details.

Re: TailwindCSS v2.0

#110

Post by lhnz »

seancoleman wrote: post #52

"Incompatibility with IE11, so you can tell the man upstairs 'sorry boss it's out of my hands, blame Tailwind'..." I know it's said tongue-in-cheek, but popular frameworks taking this stance is valuable when convincing clients, leaders, authority, etc. to not require IE support. I've consulted on dozens of front-end projects, and showing the stance of "industry leaders" is the most convincing argument.

At this point even JIRA and Microsoft 365 have dropped support for IE11. The majority of big corporates have either moved to Chrome or are hurriedly doing so.

However, there are presumably old computers in far-off corners of the world that still use IE11. I wonder what will happen there...

Post reply on HN