theme: catppuccin mocha across dashboard + agent UI

This commit is contained in:
müde 2026-05-15 17:49:54 +02:00
parent 68fe66c0ef
commit f33fc3dd50
2 changed files with 40 additions and 42 deletions

View file

@ -1,16 +1,18 @@
:root {
--bg: #0a0014;
--bg-elev: #18002a;
--fg: #e0d4ff;
--muted: #6c5c8c;
--purple: #cc66ff;
--purple-dim: #4a1a6a;
--cyan: #00ffff;
--pink: #ff3399;
--amber: #ffaa00;
--green: #00ff88;
--red: #ff4466;
--border: #2a0a4a;
/* Catppuccin Mocha. Keep the legacy variable names so per-class styles
don't need to be rewritten only the values change. */
--bg: #1e1e2e; /* base */
--bg-elev: #181825; /* mantle */
--fg: #cdd6f4; /* text */
--muted: #7f849c; /* overlay1 */
--purple: #cba6f7; /* mauve */
--purple-dim: #45475a; /* surface1 */
--cyan: #89dceb; /* sky */
--pink: #f5c2e7; /* pink */
--amber: #fab387; /* peach */
--green: #a6e3a1; /* green */
--red: #f38ba8; /* red */
--border: #313244; /* surface0 */
}
body {
background: var(--bg);
@ -26,7 +28,6 @@ body {
text-align: center;
margin: 0 0 1em 0;
font-size: 0.95em;
text-shadow: 0 0 6px rgba(204, 102, 255, 0.5);
overflow-x: auto;
}
h1, h2 {
@ -34,7 +35,6 @@ h1, h2 {
text-transform: uppercase;
letter-spacing: 0.15em;
margin-top: 2em;
text-shadow: 0 0 8px rgba(204, 102, 255, 0.4);
}
.divider {
color: var(--purple-dim);
@ -48,13 +48,9 @@ li { padding: 0.5em 0; }
a {
color: var(--cyan);
text-decoration: none;
text-shadow: 0 0 4px rgba(0, 255, 255, 0.5);
font-weight: bold;
}
a:hover {
color: #fff;
text-shadow: 0 0 12px rgba(0, 255, 255, 0.9);
}
a:hover { color: var(--fg); }
.role {
display: inline-block;
margin-left: 0.4em;
@ -65,8 +61,8 @@ a:hover {
letter-spacing: 0.1em;
text-transform: uppercase;
}
.role-m1nd { color: var(--pink); border-color: var(--pink); background: rgba(255, 51, 153, 0.1); }
.role-ag3nt { color: var(--amber); border-color: var(--amber); background: rgba(255, 170, 0, 0.1); }
.role-m1nd { color: var(--pink); border-color: var(--pink); background: rgba(245, 194, 231, 0.08); }
.role-ag3nt { color: var(--amber); border-color: var(--amber); background: rgba(250, 179, 135, 0.08); }
.meta { color: var(--muted); font-size: 0.85em; margin-left: 0.4em; }
.id { color: var(--pink); font-weight: bold; margin-right: 0.4em; }
.agent { color: var(--amber); font-weight: bold; margin-right: 0.6em; }
@ -91,9 +87,8 @@ ul form.inline { display: inline-block; }
border: 1px solid;
padding: 0.25em 0.8em;
cursor: pointer;
text-shadow: 0 0 4px currentColor;
}
.btn:hover { background: rgba(255,255,255,0.05); text-shadow: 0 0 12px currentColor; }
.btn:hover { background: rgba(205, 214, 244, 0.06); }
.btn-approve { color: var(--green); border-color: var(--green); }
.btn-deny { color: var(--red); border-color: var(--red); }
.btn-destroy { color: var(--red); border-color: var(--red); font-size: 0.75em; padding: 0.15em 0.5em; margin-left: 0.6em; }