Перейти к контенту

Глобальная настройка

The overrides key enables you to customize the appearance of all instances of a component type, while the props key enables you to change the default value(s) of a component's props.

CSS

Если настроек конфигурации недостаточно, можно использовать ключ overrides у объекта theme, чтобы изменить абсолютно любой стиль, который Material-UI вносит в DOM. Это действительно мощная штука.

const theme = createMuiTheme({
  overrides: {
    // Style sheet name ⚛️
    MuiButton: {
      // Name of the rule
      text: {
        // Some CSS
        color: 'white',
      },
    },
  },
});

{{"Демо": "pages/customization/globals/GlobalCss.js"}}

Список всех возможных кастомизаций для компонент задокументирован в разделе Component API. Например, вы можете взглянуть на кнопку Button. Кроме того, вы всегда можете взглянуть на реализацию.

Настройка props

Вы можете изменить свойство props любой из компонент Material-UI. A props key is exposed in the theme for this use case.

const theme = createMuiTheme({
  props: {
    // Название компоненты
    MuiButtonBase: {
      // Пример одного из стандартных свойств props
      disableRipple: true, // Скажи НЕТ эффекту расходящихся волн 💣!
    },
  },
});

{{"Демо": "pages/customization/globals/DefaultProps.js"}}