csstools / postcss-nesting

Nest style rules inside each other
https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting
Creative Commons Zero v1.0 Universal
451 stars 26 forks source link

on v4.0.0 some nesting forms are not allowed anymore #34

Closed cloud-walker closed 7 years ago

cloud-walker commented 7 years ago

On my stack I use BEM and I usually nest like this:

.header {
  position: relative;
  background: $color-primary;
  border-bottom: solid 1px rgba(255, 255, 255, 0.15);

  &__container {
    display: flex;
    align-items: center;
    min-height: calc($spacing-unit * 3);
    @mixin container;

    @media screen and (max-width: $width-md) {
      flex-wrap: wrap;
      padding: 0 $spacing-small;
    }
  }

But v4.0.0 it seems to break support of this form of nesting, and the Changelog says only this: schermata 2017-05-22 alle 11 46 12

What I'm doing wrong?

cloud-walker commented 7 years ago

I've found this issue: https://github.com/jonathantneal/postcss-nesting/issues/17 postcss-nesting is not for me then, I'll close this, thanks anyway!

jonathantneal commented 7 years ago

@cloud-walker, that is completely understandable. Concatenative selectors are useful and tricky (as #17 shows). For that kind of Sassy nesting, I very much recommend PostCSS Nested.