Как я могу использовать градиенты в пользовательском Bootstrap?

Question

Я хочу сделать основной цвет моей настраиваемой sass Bootstrap в качестве градиента, но когда я определяю свою настраиваемую переменную как градиент, я получаю сообщение об ошибке

"Ошибка: $ color: линейный градиент (справа, # c33764, # 1d2671) не является цвет для темнеет . "

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

Вот мой _custom.scss, который включен в качестве первого частичного в bootstrap.scss:

$celestial: linear-gradient(to right, #c33764, #1d2671);
$primary: $celestial;

Answer 1

linear-gradient допустимо только для свойства background css, а переменная $primary начальной загрузки ожидает цвет.

То, что вы хотите сделать, это нацелить элемент, к которому вы хотите применить градиент, прямо так:

.navbar {
  background: linear-gradient(to right, #c33764, #1d2671);
}