diff --git a/locales/index.d.ts b/locales/index.d.ts
index bd7f29810d..344c4c51e6 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -13379,6 +13379,10 @@ export interface Locale extends ILocale {
*/
"keepFilesInUseDescription": string;
};
+ /**
+ * Custom font size
+ */
+ "customFontSize": string;
}
declare const locales: {
[lang: string]: Locale;
diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js
index 0488161513..c10f6a54ae 100644
--- a/packages/backend/src/server/web/boot.js
+++ b/packages/backend/src/server/web/boot.js
@@ -129,7 +129,12 @@
const fontSize = localStorage.getItem('fontSize');
if (fontSize) {
- document.documentElement.classList.add('f-' + fontSize);
+ if (fontSize === "custom") {
+ const customFontSize = localStorage.getItem('customFontSize');
+ document.documentElement.style.setProperty('font-size', `${customFontSize}px`);
+ } else {
+ document.documentElement.classList.add('f-' + fontSize);
+ }
}
const cornerRadius = localStorage.getItem('cornerRadius');
diff --git a/packages/frontend/src/local-storage.ts b/packages/frontend/src/local-storage.ts
index f1d660a45b..b5dd4ed038 100644
--- a/packages/frontend/src/local-storage.ts
+++ b/packages/frontend/src/local-storage.ts
@@ -20,6 +20,7 @@ export type Keys = (
'colorScheme' |
'useSystemFont' |
'fontSize' |
+ 'customFontSize' |
'cornerRadius' |
'ui' |
'ui_temp' |
diff --git a/packages/frontend/src/pages/settings/preferences.vue b/packages/frontend/src/pages/settings/preferences.vue
index d21faf61e9..1c8e418182 100644
--- a/packages/frontend/src/pages/settings/preferences.vue
+++ b/packages/frontend/src/pages/settings/preferences.vue
@@ -700,9 +700,16 @@ SPDX-License-Identifier: AGPL-3.0-only
+
+
+
+ {{ i18n.ts.customFontSize }}
+
+
+
{{ i18n.ts.useSystemFont }}
@@ -1081,6 +1088,7 @@ const defaultCW = ref($i.defaultCW);
const defaultCWPriority = ref($i.defaultCWPriority);
const lang = prefer.model('lang');
const fontSize = prefer.model('fontSize');
+const customFontSize = prefer.model('customFontSize');
const useSystemFont = prefer.model('useSystemFont');
const cornerRadius = prefer.model('cornerRadius');
const trustedDomains = prefer.model(
diff --git a/packages/frontend/src/preferences/def.ts b/packages/frontend/src/preferences/def.ts
index c712e96fb9..b651bdd31b 100644
--- a/packages/frontend/src/preferences/def.ts
+++ b/packages/frontend/src/preferences/def.ts
@@ -497,7 +497,18 @@ export const PREF_DEF = {
miLocalStorage.removeItem('fontSize');
}
},
- } as Pref<'0' | '1' | '2' | '3'>,
+ } as Pref<'0' | '1' | '2' | '3' | 'custom'>,
+ customFontSize: {
+ default: 14,
+ needsReload: true,
+ onSet: customFontSize => {
+ if (customFontSize) {
+ miLocalStorage.setItem('customFontSize', customFontSize.toString());
+ } else {
+ miLocalStorage.removeItem('customFontSize');
+ }
+ },
+ } as Pref,
useSystemFont: {
default: false,
needsReload: true,
diff --git a/sharkey-locales/en-US.yml b/sharkey-locales/en-US.yml
index d8602a1489..e5566da478 100644
--- a/sharkey-locales/en-US.yml
+++ b/sharkey-locales/en-US.yml
@@ -654,3 +654,5 @@ clearCachedFilesOptions:
oneYear: "one year"
keepFilesInUse: "Don't delete files used as avatars&c"
keepFilesInUseDescription: "this option requires more complicated database queries, you may need to increase the value of db.extra.statement_timeout in the configuration file"
+
+customFontSize: "Custom font size"