如何将bootstrap主色更改为线性渐变?

时间:2018-05-23 14:20:01

标签: css twitter-bootstrap sass bootstrap-4 background-color

我正在尝试将bootstrap主色更改为线性gredient但我收到错误

$theme-colors: (
  "primary": linear-gradient(to right, #373b44, #4286f4)
);




error:
$link-hover-color:          darken($link-color, 15%) !default;
                           ^
      Argument `$color` of `darken($color, $amount)` must be a color

1 个答案:

答案 0 :(得分:3)

问题是linear-gradient用于background-image,而非前景color。当SASS编译器尝试构建Bootstrap时,它不能在background-image上使用darken(..)函数。

相反,您只需更改具有此类背景的元素的primary颜色......

.bg-primary,
.btn-primary,
.badge-primary,
.alert-primary {
    background-image: linear-gradient(to right, #373b44, #4286f4);
}

https://www.codeply.com/go/XXUxFr6tEZ