-
-
Notifications
You must be signed in to change notification settings - Fork 38
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Mixing multiple classes with nested selectors can lead to undesired output #175
Comments
Hi @andrezzoid, Thanks for reaching out and puting together a clear reproduction repo. Best I can do from where I stand is offer you to use TSS's nested selector featur. See it implemented on your sandbox: Beyond that, Best, |
Mixing multiple classes in an element with the
cx
function oftentimes seems to lead to classes being merged into one big class with all the styled mixed together.An example can be seen in the screenshot below where the top element had two classes applied to it,
title
andbigTitle
, now merged together into a single class. The bottom element had only thetitle
class applied to it.This behaviour can ruin the expected output when, for instance, nested
&
selectors are applied, such asIn this scenario,
&
is expected to betitle
and it is expected to be applied to the bottom element. Given the above mentioned behaviour, it won't work because there are no longer 2 contiguous elements with classtitle
.I've cooked a simple reproduction example here: https://codesandbox.io/s/suspicious-sara-ou8303?file=/src/App.js
Thank you so much for you work, I've been using this library a lot lately!
The text was updated successfully, but these errors were encountered: