facebook / stylex

StyleX is the styling system for ambitious user interfaces.
https://stylexjs.com
MIT License
8.22k stars 303 forks source link

Strange :not(#\\#) selector #508

Closed Ustasjs closed 3 months ago

Ustasjs commented 3 months ago

I checked out your webpack example and also built my own small setup to check the generated style and I found out that you use :not(#/#) selector widely in the generated code.

Code from your webpack example @keyframes xgnty7z-B{0%{opacity:.25;}100%{opacity:1;}} .x1oz5o6v:hover:not(#\#){background:red} .xeuoslp:not(#\#):not(#\#){animation-name:xgnty7z-B} .x1lliihq:not(#\#):not(#\#){display:block} .x78zum5:not(#\#):not(#\#){display:flex} .x1hm9lzh:not(#\#):not(#\#){margin-inline-start:10px} .x1egiwwb:not(#\#):not(#\#):not(#\#){height:500px} .xlrshdv:not(#\#):not(#\#):not(#\#){margin-top:99px} .xh8yej3:not(#\#):not(#\#):not(#\#){width:100%} .x3hqpx7:not(#\#):not(#\#):not(#\#){width:50%}

Could you provide some insight into using ## as a selector in the styles generated by stylex? In standard CSS, ## appears to be a selector for an element with id="#" that doesn't make much sense, and I'm curious about its purpose or significance within stylex generated styles. Do you use it to increase css specificity? Any clarification on this aspect would be greatly appreciated.

necolas commented 3 months ago

This has been answered several times before if you search issues

https://github.com/search?q=repo%3Afacebook%2Fstylex+not+selector&type=issues