2016-10-07 3 views
2

material-ui의 스낵바 구성 요소를 사용하고 있습니다. 현재 스낵바는 검은 색으로 나타납니다. 내가 색을 어떻게 바꿀 수 있는지 아십니까? 배경색은 스낵바가있는 전체 div의 색만 변경합니다. 스낵바의 색상은 변경되지 않습니다.스낵바 요소 색상을 material-ui로 설정하십시오.

답변

1

당신은 bodyStyle 속성을 설정해야합니다 :

<Snackbar bodyStyle={{ backgroundColor: 'teal', color: 'coral' }} /> 

참조하면 소품 SnackbarContentProps으로 SnackbarContent 구성 요소의 루트 CSS 클래스를 오버라이드 (override) 할 필요가 재료 UI 1.0으로 documentation

2

.

const styleSheet = createStyleSheet(() => ({ 
    root: { 
     background: 'red' 
    } 
})); 

class MySnackbar extends Component { 
    render() { 
     const { classes } = this.props; 
     return (
      <div> 
       <Snackbar 
        SnackbarContentProps={{ 
         classes: { 
          root: classes.root 
         } 
        }} 
        message={<span>Some message</span>} 
       /> 
      </div> 
     ); 
    } 
} 

export default withStyles(styleSheet)(MySnackbar); 
: 여기

은 일례이며