feat: let extension skins declare base scheme

This commit is contained in:
Frank Song committed 2026-06-30 18:17:40 +08:00
1 parent 7c96296bf5
commit 70b019f710
5 files changed
+201 -13

No files matched your search

+9 -1
View File
@@ -102,6 +102,12 @@ Two ways to ship it:
declare it in `HERMES_WEBUI_EXTENSION_STYLESHEET_URLS`. No code changes
needed; the skin attribute can be set from your own JS.
Extensions that register a skin through `window.registerHermesSkin()` may
also set `scheme: "light"` or `scheme: "dark"` for light-only or dark-only
skins. The saved Theme preference stays unchanged, but WebUI applies the
matching effective base class while that skin is selected so System/Light or
System/Dark does not mix incompatible base tokens into the skin.
### Tips
- **Test both themes.** A skin that pops on Dark can be illegible on Light.
@@ -142,7 +148,9 @@ font size. Persists alongside theme and skin.
1. **Theme:** `document.documentElement.classList.toggle('dark', isDark)` —
light mode removes the class. System mode tracks
`matchMedia('(prefers-color-scheme: dark)')`.
`matchMedia('(prefers-color-scheme: dark)')`. Extension-registered skins
may declare a light/dark `scheme`; when selected, that scheme controls the
effective `.dark` class without rewriting the saved Theme preference.
2. **Skin:** `document.documentElement.dataset.skin = name` (or remove the
attribute for `default`).
3. **Font size:** `document.documentElement.dataset.fontSize = size` (or