SASS-da o'zgaruvchilar va kontent bloklarining ko'rish sohasi

Kontent bloklarini miksinga uzatishda ularning ko'rish sohasi aniq blokning joylashuvi bilan belgilanadi, miksining o'zi bilan emas. Shuning uchun, biz miksingning mahalliy o'zgaruvchilarini faqat global o'zgaruvchilar bilan ishlay oladigan uzatilayotgan kontent blokida ishlata olmaymiz.

Quyidagi misolni ko'rib chiqamiz:

$size: 14px;
	@mixin sizes ($size: 20px) {
		font-size: $size;
		padding: $size;
		@content;
}

.navbar {
	@include sizes {
		margin: $size;
	}
}

Kompilyatsiya natijasi:

.navbar {
	font-size: 20px;
	padding: 20px;
	margin: 14px; 
}

Quyidagi kodning kompilyatsiya natijasi qanday bo'lishini tushuntiring:

$color: yellow;

@mixin links ($color: red) {
	background: $color;
	@content;
}

Quyidagi kodning kompilyatsiya natijasi qanday bo'lishini tushuntiring:

$color: yellow;
$size: 10px;

@mixin links ($color: red, $size: 12px) {
	background-color: $color;
	font-size: $size;
	@content;
}

.navbar {
	@include links {
		box-shadow: $color;
		padding: $size;
	}
}

Quyidagi kodning kompilyatsiya natijasi qanday bo'lishini tushuntiring:

$color: green;
$size: 6px;

@mixin links ($color: red, $size: 10px) {
	color: $color;
	font-size: $size;
	@content;
}

.navbar {
	@include links {
		border-color: $color;
		margin: $size;
	}
}

#active{
	@include links{
		background-color: $color;
		padding-top: $size;
		padding-bottom: $size * 2;
	}
}