import React from "react";
import ReactDOM from "react-dom";
import Routes from "./routes/index";
import * as serviceWorker from "./serviceWorker";
import { MuiPickersUtilsProvider } from "@material-ui/pickers";
import DateFnsUtils from "@date-io/date-fns";
import { th } from "date-fns/locale";
import { MuiThemeProvider, createMuiTheme } from "@material-ui/core/styles";
import "./styles/custom.css";
import "./styles/materialize.css";
import "./styles/spacing.css";

const theme = createMuiTheme({
  fontFamily: `'Prompt', sans-serif`,
  typography: {
    useNextVariants: true,
    fontFamily: `'Prompt', sans-serif`
  },
  palette: {
    // primary: {
    //     light: '#80DEEA',
    //     main: '#1a8a98',
    //     dark: '#00838F',
    //     contrastText: '#fff'
    // },
    // secondary: {
    //     light: '#ff7961',
    //     main: '#f44336',
    //     dark: '#ba000d',
    //     contrastText: '#000'
    // }
  }
});

ReactDOM.render(
  <MuiPickersUtilsProvider utils={DateFnsUtils} locale={th}>
    <MuiThemeProvider theme={theme}>
      <Routes />
    </MuiThemeProvider>
  </MuiPickersUtilsProvider>,
  document.getElementById("root")
);

serviceWorker.unregister();
