SASS හි විචල්ය සහ අන්තර්ගත බ්ලොක් වල ප්රක්ෂේපණ පරාසය
මික්සින් වෙත අන්තර්ගත බ්ලොක් සම්ප්රේෂණය කිරීමේදී, ඒවායේ ප්රක්ෂේපණ පරාසය තීරණය වන්නේ එම බ්ලොක්යේ නිශ්චිත පිහිටුමෙනි, මික්සින් එකෙන් නොවේ. එබැවින්, අපට මික්සින් වල දේශීය විචල්ය භාවිතා කළ නොහැක සම්ප්රේෂණය කරන අන්තර්ගත බ්ලොක් තුළ, එය ක්රියාත්මක වනු ඇත්තේ ගෝලීය විචල්ය සමඟ පමණි.
පහත උදාහරණය සලකා බලමු:
$size: 14px;
@mixin sizes ($size: 20px) {
font-size: $size;
padding: $size;
@content;
}
.navbar {
@include sizes {
margin: $size;
}
}
සම්පීඩනය කිරීමේ ප්රතිඵලය:
.navbar {
font-size: 20px;
padding: 20px;
margin: 14px;
}
පහත කේතය සම්පීඩනය කිරීමේ ප්රතිඵලය කුමක්දැයි පැහැදිලි කරන්න:
$color: yellow;
@mixin links ($color: red) {
background: $color;
@content;
}
පහත කේතය සම්පීඩනය කිරීමේ ප්රතිඵලය කුමක්දැයි පැහැදිලි කරන්න:
$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;
}
}
පහත කේතය සම්පීඩනය කිරීමේ ප්රතිඵලය කුමක්දැයි පැහැදිලි කරන්න:
$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;
}
}