New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Some selectors are not working #24

Open

Kuboczoch opened this issue Apr 1, 2020 · 0 comments

Kuboczoch commented Apr 1, 2020

My example:

This fragment of code is working correctly:

const centered = css`
  ${Column} {
    &:first-child ${StyledLink} {
      margin: 0 0 0 auto;
    }
    
    &:last-child ${StyledLink} {
      margin: 0 auto 0 0;
    }
  }
`

const Example = styled('div')`
  ${breakpoint('md')`
    ${props => props.centered && centered};
  `}
`

But I have an error on this, which is a much better solution for my project:

const centered = css`
  ${breakpoint('md')`
    ${Column} {
      &:first-child ${StyledLink} {
        margin: 0 0 0 auto;
      }
    
      &:last-child ${StyledLink} {
        margin: 0 auto 0 0;
      }
    }
 `}
`

const Example = styled('div')`
  ${props => props.centered && centered};
`

The result of the second one is that no margin will be assigned which is completely wrong

The text was updated successfully, but these errors were encountered:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment