Changeset 0.22.9 (#151)

2026-03-04 17:39:22 +00:00
parent 7e26a2a261
commit 6ed76fb2d3
27 changed files with 3392 additions and 3224 deletions
--- a/src/css/variables.css
+++ b/src/css/variables.css
@@ -0,0 +1,124 @@
+/* ── variables.css ────────────────────────────
+   Theme variables, reset, base styles
+   ──────────────────────────────────────────── */
+
+@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700&family=JetBrains+Mono:wght@400;500&display=swap');
+
+/* ==========================================
+   Chat Switchboard
+   Clean utility layout · Open WebUI inspired
+   ========================================== */
+
+:root {
+    /* ── Core palette (Dark — default) ────────── */
+    --bg:           #0e0e10;
+    --bg-surface:   #18181b;
+    --bg-raised:    #222227;
+    --bg-hover:     #2a2a30;
+    --border:       #2e2e35;
+    --border-light: #3a3a42;
+    --text:         #e8e8ed;
+    --text-2:       #9898a8;
+    --text-3:       #6b6b7b;
+    --accent:       #6c9fff;
+    --accent-hover: #84b0ff;
+    --accent-dim:   rgba(108,159,255,0.12);
+    --danger:       #ef4444;
+    --success:      #22c55e;
+    --warning:      #eab308;
+    --purple:       #a78bfa;
+    --purple-dim:   rgba(167,139,250,0.10);
+
+    /* ── Contrast text for solid-color backgrounds ── */
+    --text-on-color:   #fff;
+    --text-on-warning: #000;
+
+    /* ── Light variants (badge/pill text on dim backgrounds) ── */
+    --accent-light:  #93c5fd;
+    --danger-light:  #f87171;
+    --success-light: #4ade80;
+    --warning-light: #fbbf24;
+
+    /* ── Dim variants (badge/pill backgrounds) ── */
+    --danger-dim:    rgba(239,68,68,0.2);
+    --success-dim:   rgba(34,197,94,0.2);
+    --warning-dim:   rgba(234,179,8,0.2);
+
+    /* ── Surfaces ────────────────────────────── */
+    --overlay:       rgba(0,0,0,0.55);
+    --glass:         rgba(255,255,255,0.03);
+    --input-bg:      #1a1a1f;
+    --user-bubble:   rgba(108,159,255,0.08);
+    --shadow-lg:     0 8px 32px rgba(0,0,0,0.5);
+
+    /* ── Layout ──────────────────────────────── */
+    --radius:       8px;
+    --radius-lg:    12px;
+    --sidebar-w:    260px;
+    --sidebar-rail: 52px;
+    --font:         'DM Sans', 'Söhne', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    --mono:         'JetBrains Mono', 'Söhne Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
+    --transition:   180ms ease;
+
+    /* Banner system — set by JS from /api/v1/admin/settings/banner */
+    --banner-top-height: 0px;
+    --banner-bottom-height: 0px;
+    --banner-bg: transparent;
+    --banner-fg: transparent;
+}
+
+/* ── Light Theme ─────────────────────────────── */
+[data-theme="light"] {
+    --bg:           #f7f7fa;
+    --bg-surface:   #ffffff;
+    --bg-raised:    #eff0f3;
+    --bg-hover:     #e5e6eb;
+    --border:       #d5d6dc;
+    --border-light: #c2c3cb;
+    --text:         #1a1a2e;
+    --text-2:       #555770;
+    --text-3:       #8b8da3;
+    --accent:       #4a7cdb;
+    --accent-hover: #3968c4;
+    --accent-dim:   rgba(74,124,219,0.09);
+    --danger:       #dc2626;
+    --success:      #16a34a;
+    --warning:      #ca8a04;
+    --purple:       #7c3aed;
+    --purple-dim:   rgba(124,58,237,0.08);
+
+    --text-on-color:   #fff;
+    --text-on-warning: #000;
+
+    --accent-light:  #2563eb;
+    --danger-light:  #dc2626;
+    --success-light: #16a34a;
+    --warning-light: #ca8a04;
+
+    --danger-dim:    rgba(220,38,38,0.09);
+    --success-dim:   rgba(22,163,74,0.09);
+    --warning-dim:   rgba(202,138,4,0.09);
+
+    --overlay:       rgba(0,0,0,0.25);
+    --glass:         rgba(0,0,0,0.02);
+    --input-bg:      #f2f3f6;
+    --user-bubble:   rgba(74,124,219,0.06);
+    --shadow-lg:     0 8px 32px rgba(0,0,0,0.1);
+
+    color-scheme: light;
+}
+
+*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
+html, body { height: 100%; }
+body { font-family: var(--font); background: var(--bg); color: var(--text); overflow: hidden; font-size: 14px; }
+
+/* Global scrollbar styling */
+* { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
+::-webkit-scrollbar { width: 6px; height: 6px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
+::-webkit-scrollbar-thumb:hover { background: var(--border-light); }
+a { color: var(--accent); text-decoration: none; }
+a:hover { text-decoration: underline; }
+::selection { background: var(--accent-dim); }
+