Skip to content
This repository has been archived by the owner on Dec 15, 2021. It is now read-only.

[Suggestion] use "classnames" to handle conditional styling and theming #1

Open
Hahlh opened this issue Apr 11, 2021 · 0 comments
Open
Labels
enhancement New feature or request

Comments

@Hahlh
Copy link

Hahlh commented Apr 11, 2021

Classnames (the package) allows to easily do conditional styling especially in combination with Tailwind. With 6.7 million weekly downloads it's also save to say that it's save to use.

A codesandbox example

Code written that way is easy to understand, easy to change and can be also extended in many ways.

Existing classNames can easily be merged with props that are passed down (with nice specificity overrides).
ClassNames can be grouped through the usage of variables or imports.

The repos switch statements could also transformed into returning or accessing list of classNames which then could be merged with a simple cx() instead of constructing tailwind classes, which could lead to them being purged, if those classes aren't used anywhere else in full.

Also, with eliminating the need for adding spaces with string concatenation or interpolation, you have one source less for errors that take out two classes at a time and fail silently.

There is also a typed version of classnames specifically for tailwind, although I personally prefer the untyped version for the moment.

@hbjydev hbjydev added the enhancement New feature or request label Apr 11, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants