Mainīgie parametros SASS

Ir situācijas, kad miksinam vai funkcijai jāpieņem nezināms parametru skaits. Šim nolūkam SASS valodā ir iespēja pārraidīt "mainīgos parametrus" jeb parametrus, kas tiek norādīti pēdējie funkcijā vai miksinā un iesaiņo visus pārējos padotos parametrus sarakstā.

Pēc šādiem parametriem jāliek daudzpunktes. Apskatīsim šādu piemēru:

@mixin box-content-padding($padding...) {
	-moz-box-content-padding: $padding;
	-webkit-box-content-padding: $padding;
}
div {
	@include box-content-padding(0px 4px 5px 2px);
}

Kompilācijas rezultāts:

div {
	-moz-box-content-padding: 0px 4px 5px 2px;
	-webkit-box-content-padding: 0px 4px 5px 2px;
}

Mainīgajos funkcijā vai miksinā arī var padot nosauktus parametrus. Lai pie tiem varētu piekļūt, izmanto funkciju keywords($args), kas atgriež tos kā atbilstību vārdu (bez zīmes $) vērtībām.

@mixin common-colors($text-color, $background, $shadow) {
	color: $text-color;
	background-color: $background;
	box-shadow: $shadow;
}

$values: white, green, grey;

.primary {
	@include common-colors($values...);
}

$value-map: (text-color: black, background: grey, shadow: green);

.secondary {
	@include common-colors($value-map...);
}

Pēc kompilācijas mēs redzēsim:

.primary {
	color: white;
	background-color: green;
	box-shadow: grey;
}

.secondary {
	color: black;
	background-color: grey;
	box-shadow: green;
}