I would recommend open props over tailwind. No special tooling, no JIT complexity, just straight up css variables / json tokens. You're also not stuck littering your markup with tailwind classes later that can become difficult to track down if you ever do want to refactor / change methods.
Play with TailwindCSS in the Browser
221–230 of 300 posts
Re: Play with TailwindCSS in the Browser
#222I would recommend open props over tailwind. No special tooling, no JIT complexity, just straight up css variables / json tokens. You're also not stuck littering your markup with tailwind classes later that can become difficult to track down if you ever do want to refactor / change methods.
cool, not sure how that works in PHP tho
Re: Play with TailwindCSS in the Browser
#223There is only two kinds of people. The ones that don't like Tailwind and the ones that have used it. I know it is conceptually "wrong" and a bunch of well crafted CSS classes would be more elegant. In the end it works, works really well and makes collaboration dead simple. Commonly used groups of classes can either be aliased by @apply or used in a (react) component. I used CSS way before Tailwind was a thing and in…
Yeah it freaks people out not used to the benefits of utility classes.
We're converting our app components to using Tailwind. But there was some initial resistance as the current setup of css-in-js was fine. Fine but not great, and we had ended up with a lot of weird custom css blobs over time.
One side benefit is you can just install Tailwind and use it in isolated way. Which is what I did. Converted a couple components to using Tailwind and demoed them. Got positive feedback. Most element only need a handful of classes. And the elements themselves are just normal HTML with a class.
Components feel quicker to scan now. Initially skeptical devs have noted the ease at which they can build out a new component. Without having to get bogged down in writing css.
Which to me is the real goal of Tailwind, improving DX by abstracting the boring and error prone way of writing CSS for applications.
Re: Play with TailwindCSS in the Browser
#224I used to be a Tailwind hater. I couldn't fathom why anyone would ever use it. And then I used it. It seriously makes CSS significantly easier to maintain, dramatically reduces your CSS build size, and is really good for teams if you're trying to use consistent CSS throughout your UIs. You also don't need to go back and forth between CSS file and HTML file. If you're on the fence, try it out. I think it's the future…
The future? Have you tried imba.io?
Re: Play with TailwindCSS in the Browser
#225I used to be a Tailwind hater. I couldn't fathom why anyone would ever use it. And then I used it. It seriously makes CSS significantly easier to maintain, dramatically reduces your CSS build size, and is really good for teams if you're trying to use consistent CSS throughout your UIs. You also don't need to go back and forth between CSS file and HTML file. If you're on the fence, try it out. I think it's the future…
I completely disagree. To fix the css + jsx in one file, just write your styled components at the bottom of your component. If you ever seen a react component completely riddled with Tailwind, you'll realize how messy and uncoordinated it looks. Even I would consider switching between two files just to avoid that style of css. Furthermore the necessity to utilize horizontal scroll because adding 10+ more rules will i…
your vanilla CSS doesn't actually work the same since the second transform overrides the first one
Re: Play with TailwindCSS in the Browser
#226Every time I see TailwindCSS code I feel like the world has gone crazy or I've just got too old.
or you might just be working on stuff where the abstractions don't provide a lot of benefit.
Re: Play with TailwindCSS in the Browser
#227Earlier quoted context omitted.
> It's so clear, so elegant. The thesis of Tailwind is that the cascade actually becomes very unclear and inelegant at scale, and I would say the reason it's so popular is that many devs share that experience.
Cascading is excellent for websites. Terrible for applications. There's no concept of anything even remotely similar in any other UI technology. Native applications have use the "scoped component" paradigm for decades, and the web is finally catching up.
This is the crux of it really. It makes a whole lot of sense to have cascading styles in documents. I don’t want to have to explicitly set a text colour for each individual paragraph.
But the opposite is largely true for UI elements. For one, I’m probably using some external templating or component framework to repeat them, because they mostly likely have behaviour attached and HTML by itself has no good story for that. For two, I pretty much never want their styling to be modified by the context in which they’re used.
Re: Play with TailwindCSS in the Browser
#228Earlier quoted context omitted.
How does it affect quality?
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 A…
class names have no bearing on semantics
Re: Play with TailwindCSS in the Browser
#229There is only two kinds of people. The ones that don't like Tailwind and the ones that have used it. I know it is conceptually "wrong" and a bunch of well crafted CSS classes would be more elegant. In the end it works, works really well and makes collaboration dead simple. Commonly used groups of classes can either be aliased by @apply or used in a (react) component. I used CSS way before Tailwind was a thing and in…
Two kinds of people -- and me, apparently. Because I'm obliged to use it occasionally and it's as if 90s html never went away.
Re: Play with TailwindCSS in the Browser
#230I used to be a Tailwind hater. I couldn't fathom why anyone would ever use it. And then I used it. It seriously makes CSS significantly easier to maintain, dramatically reduces your CSS build size, and is really good for teams if you're trying to use consistent CSS throughout your UIs. You also don't need to go back and forth between CSS file and HTML file. If you're on the fence, try it out. I think it's the future…
It's really for the React generation. People used to embedding the code, markup and style all in one file. I've tried multiple times to use it, but I always end up using something like bootstrap. Funnily enough, I paid for tailwindui and take the styles and reproduce them in bootstrap css. Bootstrap community seems to have given up. They only want to sell templates. The default is ugly. Sometimes I think about going…
If you're using React, check out Material UI. I was a big fan of Bootstrap, but I didn't like that there was still so much for me to build. MUI comes with components for things like user avatars out of the box. But it doesn't get in the way at all either, it's very customizable at the theme and the component level (I'm using it with styled components, and I love not having to come up with class names for everything). I've also tried Antd and it's impossible to customize.