solid-styled-components: apply multiple styles to one component ? combine styles into new style ?

[nmrshll]

Say I have several style classes created by css:

export const LimitWidth = css`
  padding: 0.1rem max(20px, calc(10vw - 40px));
`;
export const Col = css`
  display: flex;
  flex-flow: column nowrap;
`;
export const PurpleTastic = css`
  background: purple;
`;

Is it possible to then combine them into a new style tag ? (that merges all properties from all classes)

Edit: removed second question about applying several styles to one component. It occurred to me after asking that the class/className property can just take several CSS classmanes separated by spaces like in usual HTML:

<MyComponent class={`${Col} ${LimitWidth} ${PurpleTastic}`} />

I'm still interested in the answer to the remaining question

[ryansolid]

Honestly not sure. The library is basically a re-export of Goober with some Solid specific code to handle Styled Components. They generally put all styles in the head but I think there is a way to bind it to a target style tag. I'd probably start my search for whether they have a way that fits your need here: https://github.com/cristianbote/goober.

[nmrshll]

Thanks anyway for taking the time to answer !

I'll have a look at it, it doesn't seem to be a lot of code at its core, and neither is solid-styled-components, so I'll have a look at both, see if I can understand them, and try to add a way to combine classes.
And if I can't, I'll ask there.