openfood/components/general/styling.tsx

23 lines
575 B
TypeScript

import {FC, useMemo} from "react";
import {createTheme, CssBaseline, ThemeProvider, useMediaQuery} from "@mui/material";
export const Styling: FC = ({children}) => {
const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
const theme = useMemo(
() =>
createTheme({
palette: {
mode: "dark",
},
}),
[prefersDarkMode]
);
return (
<ThemeProvider theme={theme}>
<CssBaseline/>
{children}
</ThemeProvider>
);
};