Generic DotLess .box-shadow mixin with support RTL?

Question

First of all am not perfect in writing less mixins. I need to write a mixin to support RTL & LTR for box-shadow CSS property. I have a global variable for direction called @direction. what I did is defining two mixins for both LTR & RTL depending on the @direction variable

.shadow(LTR, @inset: "inset", @hOffset, @vOffset, @blur, @color) {
    @localizedShadow: @inset @hOffset @vOffset @blur @color;
}
.shadow(RTL, @inset: "inset", @hOffset, @vOffset, @blur, @color) {
    @localizedShadow: @inset (@hOffset * -1) @vOffset @blur @color;
}

after that I add 2 more mixins for the box-shadow property

.box-shadow(LTR, @inset: "inset", @hOffset, @vOffset, @blur, @color) {
    .shadow(LTR, @inset: "inset", @hOffset, @vOffset, @blur, @color);
    .box-shadow(@localizedShadow);
}
.box-shadow(RTL, @inset: "inset", @hOffset, @vOffset, @blur, @color) {
    .shadow(RTL, @inset: "inset", @hOffset, @vOffset, @blur, @color);
    .box-shadow(@localizedShadow);
}

based on that I'm unable to compile because of parsing error.

what I'm trying to achieve is to use my mixin like that

.box-shadow(@direction; @hOffset: 1px; @vOffset: 1px; @blur: 1px;, @color: rgba(0,0,0,.075))

Any help is appreciated.

Answer 1

Okay then, if you just want to an "overloaded" box-shadow you can simplify it to just:

.box-shadow(LTR, @inset: inset, @hOffset, @vOffset, @blur, @color) {
    box-shadow: @inset @hOffset @vOffset @blur @color;
}
.box-shadow(RTL, @inset: inset, @hOffset, @vOffset, @blur, @color) {
    box-shadow: @inset (@hOffset * -1) @vOffset @blur @color;
}

Usage:

.test {
    .box-shadow(LTR, inset, 1px, 1px, 1px, red);
}

Answer 2

Finally I got it works here

.shadow(LTR; @i: inset; @x; @y; @b; @c) {
    @shadow: ~"@{i} @{x} @{y} @{b} @{c}";
}

.shadow(RTL; @i: inset; @x; @y; @b; @c) {
    @xNew: @x * -1;
    @shadow: ~"@{i} @{xNew} @{y} @{b} @{c}";
}

.box-shadow(LTR; @i: inset; @x; @y; @b; @c) {
    .shadow(LTR; @i; @x; @y; @b; @c);
    .box-shadow(@shadow);
}
.box-shadow(RTL; @i: inset; @x; @y; @b; @c) {
    .shadow(RTL; @i; @x; @y; @b; @c);
    .box-shadow(@shadow);
}

.box-shadow(@shadow) {
    -webkit-box-shadow: @shadow;
    box-shadow: @shadow;
}