when use css guards plus mixins seems not to be working

[maxidr]

My case:

app.less

@import "../../vendor/nifty-v2.2/less/nifty.less";


.project-selector .project-name { 
    .label;
    .label-mint;      // line 203
    font-size: 100%;
}

nifty.less

@enable-mint                : true;

& when (@enable-mint = true) {
    .label-mint{background-color: @mint-bg}
}

When try to use the .label-mint as a mixin fails with the error:

[20:38:34] Error with LESS: .label-mint is undefined in file /Users/maxidr/Projects/customer_insight/dashboard-frontend/src/less/app.less line no. 203

I'm really lost, I'm using the mixin in a wrong way?

Thanks

[seven-phases-max]

Mixins defined in a ruleset are visible in that ruleset (and its children) only. And & {} is also just a ruleset (it's not really an euphemism for anif statement).

For your example the solution is as simple as:

@enable-mint: true;

.label-mint when (@enable-mint = true) {
    background-color: @mint-bg;
}

If you can't modify "nifty.less" use extend instead:

.project-selector .project-name { 
    &:extend(.label, .label-mint);
    font-size: 100%;
}

For more details on why & {} is not if clone see #2072.

[maxidr]

Thank you very much Max!, I understand now.

[seven-phases-max]

Closing as "expected behaviour".