Директива @if в Sass полезна для проверки конкретного случая - она работает так же, как и оператор if в JavaScript.
@mixin make-bold ($ bool) {И так же, как в JavaScript,
@if $ bool == true {
font-weight: bold;
}
}
@else if и @else test для получения дополнительных условий: @mixin text-effect ($ val) {
@if $ val == опасность {
красный цвет;
}
@else, если $ val == alert {
цвет: желтый;
}
@else, если $ val == success {
цвет: зеленый;
}
@else {
черный цвет;
}
}
Создайте mixin называемый border-stroke который принимает параметр $val . mixin должен проверить следующие условия, используя @if , @else if и @else :
свет - 1px сплошной черный
средний - 3px сплошной черный
тяжелый - 6px сплошной черный
Если $val не является light, medium, или heavy, для границы должно быть установлено значение none.