4 ms·
You can quickly create a .primary-button (or whatever) class where you group all the Tailwind classes with an @apply. Then just add primary-button wherever you
by imilk 3y ago
You can quickly create a .primary-button (or whatever) class where you group all the Tailwind classes with an @apply. Then just add primary-button wherever you want.
https://tailwindcss.com/docs/reusing-styles#extracting-classes-with-apply https://tailwindcss.com/docs/reusing-styles#extracting-class...
I'd also add that the code in the Tailwind example is much easier to maintain and jump in on. It describes everything going on without you having to cross-reference a separate CSS doc with all of the actual meaning hidden in it. Joining a new project with 1000+ line CSS files + media queries randomly added throughout is a horrendous experience.
- berkle4455 3y agois @apply a preprocessor thing? does CSS still not have a native way to do multiple inheritance/traits?
- imilk 3y agoYou can use CSS preprocessors such as Sass that have inheritance. But most people doing front end design these days separate out design elements into components, which pretty much completely handles the re-usability of the underlying CSS. But @apply is useful for smaller elements used across components like buttons, form elements, headings, etc.