Wrong behaviour since version 5.0.2

[jonnitto]

I use TailwindCSS. With version 5.0.1 I got with this code

.apply {
  div {
    @apply fixed lg:static;
  }
}

.screen {
  @apply fixed;

  div {
    @screen lg {
      @apply static;
    }
  }
}

this CSS:

.apply div {
    position: fixed;
}

.screen {
  position: fixed;
}

@media (min-width: 1024px) {
  .apply div {
    position: static;
  }

  .screen div {
    position: static
  }
}

but since 5.0.2 and up, I'll get this CSS:

.apply div {
  position: fixed;
}

.screen {
  position: fixed
}

@media (min-width: 1024px) {

  .apply {
    div {
      position: static;
    }
  }

  div {
    position: static
  }
}

[ai]

Duplicate https://github.com/postcss/postcss-nested/issues/106

Short answer: we do not have resources for now. You can send PR or help us on OpenCollective.

[jonnitto]

The issue was because of this issue here: https://github.com/yunusga/postcss-sort-media-queries/issues/31

But with release 3.0, this is fixed: https://github.com/yunusga/postcss-sort-media-queries/releases/tag/v3.0.0