Improve soleprint docs: bilingual EN/ES, system pages, architecture cleanup

2026-01-27 09:15:59 -03:00
parent ed1c8f6c96
commit fa7bbe3953
6 changed files with 1366 additions and 51 deletions
--- a/docs/lang-toggle.js
+++ b/docs/lang-toggle.js
@@ -0,0 +1,54 @@
+// Language toggle for soleprint docs
+// Include this script and add: <div id="lang-toggle"></div> in header
+
+(function () {
+  function setLang(lang) {
+    localStorage.setItem("spr-docs-lang", lang);
+    document.documentElement.lang = lang;
+    document.querySelectorAll(".lang-toggle button").forEach((btn) => {
+      btn.classList.toggle("active", btn.dataset.lang === lang);
+    });
+  }
+
+  document.addEventListener("DOMContentLoaded", () => {
+    const currentLang = localStorage.getItem("spr-docs-lang") || "en";
+
+    // Inject toggle HTML
+    const container = document.getElementById("lang-toggle");
+    if (container) {
+      container.className = "lang-toggle";
+
+      const btnEn = document.createElement("button");
+      btnEn.textContent = "EN";
+      btnEn.dataset.lang = "en";
+      btnEn.addEventListener("click", () => setLang("en"));
+
+      const btnEs = document.createElement("button");
+      btnEs.textContent = "ES";
+      btnEs.dataset.lang = "es";
+      btnEs.addEventListener("click", () => setLang("es"));
+
+      container.appendChild(btnEn);
+      container.appendChild(btnEs);
+    }
+
+    setLang(currentLang);
+  });
+
+  // Inject styles
+  const style = document.createElement("style");
+  style.textContent = `
+        .lang-toggle { position: absolute; top: 1.5rem; right: 2rem; display: flex; border: 1px solid #888; border-radius: 4px; overflow: hidden; }
+        .lang-toggle button { background: #1a1a1a; border: none; color: #888; padding: 0.4rem 0.8rem; font-family: inherit; font-size: 0.75rem; cursor: pointer; }
+        .lang-toggle button:first-child { border-right: 1px solid #888; }
+        .lang-toggle button:hover { background: #0a0a0a; color: #fff; }
+        .lang-toggle button.active { background: var(--accent, #b91c1c); color: #fff; }
+        header { position: relative; }
+        .lang-en, .lang-es { display: none; }
+        html[lang="en"] .lang-en { display: block; }
+        html[lang="es"] .lang-es { display: block; }
+        html[lang="en"] span.lang-en { display: inline; }
+        html[lang="es"] span.lang-es { display: inline; }
+    `;
+  document.head.appendChild(style);
+})();