Format web UI assets

webui/settings.js

@@ -134,13 +134,19 @@ function renderEmptyState() {
   document.getElementById('settings-empty').classList.toggle('hidden', hasAccount);
   document.getElementById('settings-export-btn').disabled = !hasAccount;
   document.getElementById('settings-delete-btn').disabled = !hasAccount;
-  document.getElementById('settings-credentials-form').querySelectorAll('input, button').forEach((node) => {
+  document
-    node.disabled = !hasAccount;
+    .getElementById('settings-credentials-form')
-  });
+    .querySelectorAll('input, button')
+    .forEach((node) => {
+      node.disabled = !hasAccount;
+    });
   document.getElementById('settings-start-qr-btn').disabled = !hasAccount;
-  document.getElementById('settings-phone-form').querySelectorAll('input, button').forEach((node) => {
+  document
-    node.disabled = !hasAccount;
+    .getElementById('settings-phone-form')
-  });
+    .querySelectorAll('input, button')
+    .forEach((node) => {
+      node.disabled = !hasAccount;
+    });
   document.getElementById('settings-scrape-media-toggle').disabled = !hasAccount;
 }
 
@@ -163,7 +169,8 @@ function renderAccountData() {
 
   document.getElementById('health-credentials').textContent = health.api_credentials ? 'Saved' : 'Missing';
   document.getElementById('health-credentials').style.color = health.api_credentials ? 'var(--ok)' : 'var(--warn)';
-  document.getElementById('health-session').textContent = health.session_ready || isAccountAuthorized(auth) ? 'Ready' : 'Missing';
+  document.getElementById('health-session').textContent =
+    health.session_ready || isAccountAuthorized(auth) ? 'Ready' : 'Missing';
   document.getElementById('health-session').style.color =
     health.session_ready || isAccountAuthorized(auth) ? 'var(--ok)' : 'var(--warn)';
   document.getElementById('health-continuous').textContent = continuousStatus.running

webui/style.css

@@ -32,8 +32,7 @@ body {
   margin: 0;
   background:
     radial-gradient(circle at 16% -10%, rgba(53, 95, 199, 0.26), transparent 34rem),
-    radial-gradient(circle at 95% 18%, rgba(122, 165, 255, 0.1), transparent 28rem),
+    radial-gradient(circle at 95% 18%, rgba(122, 165, 255, 0.1), transparent 28rem), var(--bg-color);
-    var(--bg-color);
   color: var(--text-color);
   font-family: var(--font-ui);
   font-size: 15px;
@@ -68,9 +67,7 @@ button {
 }
 
 .sidebar {
-  background:
+  background: linear-gradient(180deg, rgba(17, 29, 60, 0.72), rgba(8, 11, 19, 0.94) 42%), var(--panel-alt);
-    linear-gradient(180deg, rgba(17, 29, 60, 0.72), rgba(8, 11, 19, 0.94) 42%),
-    var(--panel-alt);
   border-right: 1px solid var(--line);
   padding: 30px 24px;
   overflow-y: auto;
@@ -618,9 +615,7 @@ tbody tr:hover {
 }
 
 .viewer-sidebar {
-  background:
+  background: linear-gradient(180deg, rgba(17, 29, 60, 0.72), rgba(8, 11, 19, 0.94) 42%), var(--panel-alt);
-    linear-gradient(180deg, rgba(17, 29, 60, 0.72), rgba(8, 11, 19, 0.94) 42%),
-    var(--panel-alt);
   border-right: 1px solid var(--line);
   padding: 18px 14px;
   display: flex;
@@ -746,8 +741,7 @@ tbody tr:hover {
   background:
     radial-gradient(circle at 18% -12%, rgba(53, 95, 199, 0.18), transparent 32rem),
     radial-gradient(circle at 20px 20px, rgba(255, 255, 255, 0.025) 1px, transparent 1.5px),
-    radial-gradient(circle at 58px 54px, rgba(255, 255, 255, 0.018) 1px, transparent 1.5px),
+    radial-gradient(circle at 58px 54px, rgba(255, 255, 255, 0.018) 1px, transparent 1.5px), var(--bg-color);
-    var(--bg-color);
   background-size:
     auto,
     84px 84px,