diff --git a/src/webui/js/theme-editor.js b/src/webui/js/theme-editor.js index 8233476..558c3ee 100644 --- a/src/webui/js/theme-editor.js +++ b/src/webui/js/theme-editor.js @@ -96,8 +96,8 @@ function renderLocalFonts(fonts) { fonts.forEach(font => { listDiv.innerHTML += `
- ${font} - + ${font} +
`; }); @@ -170,30 +170,28 @@ document.addEventListener("DOMContentLoaded", async () => { } if (fontUploadInput) { - fontUploadInput.addEventListener("change", async (e) => { - const file = e.target.files[0]; - if (!file) return; - const ext = file.name.split('.').pop().toLowerCase(); - if (!["woff", "woff2"].includes(ext)) { - fontUploadStatus.textContent = "Only .woff and .woff2 fonts are allowed."; - return; - } - const formData = new FormData(); - formData.append("file", file); - formData.append("theme", themeInfo.theme_name); - const res = await fetch("/api/font/upload", { method: "POST", body: formData }); - const result = await res.json(); - if (result.status === "ok") { - fontUploadStatus.textContent = "Font uploaded!"; - showToast("Font uploaded!", "success"); - localFonts = await fetchLocalFonts(themeInfo.theme_name); - refreshLocalFonts(); - } else { - fontUploadStatus.textContent = "Error uploading font."; - showToast("Error uploading font.", "error"); - } - }); - } + fontUploadInput.addEventListener("change", async (e) => { + const file = e.target.files[0]; + if (!file) return; + const ext = file.name.split('.').pop().toLowerCase(); + if (!["woff", "woff2"].includes(ext)) { + showToast("Only .woff and .woff2 fonts are allowed.", "error"); + return; + } + const formData = new FormData(); + formData.append("file", file); + formData.append("theme", themeInfo.theme_name); + const res = await fetch("/api/font/upload", { method: "POST", body: formData }); + const result = await res.json(); + if (result.status === "ok") { + showToast("✅ Font uploaded!", "success"); + localFonts = await fetchLocalFonts(themeInfo.theme_name); + refreshLocalFonts(); + } else { + showToast("Error uploading font.", "error"); + } + }); +} // Remove font button triggers modal if (localFontsList) { @@ -223,7 +221,7 @@ document.addEventListener("DOMContentLoaded", async () => { if (!fontToDelete) return; const result = await removeFont(themeInfo.theme_name, fontToDelete); if (result.status === "ok") { - showToast("Font removed!", "success"); + showToast("Font removed!", "✅ success"); localFonts = await fetchLocalFonts(themeInfo.theme_name); refreshLocalFonts(); } else { @@ -282,7 +280,7 @@ document.addEventListener("DOMContentLoaded", async () => { if (result.status === "ok") { faviconInput.value = result.filename; updateFaviconPreview(`/themes/${themeInfo.theme_name}/${result.filename}?t=${Date.now()}`); - showToast("Favicon uploaded!", "success"); + showToast("✅ Favicon uploaded!", "success"); } else { showToast("Error uploading favicon", "error"); } @@ -314,7 +312,7 @@ document.addEventListener("DOMContentLoaded", async () => { if (result.status === "ok") { faviconInput.value = ""; updateFaviconPreview(""); - showToast("Favicon removed!", "success"); + showToast("✅ Favicon removed!", "success"); } else { showToast("Error removing favicon", "error"); } @@ -393,7 +391,7 @@ document.addEventListener("DOMContentLoaded", async () => { body: JSON.stringify({ theme_name: themeInfo.theme_name, theme_yaml: data }) }); if (res.ok) { - showToast("Theme saved!", "success"); + showToast("✅ Theme saved!", "success"); } else { showToast("Error saving theme.", "error"); } diff --git a/src/webui/style/style.css b/src/webui/style/style.css index 4881568..65f2132 100644 --- a/src/webui/style/style.css +++ b/src/webui/style/style.css @@ -693,3 +693,28 @@ input[type="color"].color-input { top:0; opacity:0; } + +fieldset p { + font-size: 14px; + font-style: italic; + color: #b3b3b3; + margin-top: 0px; +} + +.font-name { + background: #1f2223; + color: #b3b3b3; + border: 1px solid #585858; + border-radius: 8px; + font-size: 15px; + font-weight: 400; + padding: 10px 14px; + margin-bottom: 4px; + outline: none; + transition: border-color 0.2s, background 0.2s; + box-shadow: 0 2px 8px rgba(0,0,0,0.07); +} + +#theme-editor-form button[type="button"]#choose-font-btn { + margin-top: 16px; +} \ No newline at end of file diff --git a/src/webui/theme-editor/index.html b/src/webui/theme-editor/index.html index 5254ba2..ebf3870 100644 --- a/src/webui/theme-editor/index.html +++ b/src/webui/theme-editor/index.html @@ -50,6 +50,7 @@

Colors

+

Set the color values for your theme

@@ -113,6 +114,7 @@

Google Fonts

+

Add Google Fonts to your theme

@@ -120,17 +122,16 @@
-

Upload Custom Font (.woff, .woff2)

-
+

Upload Custom Font

+

Supported formats: .woff, .woff2

-
- -
+

Fonts

+

Select where to apply your fonts

@@ -155,6 +156,7 @@

Favicon

+

Supported formats: .png, .jpg, .jpeg