Parameters with commas in LESS

Let's say we have a function that creates a box shadow:

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

As you can see, our function has one parameter. This means that we will pass all the values of our shadow to this parameter, separated by a space, like this:

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

In CSS, however, you can specify multiple shadows by writing them separated by commas. In our case, unfortunately, this will not work, since the comma will be perceived by the compiler as a separator between the function parameters:

div {
	.shadow(1px 1px red, 1px 1px blue); // will give an error
}

There is a way out, however. We can force LESS to treat our comma-separated string as a single parameter. To do this, we need to end the list of our values with a semicolon:

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

Make a function that adds a background. Use this function to add multiple backgrounds to the block.