Skip to content

CSS in style prop #389

Description

@mmamedel

First I wanted to congratulate you for the good job you have been doing putting together this great library. For me this is a all-in-one solution for many packages that I have been using all the time to created web apps.
Solid.js is turning state management in Components much more flexible.
I wonder if we could have something change too in the style prop of JSX Elements. The reason I see most have to use a CSS-in-JS solutions is because the style prop is limited and don’t allow: (1) adding modifiers (like “&:hover”...), (2) scss complex styles (cascading).
So I think it would simplify if the style prop natively accepted these items just as the css in solid-styled-components package accept.
This is similar to what Emotion has done with their css prop, but not instead of creating a css prop, just use native style prop.
Right now we can do:

<div className={css({...})} />

But we could actually just do:

<div style={{...}} />

This way maybe solid-styled-components would not be a separate package anymore, it would become part of the solid-js package.
This is just my two cents that I feel that would make sense with the spirit behind Solid.js.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions