threepointone/glamor

Allow targeting children without &

Closed this issue · 1 comments

Not sure if this has been brought up before, I tried searching the issues, but found nothing.

I think it would be really cool if it was possible to target a child without & similar to how you can do this in Sass or LESS. I think this would allow for a clean API for things that you want to allow overrides in:

const MyStyledCheckbox = props => (
  <Checkbox
    large
    css={{
      '.IconBackground': {
        fill: 'red',
      },
    }}
  />
)

I could see this being an issue with having to filter all current elements to get this functionality, which might not be worth the small tradeoff of using &. Would love to hear your thoughts on it.

This is too hard to do cleanly/unambiguously, and it'll make it un-possible to target the same element t with additional class names. Fwiw, it works with a preceding space. Closing this for now, re-open if I've misunderstood