solid-styled-jsx
solid-styled-jsx copied to clipboard
works with className="", but not with class=""
I've been taking solid-styled-jsx for a test run in porting an app from Vue to Solid (easy to copy/paste styles from <style scoped>
to <style jsx>
that way).
I'm encountering an issue where this template,
return <div class="command">
<h1>Foo</h1>
<style jsx>{
/*css*/ `
h1 {
margin-top: 5vh;
}
`
}</style>
</div>
produces this output in the DOM:
<div class="undefinedjsx-4071452694undefined">
<h1 class="jsx-4071452694">Foo</h1>
</div>
Not sure if it is clashing actually, because I tried moving my JSX class="command"
to classList={{command: true}}
but get the same output.
Using className="command"
works!
@lxsmnsyc any chance you'd be willing to use your compiler chops to fix this?
@LXSMNSYC any chance you'd be willing to use your compiler chops to fix this?
solid-styled
doesn't utilize classes to surgically add scoping so this is all good