Einstellungen: Vollbild-Seite, Kontrast, Stundenhöhe, KW-Anzeige
- Einstellungen von Modal-Popup auf Vollbild-Seite mit Seitennavigation umgestellt - Schriftkontrast (4 Stufen) und Linienkontrast (4 Stufen) pro Benutzer gespeichert - Stundenhöhe (40/60/80/100px) in Wochen-/Tagesansicht per Einstellung steuerbar - Kalenderwoche in Monats- und Wochenansicht grösser dargestellt - CSS-Variable --hour-h für dynamische Zeitraster-Höhe in week.js und app.css - Backend: neue Felder text_contrast, line_contrast, hour_height in UserSettings
This commit is contained in:
@@ -63,12 +63,37 @@ export function getISOWeekNumber(d) {
|
||||
return Math.ceil((((date - yearStart) / 86400000) + 1) / 7);
|
||||
}
|
||||
|
||||
const TEXT_CONTRAST = {
|
||||
1: { t1: '#606070', t2: '#484858', t3: '#303040' },
|
||||
2: { t1: '#9090a8', t2: '#6a6a80', t3: '#484860' },
|
||||
3: { t1: '#c8c8d8', t2: '#9090aa', t3: '#55556a' },
|
||||
4: { t1: '#ffffff', t2: '#c0c0d8', t3: '#8888a0' },
|
||||
};
|
||||
const LINE_CONTRAST = {
|
||||
1: { border: '#1e1e2c', light: '#181826' },
|
||||
2: { border: '#2a2a3c', light: '#222230' },
|
||||
3: { border: '#3a3a52', light: '#2e2e40' },
|
||||
4: { border: '#5a5a78', light: '#484860' },
|
||||
};
|
||||
|
||||
export function applyTheme(settings) {
|
||||
const root = document.documentElement;
|
||||
root.style.setProperty('--primary', settings.primary_color || '#4285f4');
|
||||
root.style.setProperty('--primary-dim', hexToRgba(settings.primary_color || '#4285f4', 0.15));
|
||||
root.style.setProperty('--accent', settings.accent_color || '#ea4335');
|
||||
root.style.setProperty('--today-color', settings.today_color || '#4285f4');
|
||||
root.style.setProperty('--primary', settings.primary_color || '#4285f4');
|
||||
root.style.setProperty('--primary-dim', hexToRgba(settings.primary_color || '#4285f4', 0.15));
|
||||
root.style.setProperty('--accent', settings.accent_color || '#ea4335');
|
||||
root.style.setProperty('--today-color', settings.today_color || '#4285f4');
|
||||
|
||||
const tc = TEXT_CONTRAST[settings.text_contrast || 3];
|
||||
root.style.setProperty('--text-1', tc.t1);
|
||||
root.style.setProperty('--text-2', tc.t2);
|
||||
root.style.setProperty('--text-3', tc.t3);
|
||||
|
||||
const lc = LINE_CONTRAST[settings.line_contrast || 3];
|
||||
root.style.setProperty('--border', lc.border);
|
||||
root.style.setProperty('--border-light', lc.light);
|
||||
|
||||
const hh = settings.hour_height || 60;
|
||||
root.style.setProperty('--hour-h', hh + 'px');
|
||||
}
|
||||
|
||||
function hexToRgba(hex, alpha) {
|
||||
|
||||
Reference in New Issue
Block a user