Extending a nested &:hover in a @define-placeholder is ignored.

[peterdillon]

@define-placeholder icon-holder {
  color: #999;
  &:hover { color: red; }
}

OUTPUT:

.icon-test1,
.icon-test2 {
  color:#999
}

[davidtheclark]

Is postcss-nested running before or after extend? I think (not sure) you'll to run it before, so that the selectors are modified by postcss-nested and then extended with this plugin. Does that work for you?

On Mon, Aug 17, 2015 at 11:42 AM, Peter [email protected] wrote:

@define-placeholder icon-holder { color: #999; &:hover { color: red; } }

OUTPUT:

.icon-test1, .icon-test2 { color:#999 }

— Reply to this email directly or view it on GitHub https://github.com/davidtheclark/postcss-simple-extend/issues/9.

[peterdillon]

I just thought this - but it has the same results:

require('postcss-nested')(),
require('postcss-simple-extend')(),

[davidtheclark]

Oh yeah, sorry -- wasn't thinking clearly. That shouldn't work. And at this point I don't think I'm going to complexify this particular plugin to allow for that syntax.

You have options, though:

• You can use a mixin with https://github.com/postcss/postcss-mixins
• You can see https://github.com/travco/postcss-extend (a fuller extend implementation) will support it
• You create two placeholders, one for the normal state and one for hover

Next time I have a chance, though, I might look into this and see what it would take to allow that syntax.

[peterdillon]

Okay! And thank you for your quick replies and awesome work! This plugin is fantastic regardless.