Ändern der Design-Farben von Material Design Lite in scss

Question

Ich habe Material Design-Lite-Modul durch NPM installiert, aber ich möchte es mit anderen Farben ändern und vorzugsweise mit Farben, die nicht in Material Design Color Pallete enthalten sind.

Ich lese hier Here on GitHub how to do it.

Aber es funktioniert nicht für mich, wenn ich versuche, die Farbe zu ändern, bekomme ich weiß/schwarz Farbe aussehen.

Ich habe in meinem Haupt-SCSS

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

Und mein _colors.scss enthält:

$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; 

Der Unterschied, den Sie in Bild unten (vor und nach dem ich geänderten Werte der Farbe sehen varaibles).

Answer 1

Beginnen Sie mit Blick auf das generierte CSS.

Versuchen Sie, die !default zu entfernen.

Und verwenden RGB-Farb string: "255, 0, 0"

Zum Beispiel für Rot als Grundfarbe.

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