Simplfying Less CSS If "Functions" - css

Question

I am struggling to understand how guarded expressions (from a different topic I am led to believe that these are the LESS equivilant of if functions) can be used to set individual properties. Although the below works it seems a little over the top, however it does allow me to do what I need to do. Is this the best way? If not what would be considered so?
.cover() {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.cover(#property, #value) when (#property = "top") {
position: fixed;
top: #value;
right: 0;
bottom: 0;
left: 0;
}
.cover(#property, #value) when (#property = "bottom") {
position: fixed;
top: 0;
right: 0;
bottom: #value;
left: 0;
}
.cover(#property, #value) when (#property = "left") {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: #value;
}
.cover(#property, #value) when (#property = "right") {
position: fixed;
top: 0;
right: #value;
bottom: 0;
left: 0;
}
This lets my type for example...
#cover{
.cover("left", 55px);
}
which renders as
#cover{
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 55px;
}

Answer 1

If you use LESS version >= 1.6, you can use dynamic property names, which would reduce your code to this:
.cover(#property: left, #value: 0) {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
#{property}: #value;
}
#cover {
.cover(left, 55px);
}

Answer 2

In addition to the #mingos answer, an optimized impl. (i.e. with no redudant properties in output) could look like:
.cover(#property: top, #value: 0) {
position: fixed;
top: #t;
right: #r;
bottom: #b;
left: #l;
.-(#property);
.-(...) {#t: 0; #r: 0; #b: 0; #l: 0}
.-(top) {#t: #value}
.-(right) {#r: #value}
.-(bottom) {#b: #value}
.-(left) {#l: #value}
}
// usage:
.a {.cover(left, 55px)}
.b {.cover(right, 33px)}