feat(theme): add transparency effects toggle

This commit is contained in:
Paul Makles
2021-12-29 00:18:00 +00:00
parent 5974a2b83b
commit cc531705b4
6 changed files with 48 additions and 8 deletions

View File

@@ -214,14 +214,44 @@ export const DisplayLigaturesShim = observer(() => {
/**
* Component providing a way to toggle seasonal themes.
*/
export const DisplaySeasonalShim = observer(() => {
const settings = useApplicationState().settings;
return (
<Checkbox
checked={settings.get("appearance:seasonal") ?? true}
onChange={(v) => settings.set("appearance:seasonal", v)}
description={
<Text id="app.settings.pages.appearance.theme_options.seasonal_desc" />
}>
<Text id="app.settings.pages.appearance.theme_options.seasonal" />
</Checkbox>
);
});
/**
* Component providing a way to toggle transparency effects.
*/
export const DisplayTransparencyShim = observer(() => {
const settings = useApplicationState().settings;
return (
<Checkbox
checked={settings.get("appearance:transparency") ?? true}
onChange={(v) => settings.set("appearance:transparency", v)}
description={
<Text id="app.settings.pages.appearance.theme_options.transparency_desc" />
}>
<Text id="app.settings.pages.appearance.theme_options.transparency" />
</Checkbox>
);
});
export const ThemeOptionsShim = observer(() => {
const settings = useApplicationState().settings;
return (
<>
<h3>
<Text id="app.settings.pages.appearance.theme_options.title" />
</h3>
{/* TOFIX: WIP feature - follows system theme */}
{/*<Checkbox
checked={settings.get("appearance:seasonal") ?? true}