10 examples of 'material ui change primary color' in JavaScript

33
set primaryColor(value: string) {
34
    const color = new Color(value);
35
    this._appScheme.colorScheme.primaryColor = color.ios;
36
    this._appScheme.colorScheme.primaryColorVariant = new Color(61.2, color.r, color.g, color.b).ios; // default alpha is 0.24
37
}

38
setPrimaryColor(value: string | Color) {
39
    this.primaryColor = value;
40
    const colorTheme = this.getOrcreateAppColorScheme();
41
    const color = value instanceof Color ? value : new Color(value);
42
    colorTheme.primaryColor = color.ios;
43
    colorTheme.primaryColorVariant = new Color(61.2, color.r, color.g, color.b).ios; // default alpha is 0.24
44
}

32
changeColor(color) {
33
  this.selected = color;
34
  this.contentEl.style.background = this.colors[color].bg;
35
  this.contentEl.style.color = this.colors[color].fg;
36
}

56
get primaryColor() {
57
  return this.theme.primaryColor;
58
}

31
handleChange(color: string) {
32
    this.props.setGameObjectColor(this.props.component,color);
33
34
    markDirty(this);
35
}

31
changeColor() {
32
  this.penMode.emit();
33
  this.openColors = true;
34
35
  ga('send', 'event', ['Button'], ['Change Color'], ['Changing Color']);
36
}

41
get secondaryColor() {
42
  return this._secondaryColor;
43
}

122
changeHslColor () {
123
    this.parent.changeColor({
124
        type: 'hsl',
125
        h : this.refs.$hsl_h.int(),
126
        s : this.refs.$hsl_s.int(),
127
        l : this.refs.$hsl_l.int(),
128
        a : this.refs.$hsl_a.float()
129
    })        
130
}

54
private setColorMain(el: HTMLElement, color: string): void {
55
    const colorMain = new TinyColor(color);
56
57
    if (colorMain.isValid && this.getDefaultsColors(el).primary !== color) {
58
        const colorMainMod = `#${colorMain
59
            .lighten(this.COL_MAIN_LIGHTEN_VAL)
60
            .toHex()
61
            .toUpperCase()}`;
62
63
        el.style.setProperty('--color-main', colorMain.toHexString().toUpperCase());
64
        el.style.setProperty('--color-main_mod', colorMainMod);
65
        el.style.setProperty('--color-main_rgb', this.getRgbString(colorMain));
66
    }
67
}

107
private updateColor(color: Color) {
108
    let hasColor = false;
109
    try {
110
        this.selectedColor = Color.fromValue(color);
111
112
        hasColor = true;
113
    } catch (e) {
114
        hasColor = false;
115
    }
116
117
    if (!hasColor || !this.selectedColor) {
118
        if (this.palette) {
119
            this.selectedColor = this.palette.defaultColor;
120
        } else {
121
            this.selectedColor = Color.BLACK;
122
        }
123
    }
124
}