diff --git a/src/pages/SpeedFlowchartPage.tsx b/src/pages/SpeedFlowchartPage.tsx index 8e16dc6..697a26c 100644 --- a/src/pages/SpeedFlowchartPage.tsx +++ b/src/pages/SpeedFlowchartPage.tsx @@ -7,6 +7,7 @@ import { SpeedRoundPair, } from '../data/SpeedFlowchart'; import { Card, CardContent, Grid, Skeleton, Typography } from '@mui/material'; +import { theme } from '../utils/Theme'; interface SpeedRoundPairDummy extends SpeedRoundPair { dummy: boolean; @@ -88,6 +89,13 @@ export default function SpeedFlowchartPage() { diff --git a/src/utils/Theme.tsx b/src/utils/Theme.tsx index bfe42f8..bd8c775 100644 --- a/src/utils/Theme.tsx +++ b/src/utils/Theme.tsx @@ -1,6 +1,19 @@ import { CssBaseline } from '@mui/material'; import { ThemeProvider, createTheme } from '@mui/material/styles'; +export const theme = createTheme({ + components: { + MuiToggleButton: { + defaultProps: { + disableRipple: true, + }, + }, + }, + palette: { + mode: 'dark', + }, +}); + /** * Sets a MaterialUi theme for its children * @param {any} props accepts JSX elements to wrap theme in @@ -8,21 +21,8 @@ import { ThemeProvider, createTheme } from '@mui/material/styles'; */ export default function Theme(props: { children: JSX.Element }) { const { children } = props; - - const Theme = createTheme({ - components: { - MuiToggleButton: { - defaultProps: { - disableRipple: true, - }, - }, - }, - palette: { - mode: 'dark', - }, - }); return ( - + {children}