text: import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';
  import React from 'react';
  import ReactDOM from 'react-dom';
  import App from './components/App';
  import Configuration from './pages/Configuration';
  import * as Acsys from './utils/Acsys/Acsys';
  import { AcsysProvider } from './utils/Session/AcsysProvider';
  import * as serviceWorker from './serviceWorker';
  
  let theme = createMuiTheme({
    palette: {
      primary: {
        light: '#c5a8ff',
        main: '#b79afe',
        dark: '#7735e3',
        contrastText: '#ffffff',
      },
    },
    typography: {
      h5: {
        fontWeight: 500,
        fontSize: 26,
        letterSpacing: 0.5,
      },
    },
    shape: {
      borderRadius: 8,
    },
    props: {
      MuiTab: {
        disableRipple: true,
      },
    },
    mixins: {
      toolbar: {
        minHeight: 48,
      },
    },
  });
  
  theme = {
    ...theme,
    overrides: {
      MuiDrawer: {
        paper: {
          backgroundColor: '#18202c',
        },
      },
      MuiButton: {
        label: {
          textTransform: 'none',
        },
        contained: {
          boxShadow: 'none',
          '&:active': {
            boxShadow: 'none',
          },
        },
      },
      MuiTabs: {
        root: {
          marginLeft: theme.spacing(1),
        },
        indicator: {
          height: 3,
          borderTopLeftRadius: 3,
          borderTopRightRadius: 3,
          backgroundColor: theme.palette.common.white,
        },
      },
      MuiTab: {
        root: {
          textTransform: 'none',
          margin: '0 16px',
          minWidth: 0,
          padding: 0,
          [theme.breakpoints.up('md')]: {
            padding: 0,
            minWidth: 0,
          },
        },
      },
      MuiIconButton: {
        root: {
          padding: theme.spacing(1),
        },
      },
      MuiTooltip: {
        tooltip: {
          borderRadius: 4,
        },
      },
      MuiDivider: {
        root: {
          backgroundColor: '#404854',
        },
      },
      MuiListItemText: {
        primary: {
          fontWeight: theme.typography.fontWeightMedium,
        },
      },
      MuiListItemIcon: {
        root: {
          color: 'inherit',
          marginRight: 0,
          '& svg': {
            fontSize: 20,
          },
        },
      },
      MuiAvatar: {
        root: {
          width: 32,
          height: 32,
        },
      },
    },
  };
  
  const init = async () => {
    const con = await Acsys.isConnected();
    if (con) {
      ReactDOM.render(
        <body>
          <ThemeProvider theme={theme}>
            <AcsysProvider>
              <App />
            </AcsysProvider>
          </ThemeProvider>
        </body>,
        document.getElementById('root')
      );
    } else {
      ReactDOM.render(
        <body>
          <ThemeProvider theme={theme}>
            <Configuration />
          </ThemeProvider>
        </body>,
        document.getElementById('root')
      );
    }
  };
  
  init();
  
  // If you want your app to work offline and load faster, you can change
  // unregister() to register() below. Note this comes with some pitfalls.
  // Learn more about service workers: https://bit.ly/CRA-PWA
  serviceWorker.unregister();
  