solidjs / solid-styled-components

A 1kb Styled Components library for Solid
MIT License
280 stars 26 forks source link

styled svg renders viewbox attribute instead of viewBox #16

Closed btakita closed 1 year ago

btakita commented 2 years ago
const Svg = styled('svg')<{ spin?:any, pulse?:any }>($p=>{
    return `
        ${$p.spin ? `
            animation: ${spin} 2s 0s infinite linear;
        ` : ''}
        ${$p.pulse ? `
            animation: ${spin} 1s infinite steps(8);
        ` : ''}
    `
})
<Svg viewBox="0 0 10 10"></Svg> # renders as <svg viewbox="0 0 10 10"></svg>
ryansolid commented 2 years ago

Hmm. Right, it isn't aware of SVG elements. Yeah in general I don't think this library supports SVG yet. I wonder if changing the implementation to use <Dynamic> will just handle this properly.

ryansolid commented 2 years ago

I believe #30 should add support for this. Released in 0.28.2.