postcss-extend icon indicating copy to clipboard operation
postcss-extend copied to clipboard

Placeholder classes don't separate with "," comma !

Open amerllica opened this issue 7 years ago • 1 comments

When I write:

%align-row, %align-ver {
   display: flex;
   flex-direction: row;
}

The exported CSS is wrong, In exported CSS file I see all classes with placeholder properties and the placeholder classes in CSS file which is a big mistake, but when I write:

%align-row {
   display: flex;
   flex-direction: row;
}

%align-ver {
   display: flex;
   flex-direction: row;
}

The exported file has true syntax.

amerllica avatar Sep 17 '17 06:09 amerllica

Because placeholder classes are supposed to be a single identifier that is either used (and replaced) or discarded it wasn't coded considering multiple placeholders (which is basically aliasing) in the same declaration.

I think of only one case where having multiple silent placeholders declaring the exact same things would be helpful (aliasing) - but it certainly wasn't the intended use when I wrote it. I should be able to nab this with the long-waiting PR sometime this week.

In the meantime if you want this kind of functionality, you should be able to extend into whichever one you want to be the parent:

%align-row {
   display: flex;
   flex-direction: row;
}

%align-ver {
   /* Some other css declarations*/
  @extend %align-row;
}

travco avatar Sep 17 '17 17:09 travco