Veranderlikes in Parameters in SASS

Daar is situasies waar 'n mixin of funksie 'n onbekende aantal parameters moet aanvaar. Vir hierdie doel het die SASS taal die moontlikheid om "veranderlike parameters" of parameters oor te dra, wat laaste in die funksie of mixin gespesifiseer word en al die ander oorgedra parameters in 'n lys saampak.

Na sulke parameters moet 'n ellips geplaas word. Kom ons kyk na die volgende voorbeeld:

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

Kompilasie resultaat:

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

Naamgenoteerde parameters kan ook aan die veranderlikes van 'n funksie of mixin oorgedra word. Om na hulle te kan verwys, gebruik hulle die funksie keywords($args), wat dit teruggee as 'n ooreenkoms van name (sonder die $ teken) na waardes.

@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...);
}

Na kompilering sal ons sien:

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

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