xiaoqidun/ofdgo
1
0 Fork 0
mirror of https://github.com/xiaoqidun/ofdgo.git synced 2026-10-31 22:04:06 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(界面设计): 统一主题与材质选择样式
build.yaml / build (push) Successful in 43s
Details

Browse Source
This commit is contained in:
xiaoqidun committed 2026-10-31 11:00:45 +08:00
1 parent 2abc0b878c
commit d5533841c0
5 files changed
+43 -30
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

assets/webui/ofdgo_theme.js
+7 -7
View File
@@ -3,7 +3,7 @@
const preference = matchMedia("(prefers-color-scheme: dark)");
const key = "ofdgo.theme";
let mode = root.dataset.themeMode || "system";
let material = root.dataset.titlebarChoice || "mica";
let material = root.dataset.titlebarChoice || "acrylic";
let host = null, report = null, pending = Promise.resolve(), revision = 0, committed = null;
if (!root.dataset.themeMode) {
try { mode = localStorage.getItem(key) || "system"; } catch {}
@@ -14,8 +14,7 @@
root.dataset.theme = mode === "system" ? preference.matches ? "dark" : "light" : mode;
document.querySelector('meta[name="theme-color"]').content = root.dataset.theme === "dark" ? "#272e33" : "#fafbfc";
for (const button of document.querySelectorAll("[data-theme-choice]")) button.dataset.pressed = String(button.dataset.themeChoice === mode);
const select = document.querySelector("#titleBarMaterial");
if (select) select.value = material;
for (const button of document.querySelectorAll("[data-material-choice]")) button.dataset.pressed = String(button.dataset.materialChoice === material);
}
function sync() {
if (!host) return;
@@ -58,12 +57,13 @@
window.ofdgoTheme = {set, flush, connect(value, onError) {
host = value;
report = onError;
const select = document.querySelector("#titleBarMaterial");
const materials = (root.dataset.titlebarMaterials || "").split(",");
if (host && materials.length > 1) {
for (const option of [...select.options]) if (!materials.includes(option.value)) option.remove();
select.closest(".appearance-material").hidden = false;
select.addEventListener("change", () => { material = select.value; sync(); });
document.querySelector(".appearance-material").hidden = false;
for (const button of document.querySelectorAll("[data-material-choice]")) {
button.hidden = !materials.includes(button.dataset.materialChoice);
button.addEventListener("click", () => { material = button.dataset.materialChoice; apply(); sync(); });
}
}
apply();
sync();