101–106 of 106 posts
"Separation of concerns" is a straw man So true. That's why CSS-in-JS is awesome. Everything is in one component, nobody cares anymore if you need to edit markup AND styles.
Author of Tailwind here! If you haven't worked with a library like this before, I promise your gut reaction will be "holy hell this is the worst thing I've ever seen" (it was my reaction too!) You really do have to try it to shake that impression. If you need a bit more convincing before you're willing to try it, I wrote an in-depth article a while ago that documents my journey from a "semantic classes"-loving HTML/C…
Not really :) It might have been my reaction some 10 years ago, but right now I think it's quite good. I've done BEM, the atomic crap, OOCSS and what have you but to be honest nothing beats composition when it comes to rapid development. I used Bootstrap in the past, it was heavily customised for the project, and I ended up making it look very similar to your approach. It makes sense when you have 20 Devs working on a website and you don't want to end up having separate stylesheet for every page. Because business hates consistent design and always wants this and and that to stand out just on this one page. It should be easy, right? I look at your framework as an embodiment of understanding business driven development in a big team.
Earlier quoted context omitted.
CSS has 'vh' and 'vw' units too, changed my life.
'vmin' and 'vmax' too. I'm experimenting with using 'em' and % everywhere, base font size with 'vmin' and scaling font size with %. Works pretty well for scroll-less apps. Example: https://alvaro-cuesta.github.io/instant-trivia/
Don't go overboard, but a little offset can go a long way
Earlier quoted context omitted.
Wouldn't using em units be a better idea in most cases?
CSS has 'vh' and 'vw' units too, changed my life.
The solution is pointed above, even more classes for responsiveness.
Would be nice to see sample templates of what it all looks like in practice.
Some sample code on the doc site itself https://tailwindcss.com/docs/examples/cards/