Не могу стилизовать материал-интерфейс со своими реквизитами

Question

Я использую материал-интерфейс и пытаюсь стилизовать цвет фона RaisedButton, используя один из его реквизита под названием backgroundColor:

import React, {Component} from 'react';
import RaisedButton from 'material-ui/lib/raised-button';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import s from './Home.scss';

class Home extends Component {
    render() {
        return (
            <div>
                <h1 className={s.h1}>Pomodoro Tech</h1>
                <div className={s.imgContain}>
                    <img src={require('./pom.png')} width="100%" height="100%"/>
                </div>
                <div>
                    <RaisedButton
                        label="Login"
                        secondary={true}
                        backgroundColor="#77CA2D"
                    />
                    <RaisedButton
                        backgroundColor="#77CA2D"
                        label="About"
                    />
                </div>
            </div>
        );
    }
}

export default withStyles(Home, s);

Но это свойство никогда не имеет значения.

Версия материала-я использую это 0.15.0-alpha.1в соответствии с результатом npm list --depth=0 команда.

Прежде чем задать этот вопрос, я провел некоторый поиск, но не могу понять, в чем проблема.

Answer 1

Это работает для меня, использовали материал-интерфейс v0.14.4, может быть, это ломалось 0.15.0-alpha.1

Пожалуйста, вставьте рабочий пример в JSBin или куда-нибудь еще, чтобы отладить его.

Answer 2

Убедитесь, что вы не включили primary={true}; это будет игнорировать ваш backgroundColor иначе. Смотрите мой ниже:

<RaisedButton
  label={stepIndex === 2 ? 'Finish' : 'Next'}
  disableTouchRipple={true}
  disableFocusRipple={true}
  onClick={this.handleNext}
  backgroundColor={teal400}
/>