feat: add System (auto) theme following OS prefers-color-scheme (#504)
Synthesized from PRs #506, #509, #514 (all by armorbreak001 and cloudyun888). Implementation: - static/index.html: flicker-prevention head script resolves 'system' to 'dark'/'light' via matchMedia before first paint. Adds 'System (auto)' as first option in theme picker. onchange calls _applyTheme(). - static/boot.js: new _applyTheme(name) helper — resolves 'system' via matchMedia, sets data-theme, registers a MQ change listener so the UI tracks OS switches live. loadSettings() now calls _applyTheme() instead of direct data-theme assignment. - static/commands.js: adds 'system' to valid /theme command names, delegates apply to _applyTheme(). - static/panels.js: _settingsThemeOnOpen reads from localStorage (preserves 'system' string, not the resolved 'dark'/'light'). _revertSettingsPreview calls _applyTheme() so reverting to 'system' correctly re-enables OS tracking. - static/i18n.js: cmd_theme description now lists 'system' first in all 5 locales (en, es, de, zh-Hans, zh-Hant). Design choices vs submitted PRs: - No separate system-theme.js file (unnecessary indirection). - matchMedia listener does NOT POST to /api/settings (OS can change rapidly; persisting on every OS switch would hammer the server). Co-authored-by: armorbreak001 <armorbreak001@users.noreply.github.com> Co-authored-by: cloudyun888 <cloudyun888@users.noreply.github.com>
This commit is contained in:
@@ -1112,7 +1112,7 @@ function toggleSettings(){
|
||||
if(!overlay) return;
|
||||
if(overlay.style.display==='none'){
|
||||
_settingsDirty = false;
|
||||
_settingsThemeOnOpen = document.documentElement.dataset.theme || 'dark';
|
||||
_settingsThemeOnOpen = localStorage.getItem('hermes-theme') || document.documentElement.dataset.theme || 'dark';
|
||||
_settingsSection = 'conversation';
|
||||
overlay.style.display='';
|
||||
loadSettingsPanel();
|
||||
@@ -1150,8 +1150,9 @@ function _closeSettingsPanel(){
|
||||
// Revert live DOM/localStorage to what they were when the panel opened
|
||||
function _revertSettingsPreview(){
|
||||
if(_settingsThemeOnOpen){
|
||||
document.documentElement.dataset.theme = _settingsThemeOnOpen;
|
||||
localStorage.setItem('hermes-theme', _settingsThemeOnOpen);
|
||||
if(typeof _applyTheme==='function') _applyTheme(_settingsThemeOnOpen);
|
||||
else document.documentElement.dataset.theme = _settingsThemeOnOpen;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user