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

Question

我通过 npm 安装了 Material Design 精简版模块，但我想用其他颜色更改它，最好是 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";