From fe92f6a7e33ebc38fc6acf4f1a7e31d8073c6d9f Mon Sep 17 00:00:00 2001 From: Feuerfuchs Date: Tue, 12 Nov 2019 10:47:17 +0100 Subject: Add setting to use proportional font --- js/main.ts | 32 ++++++++++++++++++++++++++++++++ 1 file changed, 32 insertions(+) (limited to 'js') diff --git a/js/main.ts b/js/main.ts index 32c5a5b..29b4a68 100644 --- a/js/main.ts +++ b/js/main.ts @@ -21,6 +21,15 @@ const settings = new KeyValueStore({ ], valueRange: [false, true] }, + monospaceFont: { + value: ensureSetting('monospace-font', '1') === '1', + callbacks: [ + value => { + localStorage.setItem('monospace-font', value ? '1' : '0'); + } + ], + valueRange: [false, true] + }, imagePreviews: { value: ensureSetting('image-previews', '1') === '1', callbacks: [ @@ -110,6 +119,29 @@ const settings = new KeyValueStore({ // + const settingMonospaceFontEl = document.getElementsByClassName('setting--monospace-font')[0]; + const settingMonospaceFontValueEl = settingMonospaceFontEl.getElementsByClassName('setting__value')[0]; + const settingMonospaceFontCallback = (value: boolean) => { + if (value) { + contentEl.classList.add("content--has-monospace-font"); + } else { + contentEl.classList.remove("content--has-monospace-font"); + } + + settingMonospaceFontValueEl.textContent = value ? '[yes]' : '[no]'; + } + + settingMonospaceFontValueEl.addEventListener('click', e => { + e.preventDefault(); + settings.cycleValue('monospaceFont'); + return false; + }); + + settingMonospaceFontCallback(settings.getValue('monospaceFont')); + settings.addCallback('monospaceFont', settingMonospaceFontCallback); + + // + const settingWordWrapEl = document.getElementsByClassName('setting--word-wrap')[0]; const settingWordWrapValueEl = settingWordWrapEl.getElementsByClassName('setting__value')[0]; const settingWordWrapCallback = (value: boolean) => { -- cgit v1.2.3-70-g09d2