在CSS中更改Material Design Lite的主题颜色 [英] Changing theme colors of Material Design Lite in scss
问题描述
我通过npm安装了Material Design lite模块,但是我想用其他颜色进行更改,最好是使用Material Design Color Pallete中未包括的颜色进行更改。
我在这里
从查看生成的CSS开始。
尝试删除!默认值
。
并使用RGB颜色字符串: 255,0,0
例如,红色为原色。
$ color-primary: 255、0、0;
I installed material design lite module through npm, but I want to change it with other colors and preferably with colors that are not included in Material Design Color Pallete.
I read here Here on GitHub how to do it.
But it doesn't work for me, when I try to change color I get white/black color look.
I have in my main scss
@import 'colors';
@import '../../../node_modules/material-design-lite/src/material-design-lite'; `
And my _colors.scss contains:
$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;
The difference you can see in image below (Before and after I changed values of color varaibles).
Start with looking at the generated CSS.
Try to remove the !default
.
And use RGB color string:"255, 0, 0"
For example for red as primary color.
$color-primary: "255, 0, 0";
这篇关于在CSS中更改Material Design Lite的主题颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!