How to use the @material-ui/core/styles.createMuiTheme function in @material-ui/core

function getTheme(uiTheme) {
  const theme = createMuiTheme({
    direction: uiTheme.direction,
    nprogress: { color: uiTheme.paletteType === 'light' ? '#000' : '#fff' },
    palette: { ...uiTheme.paletteColors, type: uiTheme.paletteType },
  });

  // Expose the theme as a global variable so people can play with it.
  if (process.browser) {
    window.theme = theme;
  }

  return theme;
}

import { createMuiTheme } from '@material-ui/core/styles';
import classes from '../core/classes';

const primary = {
  main: '#1da1f2',
  dark: '#1a91da',
};

const theme = createMuiTheme({
  typography: {
    fontSize: 15,
    fontWeightRegular: 500,
    // Use the system font instead of the default Roboto font.
    fontFamily: [
      '-apple-system',
      'BlinkMacSystemFont',
      '"Segoe UI"',
      'Roboto',
      '"Helvetica Neue"',
      'Arial',
      'sans-serif',
      '"Apple Color Emoji"',
      '"Segoe UI Emoji"',
      '"Segoe UI Symbol"',
    ].join(','),

import React from 'react'
import { MemoryRouter } from 'react-router-dom'
import { mount } from 'enzyme'
import { Provider } from 'react-redux'
import JssProvider from 'react-jss/lib/JssProvider'
import { SheetsRegistry } from 'react-jss/lib/jss'
import {
  MuiThemeProvider,
  createMuiTheme,
  createGenerateClassName
} from '@material-ui/core/styles'
import theme from 'theme'
import createStore from 'connectors/redux'

const sheetsRegistry = new SheetsRegistry()
const muiTheme = createMuiTheme(theme)
const generateClassName = createGenerateClassName()

export default (children, opts = {}) =>
  mount(
    
      
        
          {children}
        
      
    
  )

import grey from '@material-ui/core/colors/grey';
import { createMuiTheme } from '@material-ui/core/styles';

const themeDark = createMuiTheme({
  palette: {
    primary: { main: grey[200] },
    secondary: { main: grey[400] },
    type: 'dark',
  },
});

const themeLight = createMuiTheme({
  palette: {
    primary: { main: grey[800] },
    secondary: { main: grey[900] },
    type: 'light',
  },
});

export { themeDark, themeLight };

import { createMuiTheme } from '@material-ui/core/styles'
import { teal, pink, red } from '@material-ui/core/colors'

export const theme = createMuiTheme({
  palette: {
    primary: teal,
    accent: pink,
    error: red
  }
})

));
    displayOverrideCode(resources);
  }

  return {children};
};

const AdminGuesser = props => (
  
    {state => AdminGuesserComponent(props, state)}
  
);

AdminGuesser.defaultProps = {
  includeDeprecated: false,
  theme: createMuiTheme({
    palette: {
      primary: {
        contrastText: '#ffffff',
        main: '#38a9b4',
      },
      secondary: {
        main: '#288690',
      },
    },
  }),
  appLayout: Layout,
};

AdminGuesser.propTypes = {
  children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
  theme: PropTypes.object,

import { createMuiTheme } from "@material-ui/core/styles"

const theme = createMuiTheme({
  palette: {
    primary: { main: "#086375", contrastText: "#ffffff" },
    secondary: { main: "#119da4", contrastText: "#ffffff" },
    background: {
      default: "#F2FCFF",
    },
  },
  typography: {
    h2: {
      fontSize: "1.5rem",
      fontWeight: 600,
    },
    subtitle1: {
      fontWeight: 500,
      fontSize: "1.1rem",
      lineHeight: 1.1,

const handleClick = event => {
    setAnchorEl(event.currentTarget);
  };

  const handleClose = () => {
    setAnchorEl(null);
  };
  const useStyles = makeStyles({
    flex: {
      display: 'flex',
    },
  });
  const classes = useStyles();
  const { flex } = classes;
  const url = window.location.href;
  const theme = createMuiTheme({
    palette: {
      primary: { main: grey[50] },
    },
  });
  return (
    <div>
      
        <div>
          SHARE
        </div>
        </div>

import { createMuiTheme } from '@material-ui/core/styles';

const theme = createMuiTheme({
  pallet: {
    common: {
      black: '#000',
      white: '#fff',
    },
    background: {
      paper: 'rgba(255, 255, 255, 1)',
      default: 'rgba(181, 181, 181, 0.2)',
    },
    primary: {
      light: '#ff6659',
      main: '#d32f2f',
      dark: '#9a0007',
      contrastText: '#fff',
    },
    secondary: {

const App = () => (
  
    
      
        
        
      
    
  
);