roomruler/apps/front/src/theme.tsx

29 lines
549 B
TypeScript

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