Функция SASS / mixins для значения свойства

Question

Вот пример mixin:

=border($alpha: 0.2)
    1px solid hsla(0, 0, 0, $alpha)

Я хочу использовать функции / миксины для достижения чего-то вроде этого:

border-right: +border(0.2)

Это скомпилируется в:

border-right: 1px solid hsla(0, 0, 0, 0.2)

Я не видел документации о том, как использовать функции / миксины для динамического вычисления значений свойств. Я видел их только тогда, когда они включают собственность. Как этого достичь?

Answer 1

Вы можете написать такие функции:

@function border($alpha: 0.2)
  $border: 1px solid hsla(0, 0, 0, $alpha)
  @return $border

и примените их как любую другую функцию sass / compass:

border-right: border(0.2)