Add zooming functionality (#140)

This commit is contained in:
Gelaechter 2023-06-11 19:45:13 +00:00 committed by GitHub
parent 72099cb1fe
commit d7ca25525c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 74 additions and 4 deletions

View file

@ -1,10 +1,13 @@
import { Select } from '/@/renderer/components';
import isElectron from 'is-electron';
import { NumberInput, Select } from '/@/renderer/components';
import {
SettingsSection,
SettingOption,
} from '/@/renderer/features/settings/components/settings-section';
import { useGeneralSettings, useSettingsStoreActions } from '/@/renderer/store/settings.store';
const localSettings = isElectron() ? window.electron.localSettings : null;
const FONT_OPTIONS = [
{ label: 'Archivo', value: 'Archivo' },
{ label: 'Fredoka', value: 'Fredoka' },
@ -53,6 +56,32 @@ export const ApplicationSettings = () => {
isHidden: false,
title: 'Font (Content)',
},
{
control: (
<NumberInput
disabled={!isElectron()}
max={300}
min={50}
value={settings.zoomFactor}
onBlur={(e) => {
if (!e) return;
const newVal = e.currentTarget.value
? Math.min(Math.max(Number(e.currentTarget.value), 50), 300)
: settings.zoomFactor;
setSettings({
general: {
...settings,
zoomFactor: newVal,
},
});
localSettings.setZoomFactor(newVal);
}}
/>
),
description: 'Sets the application zoom factor in percent',
isHidden: false,
title: 'Zoom factor',
},
];
return <SettingsSection options={options} />;