Skip to content

Empty, guarded mixin is zeroing out other mixins under the same rule #773

@johnnywang

Description

@johnnywang

I've been trying to get the following guarded mixins to work correctly in our LESS stylesheets:

font {

.body( @size: 15px, @lineHeight: 18px, @weight: normal ) {
    font: @weight @size~"/"@lineHeight Arial, sans-serif;
}
.marginLeft( @margin ) when ( @margin = 0 ) { }
.marginLeft( @margin ) when not ( @margin = 0 ) {
    margin-left: @margin;
}
.marginTop( @margin ) when ( @margin = 0 ) { }
.marginTop( @margin ) when not ( @margin = 0 ) {
    margin-top: @margin;
}
.DinBold( @size: 14px, @lineHeight: 20px, @offsetTop: 0, @offsetLeft: 0 ) {
    #font > .marginLeft( @offsetLeft );
    #font > .marginTop( @offsetTop );
    font: @size~"/"@lineHeight 'DINBold', Arial, sans-serif;
}

}

The idea here being that if any of the font offsets are zero, I don't want the margin style to be set. Now, it works fine when the two parameters are non-zero, like:

font > .DinBold( 42px, 42px, -7px, -3px );

But the moment @offsetLeft is 0, either explicitly or implicitly:

font > .DinBold( 42px, 42px, -7px );

or

font > .DinBold( 42px, 42px, -7px, 0 );

it seems that even the margin-top won't be exposed. The same thing happens if you flip it around, putting the marginTop mixin before the marginLeft mixin, and passing in 0 for @offsetTop instead, which seems to suggest to me that the first time an empty mixin is hit, all subsequent mixin calls might be ignored.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions