Pilkuilla yhdistäminen LESS:ssä

Oletetaan, että meillä on funktio, joka luo lohkon varjon:

styles.less.shadow(@s) {
  box-shadow: @s;
}

Oletetaan, että haluamme lisätä lohkoon kaksi varjoa kutsuen funktiotamme kahdesti:

styles.lessp {
  .shadow(1px 1px red); 
  .shadow(2px 2px blue);
}

Meillä ei kuitenkaan onnistu, sillä kahden varjon kutsuminen lisää vain kaksi box-shadow-ominaisuutta:

styles.cssp {
  box-shadow: 1px 1px red;
  box-shadow: 2px 2px blue;
}

Ja me halusimme, että varjot lisätään yhteen box-shadow-ominaisuuteen pilkuilla erotettuna, näin:

styles.cssp {
  box-shadow: 1px 1px red, 2px 2px blue;
}

Jotta funktiomme toimisi kuvatulla tavalla, ominaisuuden arvo tulee kirjoittaa erikoiskomennon +: jälkeen, näin:

styles.less.shadow(@s) {
  box-shadow+: @s;
}