Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-07-13 03:27:39 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Allow user theme font selection #562

Browse source
This commit is contained in:
the-djmaze 2022-10-20 09:33:44 +02:00
parent a9ea62abc2
commit b690370557
43 changed files with 208 additions and 189 deletions
Download patch file Download diff file Expand all files Collapse all files

42
dev/Stores/Theme.js
View file

@ -1,5 +1,5 @@
import ko from 'ko';
import { doc, $htmlCL, leftPanelDisabled, Settings, SettingsGet } from 'Common/Globals';
import { doc, $htmlCL, elementById, leftPanelDisabled, Settings, SettingsGet } from 'Common/Globals';
import { isArray } from 'Common/Utils';
import { serverRequestRaw } from 'Common/Links';
@ -8,6 +8,9 @@ export const ThemeStore = {
themes: ko.observableArray(),
userBackgroundName: ko.observable(''),
userBackgroundHash: ko.observable(''),
fontSansSerif: ko.observable(''),
fontSerif: ko.observable(''),
fontMono: ko.observable(''),
isMobile: ko.observable($htmlCL.contains('rl-mobile')),
populate: () => {
@ -19,6 +22,9 @@ export const ThemeStore = {
ThemeStore.userBackgroundName(SettingsGet('UserBackgroundName'));
ThemeStore.userBackgroundHash(SettingsGet('UserBackgroundHash'));
}
ThemeStore.fontSansSerif(SettingsGet('fontSansSerif'));
ThemeStore.fontSerif(SettingsGet('fontSerif'));
ThemeStore.fontMono(SettingsGet('fontMono'));
leftPanelDisabled(ThemeStore.isMobile());
}
@ -26,6 +32,40 @@ export const ThemeStore = {
ThemeStore.isMobile.subscribe(value => $htmlCL.toggle('rl-mobile', value));
ThemeStore.fontSansSerif.subscribe(value => {
if (null != value) {
let cl = elementById('rl-app').classList;
cl.forEach(name => {
if ('font' === name.slice(0,4) && !/font(Serif|Mono)/.test(name)) {
cl.remove(name);
}
});
value && cl.add('font'+value);
}
});
ThemeStore.fontSerif.subscribe(value => {
if (null != value) {
let cl = elementById('rl-app').classList;
cl.forEach(name => {
if ('fontSerif' === name.slice(0,9)) {
cl.remove(name);
}
});
value && cl.add('fontSerif'+value);
}
});
ThemeStore.fontMono.subscribe(value => {
if (null != value) {
let cl = elementById('rl-app').classList;
cl.forEach(name => {
if ('fontMono' === name.slice(0,9)) {
cl.remove(name);
}
});
value && cl.add('fontMono'+value);
}
});
ThemeStore.userBackgroundHash.subscribe(value => {
if (value) {
$htmlCL.add('UserBackground');