Material-ui createMuiTheme тип палитры dark не меняет цвет текста на светлый

Question

Я установил тип палитры: темный в createMuiTheme, и он меняет цвет фона на темный, что хорошо. Но цвет текста остается черным. Разве он не должен адаптироваться к более светлому цвету?

Ссылка CodeSandbox: https://codesandbox.io/s/j22rvq4w2v

import React from 'react'; 
import ReactDOM from 'react-dom';
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles';
import CssBaseline from '@material-ui/core/CssBaseline';
import App from './App';

const theme = createMuiTheme({
  palette: {
    type: 'dark',
  },
});

ReactDOM.render(

<MuiThemeProvider theme={theme}>
    <React.Fragment>
        <CssBaseline />
            <App/>
    </React.Fragment>
</MuiThemeProvider>,
     document.getElementById('app'));

Компонент приложения содержит только панель приложений и простой текст.

Обновление : Версия имеющегося у меня материала-интерфейса, о котором я упоминал ранее как v1, неверна. Извините за дезинформацию, и это 3.10.10

Answer 1

Просто обновите @material-ui/core до v3.0.1 . Это должно работать как шарм.

Answer 2

Вы просто неверно истолковываете, для чего CssBaseline . Этот компонент является своего рода CSS Resetter и не добавляет никакого визуального стиля - только макет, размер окна.

То, что вы действительно хотите, это Типография компонент .

См. обновленный и работающий CodeSandbox .

Answer 3

Вам нужно импортировать нужный цвет:

import React from "react";
import { MuiThemeProvider, createMuiTheme } from "@material-ui/core/styles";
import blueGrey from "@material-ui/core/colors/blueGrey";
import lightGreen from "@material-ui/core/colors/lightGreen";
import Reset from "@material-ui/core/CssBaseline";

const theme = createMuiTheme({
  palette: {
    primary: {
      light: lightGreen[300],
      main: lightGreen[500],
      dark: lightGreen[700]
    },
    secondary: {
      light: blueGrey[300],
      main: blueGrey[500],
      dark: blueGrey[700]
    }
  }
});

PD: возможно обновить материал - у v.3 его нет Надеюсь, это поможет