Parameters met komma's in LESS

Stel we hebben een functie die een schaduw voor een blok maakt:

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

Zoals je ziet, heeft onze functie één parameter. Dit betekent dat we alle waarden voor onze schaduw gescheiden door een spatie doorgeven aan deze parameter, zoals hier:

div {
	.shadow(1px 1px red);
}

In CSS is het echter mogelijk om meerdere schaduwen in te stellen door ze door komma's gescheiden op te schrijven. In ons geval zal dit helaas niet werken, omdat de komma wordt geïnterpreteerd door de compiler als een scheidingsteken tussen functieparameters:

div {
	.shadow(1px 1px red, 1px 1px blue); // geeft een foutmelding
}

Er is echter een oplossing. We kunnen LESS forceren om onze string met een komma te interpreteren als één parameter. Om dit te doen, moeten we de lijst van onze waarden afsluiten met een puntkomma:

div {
	.shadow(1px 1px red, 1px 1px blue;);
}

Maak een functie die een achtergrond toevoegt. Gebruik deze functie om meerdere achtergronden aan een blok toe te voegen.