5 ms·

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 tha

by usaphp 6y ago

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.

adamzapasnik 6y ago
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
- IggleSniggle 6y ago
  For the second one, couldn’t you get the same effect by just using css variables?
  - adamzapasnik 6y ago
    Sure you can and you should, right? But this way you have to write couple of classes more, couple of variables more. And with Tailwind you just define/change value in the config and you have all the classes generated, so the changes are minimal.
- usaphp 6y ago
  2. which values are you going to ever change in align-center, display-flex and text-color-white, it's not like you will change the display flex to mean display block or align center to mean align start, it will always be the same. Same with color white and 95% of other classes that tailwind uses.
davidwparker 6y ago
Quick FYI, py-2 is REM based, not pixel. So you know your design will fill properly.
mstipetic 6y ago
I used to think the same way until i tried it, now i'm completely hooked. it actually makes sense not to extract everything in a "class" simply to separate the presentation out, since that class probably isn't reusable. plus, it's mostly made to be used with vue/react components which should be small standalone units. I'm personally looking forward to building websites since using tailwind after a long time

by usaphp 6y ago

adamzapasnik 6y ago

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

IggleSniggle 6y ago
For the second one, couldn’t you get the same effect by just using css variables?
- adamzapasnik 6y ago
  Sure you can and you should, right? But this way you have to write couple of classes more, couple of variables more. And with Tailwind you just define/change value in the config and you have all the classes generated, so the changes are minimal.
usaphp 6y ago
2. which values are you going to ever change in align-center, display-flex and text-color-white, it's not like you will change the display flex to mean display block or align center to mean align start, it will always be the same. Same with color white and 95% of other classes that tailwind uses.

davidwparker 6y ago

Quick FYI, py-2 is REM based, not pixel. So you know your design will fill properly.

mstipetic 6y ago

I used to think the same way until i tried it, now i'm completely hooked. it actually makes sense not to extract everything in a "class" simply to separate the presentation out, since that class probably isn't reusable. plus, it's mostly made to be used with vue/react components which should be small standalone units. I'm personally looking forward to building websites since using tailwind after a long time