Parâmetros com vírgulas em LESS

Suponha que temos uma função que cria uma sombra de caixa:

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

Como você pode ver, nossa função tem um parâmetro. Isso significa que vamos passar para este parâmetro todos os valores da nossa sombra separados por espaço, assim:

styles.lessdiv {
  .shadow(1px 1px red);
}

No CSS, no entanto, é possível definir várias sombras, escrevendo-as separadas por vírgula. No nosso caso, infelizmente, isso não funcionará, porque a vírgula será interpretada pelo compilador como um separador entre os parâmetros da função:

styles.lessdiv {
  .shadow(1px 1px red, 1px 1px blue); // retornará um erro
}

No entanto, há uma solução. Podemos forçar o LESS a interpretar nossa string com vírgula como um único parâmetro. Para fazer isso, precisamos finalizar a lista dos nossos valores com ponto e vírgula:

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