[Question] Media in extends

[Secretmapper]

It seems that extend can only contain declarations and comments. How should I then do something similar to this:

@define-extend container {
  padding-top: 1em;
  padding-left: 15px;
  padding-right: 15px;
  @media (--md-viewport) {
    padding-left: 2em;
    padding-right: 2em;
  }
}

[travco]

postcss-extend, as a general rule doesn't appreciate you nesting things, especially in the placeholder-strict form (@define-extend). If you wanted to be able to extend placeholders inside @media, you need to separate it out a little bit. So assuming I'm not misinterpreting what you want:

%container {
  padding-top: 1em;
  padding-left: 15px;
  padding-right: 15px;
}
@media (--md-viewport) {
  %container {
    padding-left: 2em;
    padding-right: 2em;
  }
 }
.extendingClass {
  color: gray;
  @extend %container;
}

Would resolve to:

.extendingClass {
  padding-top: 1em;
  padding-left: 15px;
  padding-right: 15px;
}
@media (--md-viewport) {
  .extendingClass {
    padding-left: 2em;
    padding-right: 2em;
  }
 }
.extendingClass {
  color: gray;
}

Also - thank you, I realized the documentation on the limited scope (root-only) of @define-placeholder was a little lacking. Hope it helps.

[Secretmapper]

Awesome! Exactly what I'm looking for and I imagine ae7744075bea72f14a7aba08ba0364fe31a65e17 would be helpful to others who might be placed in the same position as me.