Files
MoneyMgr/moneymgr_web/src/widgets/DarkThemeButtonWidget.tsx

22 lines
697 B
TypeScript

import Brightness7Icon from "@mui/icons-material/Brightness7";
import DarkModeIcon from "@mui/icons-material/DarkMode";
import { IconButton, Tooltip } from "@mui/material";
import { useDarkTheme } from "../hooks/context_providers/DarkThemeProvider";
export function DarkThemeButton(): React.ReactElement {
const darkTheme = useDarkTheme();
return (
<Tooltip title={`${darkTheme.enabled ? "Disable" : "Enable"} dark theme`}>
<IconButton
onClick={() => {
darkTheme.setEnabled(!darkTheme.enabled);
}}
style={{ color: "inherit" }}
>
{!darkTheme.enabled ? <DarkModeIcon /> : <Brightness7Icon />}
</IconButton>
</Tooltip>
);
}