在 scss 中更改 Material Design Lite 的主题颜色

Question

我通过 npm 安装了 Material Design lite 模块，但我想用其他颜色更改它，最好是使用 Material Design Color Pallete 中未包含的颜色。

我在这里读到Here on GitHub how to do it。

但这对我不起作用，当我尝试改变颜色时，我会看到白色/黑色的外观。

我的主 scss 中有

@import 'colors';
@import '../../../node_modules/material-design-lite/src/material-design-lite'; `

我的 _colors.scss 包含：

$golden: #c6a259;
$brown: #240000;
$color-primary: #c6a259 !default;
$color-primary-dark: #c6a259 !default;
$color-accent: #240000 !default;
$color-primary-contrast: #240000 !default;
$color-accent-contrast: #240000 !default;

您可以在下图中看到差异（在我更改颜色变量值之前和之后）。

Answer 1

从查看生成的 CSS 开始。

尝试删除!default。

并使用RGB色串："255, 0, 0"

例如将红色作为原色。

 $color-primary: "255, 0, 0";