4 ms·
HTML already has a button component. How is this better than creating a root CSS style for buttons using CSS variables to abstract the colors?
by moron4hire 2y ago
HTML already has a button component. How is this better than creating a root CSS style for buttons using CSS variables to abstract the colors?
- K0nserv 2y agoFor this contrived example it isn't better. I was very sceptical of tailwind before I tried it, but in certain scenarios it's nice. I think it shines if you are already using a component focused development process. As others have said you don't need to come up with class names for every thing you want to style. Rather than cross-reference between js/html files and css files everything (structure, style, and interactivity) is in one place. You also don't need to care about specificity. Personally I think it gets a bit mad when you start wanting to do :hover, :active and media queries, but you can still use classes (using the @apply directive) for that if you wish.
- Scarblac 2y agoThe root style is global to one app, the component may be used in many different apps.
- moron4hire 2y agoBut you can use CSS rules to override variable values for more specific selections. So you can define a global --primary-button-color at the root, apply it to every button, then override --primary-button-color in, say, `tool-container`.