in19farkt / css-to-jss

VS Code extension for converting CSS rules to JSS format
https://marketplace.visualstudio.com/items?itemName=infarkt.css-to-jss
15 stars 3 forks source link

Pseudo Class Support #6

Open Rishabh-Streak opened 3 years ago

Rishabh-Streak commented 3 years ago

For my use case i had css with lots of Css Pseudo Classes

here is a demo example

.titleContainer { display: flex; flex-direction: row; padding: 0 0 0 2rem; }

.titleContainer:hover { font-weight: 900; }

Expected Behaviour ( as per JSS library ):-

"titleContainer": { "display": "flex", "flexDirection": "row", "padding": "0 0 0 2rem", "&:hover": { "fontWeight": 900 } }

Actual Behaviour :-

.titleContainer { display: 'flex', flexDirection: 'row', padding: '0 0 0 2rem', }

.titleContainer:hover { fontWeight: 900, }

Rishabh-Streak commented 3 years ago

I had to convert whole css to Js Objects (JSS format) and i couldn't find a solution which could do that so finally i ended up making a solution for myself which can be seen here

it can convert whole Css to CssInJs ( for now as per JSS library ) in one short.

it would be great if we could discuss and collaborate on our solutions.

PS : i explored your extension after making my own solution and i was literally surprised to see how did we ended up making similar logo XD