Remove light theme; complete color/spacing/radius design tokens; section styles.css (v0.13.0)

2026-09-17 20:58:27 -04:00
parent 43ba59b302
commit b72afdcee3
8 changed files with 763 additions and 178 deletions
@@ -1,5 +1,5 @@
 // ============================================================================
-// app.js -- core client application: state, API helper, theme, dashboard,
+// app.js -- core client application: state, API helper, dashboard,
 // Hosted Sites & Proxy Hosts rendering, routing between views, dialogs (create/
 // edit/icon/user/account/MFA), and every event listener for those areas. The
 // remaining views (Streaming, Redirects, Access Lists, Administration panels)
@@ -19,19 +19,6 @@ const proxyAccessLabel = document.querySelector("#proxy-form [name=accessListId]
 const settingsAccessLabel = document.querySelector("#settings-access-list")?.closest("label"); const settingsTlsLabel = document.querySelector("#settings-form [name=tls]")?.closest("label"); if (settingsAccessLabel && settingsTlsLabel) settingsTlsLabel.before(settingsAccessLabel);
 document.querySelector("#settings-advanced [name=accessListId]")?.closest("label")?.remove();

-// --- Theme (light/dark/system) -------------------------------------------------
-const systemTheme = window.matchMedia("(prefers-color-scheme: dark)");
-
-function applyTheme(preference) {
-  const effective = preference === "system" ? (systemTheme.matches ? "dark" : "light") : preference;
-  document.documentElement.dataset.theme = effective;
-  document.querySelector('meta[name="theme-color"]').content = effective === "dark" ? "#08101d" : "#f3f6fa";
-}
-const savedTheme = localStorage.getItem("webserver-theme") || "system";
-$("#theme-select").value = savedTheme; applyTheme(savedTheme);
-$("#theme-select").addEventListener("change", event => { localStorage.setItem("webserver-theme", event.target.value); applyTheme(event.target.value); });
-systemTheme.addEventListener("change", () => { if ($("#theme-select").value === "system") applyTheme("system"); });
-
 // --- API helper ------------------------------------------------------------------

 async function api(url, options = {}) {
@@ -3,11 +3,11 @@
 <head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
-  <meta name="theme-color" content="#0b1220">
+  <meta name="theme-color" content="#08101d">
  <title>Site Gateway</title>
  <meta name="description" content="Host sites, proxy services, and manage HTTPS from one simple dashboard.">
  <link rel="icon" type="image/png" href="/site-gateway-icon-approved.png">
-  <link rel="stylesheet" href="/styles.css?v=0.12.0">
+  <link rel="stylesheet" href="/styles.css?v=0.13.0">
 </head>

 <!-- ================================================================
@@ -86,7 +86,6 @@
    </aside>
    <main>
      <div class="utility-bar" aria-label="Account and appearance">
-        <label class="theme-control" for="theme-select"><span>Theme</span><select id="theme-select" aria-label="Color theme"><option value="system">System</option><option value="dark">Dark</option><option value="light">Light</option></select></label>
        <div class="account-control"><span>Signed in as <strong id="user-label">admin</strong></span><button id="logout" class="text-button">Sign out</button></div>
      </div>
      <nav class="mobile-nav" aria-label="Dashboard sections">
@@ -430,6 +429,6 @@
  <div id="toast" class="toast" role="status"></div>
  <div id="update-banner" class="update-banner hidden" role="status"><span>A new version of Site Gateway is available.</span><div class="update-banner-actions"><button id="update-banner-refresh" class="button primary">Refresh</button><button id="update-banner-dismiss" class="text-button">Dismiss</button></div></div>
  <!-- App scripts: core (app.js) then extended views/admin (features.js) -->
-  <script src="/app.js?v=0.11.119" defer></script><script src="/features.js?v=0.11.114" defer></script>
+  <script src="/app.js?v=0.13.0" defer></script><script src="/features.js?v=0.13.0" defer></script>
 </body>
 </html>