v1.7.1: fix switch tema light/dark
Il selettore Impostazioni > Tema salvava il valore ma nessuno applicava data-theme al <html>, e mancavano gli override CSS per il tema chiaro. Aggiunte custom properties light + applyTheme() su init/change/save.
This commit is contained in:
1 parent
61459099f9
commit
a82f6f420c
3 files changed
+46
-3
No files matched your search
+1
-1
@@ -5,7 +5,7 @@ import os
|
|||||||
import sys
|
import sys
|
||||||
from pathlib import Path
|
from pathlib import Path
|
||||||
|
|
||||||
VERSION = "v1.7.0"
|
VERSION = "v1.7.1"
|
||||||
|
|
||||||
|
|
||||||
APP_NAME = "MusicTools"
|
APP_NAME = "MusicTools"
|
||||||
|
|||||||
+34
-2
@@ -58,6 +58,38 @@
|
|||||||
--shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.7);
|
--shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.7);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Tema chiaro: override delle custom properties via data-theme="light"
|
||||||
|
sull'elemento <html>. I colori brand (verde, blu, viola, ecc.) restano
|
||||||
|
uguali per non perdere identita'. */
|
||||||
|
html[data-theme="light"] {
|
||||||
|
--bg: #FFFFFF;
|
||||||
|
--bg-elev: #F7F7F8;
|
||||||
|
--bg-card: #FFFFFF;
|
||||||
|
--bg-card-2: #F2F3F5;
|
||||||
|
--bg-input: #EDEEF1;
|
||||||
|
--bg-input-hover: #E2E4E8;
|
||||||
|
|
||||||
|
--border: #E2E4E8;
|
||||||
|
--divider: #ECEDF0;
|
||||||
|
|
||||||
|
--text: #111315;
|
||||||
|
--text-2: #4A4D52;
|
||||||
|
--text-3: #8A8E94;
|
||||||
|
|
||||||
|
--green-dim: #C8F0D5;
|
||||||
|
--blue-dim: #D6E6FB;
|
||||||
|
--purple-dim: #E9D8FD;
|
||||||
|
--pink-dim: #FBCFE8;
|
||||||
|
--amber-dim: #FDE68A;
|
||||||
|
--rec-red-dim: #FECACA;
|
||||||
|
--indigo-dim: #C7D2FE;
|
||||||
|
|
||||||
|
--shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
|
||||||
|
--shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.1);
|
||||||
|
|
||||||
|
color-scheme: light;
|
||||||
|
}
|
||||||
|
|
||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@@ -1494,13 +1526,13 @@ input[type="number"]::-webkit-inner-spin-button {
|
|||||||
|
|
||||||
.rec-error-log {
|
.rec-error-log {
|
||||||
margin-top: 12px;
|
margin-top: 12px;
|
||||||
background: #0d0d0d;
|
background: var(--bg-card-2);
|
||||||
border: 1px solid var(--border);
|
border: 1px solid var(--border);
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
padding: 14px;
|
padding: 14px;
|
||||||
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #c0c0c0;
|
color: var(--text-2);
|
||||||
max-height: 320px;
|
max-height: 320px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
|
|||||||
@@ -440,6 +440,11 @@ function showView(name) {
|
|||||||
$$(".nav-item").forEach((b) => b.classList.toggle("active", b.dataset.view === name));
|
$$(".nav-item").forEach((b) => b.classList.toggle("active", b.dataset.view === name));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function applyTheme(theme) {
|
||||||
|
const t = theme === "light" ? "light" : "dark";
|
||||||
|
document.documentElement.dataset.theme = t;
|
||||||
|
}
|
||||||
|
|
||||||
$$(".nav-item").forEach((btn) => {
|
$$(".nav-item").forEach((btn) => {
|
||||||
btn.addEventListener("click", () => showView(btn.dataset.view));
|
btn.addEventListener("click", () => showView(btn.dataset.view));
|
||||||
});
|
});
|
||||||
@@ -470,6 +475,7 @@ async function init() {
|
|||||||
$("#cookiesInput").value = state.config.cookies_path || "";
|
$("#cookiesInput").value = state.config.cookies_path || "";
|
||||||
$("#outputInput").value = state.config.output_dir || "";
|
$("#outputInput").value = state.config.output_dir || "";
|
||||||
$("#themeSelect").value = state.config.theme || "dark";
|
$("#themeSelect").value = state.config.theme || "dark";
|
||||||
|
applyTheme(state.config.theme);
|
||||||
|
|
||||||
// Download tab — usa output_dir come default
|
// Download tab — usa output_dir come default
|
||||||
state.dlOutputDir = state.config.output_dir || "";
|
state.dlOutputDir = state.config.output_dir || "";
|
||||||
@@ -1027,6 +1033,10 @@ $("#browseOutputBtn").addEventListener("click", async () => {
|
|||||||
if (path) $("#outputInput").value = path;
|
if (path) $("#outputInput").value = path;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
$("#themeSelect").addEventListener("change", (e) => {
|
||||||
|
applyTheme(e.target.value);
|
||||||
|
});
|
||||||
|
|
||||||
$("#saveBtn").addEventListener("click", async () => {
|
$("#saveBtn").addEventListener("click", async () => {
|
||||||
const payload = {
|
const payload = {
|
||||||
client_id: $("#clientIdInput").value,
|
client_id: $("#clientIdInput").value,
|
||||||
@@ -1037,6 +1047,7 @@ $("#saveBtn").addEventListener("click", async () => {
|
|||||||
output_dir: $("#outputInput").value,
|
output_dir: $("#outputInput").value,
|
||||||
theme: $("#themeSelect").value,
|
theme: $("#themeSelect").value,
|
||||||
};
|
};
|
||||||
|
applyTheme(payload.theme);
|
||||||
const res = await window.pywebview.api.save_settings(payload);
|
const res = await window.pywebview.api.save_settings(payload);
|
||||||
if (res.ok) {
|
if (res.ok) {
|
||||||
state.config = payload;
|
state.config = payload;
|
||||||
|
|||||||
Reference in new issue
Block a user