How-to use a Theme in your Application

To use a theme in your application, you need to import the appropriate theme (either light or dark) as follows:

import { ThemeProvider } from '@mui/material/styles';
import { StyledEngineProvider } from '@mui/material/styles';

// NOTE: replace the theme with your theme filename
import questTheme from "./QuestDesignSystemDarkTheme";

Then wrap your App or main component in the theme as follows:

<ThemeProvider theme={questTheme}>
  <StyledEngineProvider injectFirst>
    <Layout>
      <App />
    </Layout>
  </StyledEngineProvider>
</ThemeProvider>

Doing this will easily allow you to use the theme generated from Quest for your React App.