mirror of
https://github.com/NousResearch/hermes-agent.git
synced 2026-05-07 02:51:50 +00:00
fix(kanban-dashboard): widen drawer, bump body fonts, fix code-block contrast (#19638)
Closes #18576. Addresses three of four complaints from the readability report; live-verified in a dashboard against a seeded task with body, comments, and run history. - Drawer default width 480px → 640px, exposed as the CSS var `--hermes-kanban-drawer-width` so deployments / user themes can override without forking the plugin. - Bump body/meta/pre/log/run-history font sizes from the 0.65-0.75rem cluster to the 0.78-0.85rem cluster. Long paths and code snippets in task bodies, run metadata, and worker logs are legible again instead of requiring a squint. - Fix the black-text-on-dark-theme regression in fenced markdown code blocks. Root cause: themes that don't define `--color-foreground` (NERV, at least) leave `color: var(--color-foreground)` resolving empty on <code>, which then falls back to the UA default (near-black) instead of inheriting from the drawer's <body>. Fix: force `color: inherit` on both inline and fenced code, and give the fenced block background via `currentColor` instead of `--color-foreground` so there's a visible card even when the theme var is absent. Out of scope for this PR (comments added to #18576): - Draggable resize handle (structural JS work; plugin ships built-only, no src/ in-tree). - Live worker-log viewer for running tasks (backend WS + component). - Sibling fix: themes like NERV should define --color-foreground. The current changes make the drawer robust against that gap, but the root fix belongs in the theme layer.
This commit is contained in:
Teknium
GitHub
parent
2a52e28568
commit
bff484a51b
1 changed files with 25 additions and 14 deletions
39
plugins/kanban/dashboard/dist/style.css
vendored
39
plugins/kanban/dashboard/dist/style.css
vendored
|
|
@ -268,7 +268,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.hermes-kanban-drawer {
|
.hermes-kanban-drawer {
|
||||||
width: min(480px, 92vw);
|
width: min(var(--hermes-kanban-drawer-width, 640px), 92vw);
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
background: var(--color-card);
|
background: var(--color-card);
|
||||||
border-left: 1px solid var(--color-border);
|
border-left: 1px solid var(--color-border);
|
||||||
|
|
@ -334,7 +334,7 @@
|
||||||
.hermes-kanban-meta-row {
|
.hermes-kanban-meta-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 0.5rem;
|
gap: 0.5rem;
|
||||||
font-size: 0.72rem;
|
font-size: 0.8rem;
|
||||||
}
|
}
|
||||||
.hermes-kanban-meta-label {
|
.hermes-kanban-meta-label {
|
||||||
width: 92px;
|
width: 92px;
|
||||||
|
|
@ -367,14 +367,15 @@
|
||||||
|
|
||||||
.hermes-kanban-pre {
|
.hermes-kanban-pre {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0.45rem 0.55rem;
|
padding: 0.5rem 0.6rem;
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
background: color-mix(in srgb, var(--color-foreground) 4%, transparent);
|
background: color-mix(in srgb, var(--color-foreground) 4%, transparent);
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-border);
|
||||||
border-radius: var(--radius-sm, 0.25rem);
|
border-radius: var(--radius-sm, 0.25rem);
|
||||||
font-family: var(--font-mono, ui-monospace, monospace);
|
font-family: var(--font-mono, ui-monospace, monospace);
|
||||||
font-size: 0.72rem;
|
font-size: 0.8rem;
|
||||||
|
line-height: 1.5;
|
||||||
color: var(--color-foreground);
|
color: var(--color-foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -605,8 +606,8 @@
|
||||||
/* ---- Markdown rendering -------------------------------------------- */
|
/* ---- Markdown rendering -------------------------------------------- */
|
||||||
|
|
||||||
.hermes-kanban-md {
|
.hermes-kanban-md {
|
||||||
font-size: 0.8rem;
|
font-size: 0.85rem;
|
||||||
line-height: 1.55;
|
line-height: 1.6;
|
||||||
color: var(--color-foreground);
|
color: var(--color-foreground);
|
||||||
}
|
}
|
||||||
.hermes-kanban-md p { margin: 0.25rem 0; }
|
.hermes-kanban-md p { margin: 0.25rem 0; }
|
||||||
|
|
@ -632,15 +633,22 @@
|
||||||
}
|
}
|
||||||
.hermes-kanban-md code {
|
.hermes-kanban-md code {
|
||||||
font-family: var(--font-mono, ui-monospace, monospace);
|
font-family: var(--font-mono, ui-monospace, monospace);
|
||||||
font-size: 0.75rem;
|
font-size: 0.8rem;
|
||||||
padding: 0.05rem 0.3rem;
|
padding: 0.05rem 0.3rem;
|
||||||
background: color-mix(in srgb, var(--color-foreground) 8%, transparent);
|
background: color-mix(in srgb, var(--color-foreground) 8%, transparent);
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
/* Fenced code block. Set a visible background even when --color-foreground
|
||||||
|
* is empty (color-mix falls through to transparent in that case), and force
|
||||||
|
* color: inherit so the text tracks the drawer foreground rather than the
|
||||||
|
* UA default on <code> elements — otherwise themes that don't set
|
||||||
|
* --color-foreground leave code text rendering near-black on dark themes
|
||||||
|
* (see issue #18576). */
|
||||||
.hermes-kanban-md-code {
|
.hermes-kanban-md-code {
|
||||||
margin: 0.35rem 0;
|
margin: 0.35rem 0;
|
||||||
padding: 0.5rem 0.6rem;
|
padding: 0.5rem 0.6rem;
|
||||||
background: color-mix(in srgb, var(--color-foreground) 5%, transparent);
|
background: color-mix(in srgb, currentColor 6%, transparent);
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-border);
|
||||||
border-radius: var(--radius-sm, 0.25rem);
|
border-radius: var(--radius-sm, 0.25rem);
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
|
|
@ -648,8 +656,9 @@
|
||||||
.hermes-kanban-md-code code {
|
.hermes-kanban-md-code code {
|
||||||
background: transparent;
|
background: transparent;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-size: 0.75rem;
|
font-size: 0.8rem;
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
|
color: inherit;
|
||||||
}
|
}
|
||||||
.hermes-kanban-md strong { font-weight: 600; }
|
.hermes-kanban-md strong { font-weight: 600; }
|
||||||
|
|
||||||
|
|
@ -684,11 +693,11 @@
|
||||||
/* ---- Worker log pane ------------------------------------------------ */
|
/* ---- Worker log pane ------------------------------------------------ */
|
||||||
|
|
||||||
.hermes-kanban-log {
|
.hermes-kanban-log {
|
||||||
max-height: 340px;
|
max-height: 360px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
font-size: 0.7rem;
|
font-size: 0.78rem;
|
||||||
line-height: 1.45;
|
line-height: 1.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -739,7 +748,8 @@
|
||||||
color: var(--color-muted-foreground);
|
color: var(--color-muted-foreground);
|
||||||
}
|
}
|
||||||
.hermes-kanban-run-summary {
|
.hermes-kanban-run-summary {
|
||||||
font-size: 0.75rem;
|
font-size: 0.82rem;
|
||||||
|
line-height: 1.5;
|
||||||
padding: 0.2rem 0 0;
|
padding: 0.2rem 0 0;
|
||||||
color: var(--color-foreground);
|
color: var(--color-foreground);
|
||||||
}
|
}
|
||||||
|
|
@ -751,7 +761,8 @@
|
||||||
}
|
}
|
||||||
.hermes-kanban-run-meta {
|
.hermes-kanban-run-meta {
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 0.65rem;
|
font-size: 0.72rem;
|
||||||
|
line-height: 1.5;
|
||||||
padding: 0.15rem 0 0;
|
padding: 0.15rem 0 0;
|
||||||
color: var(--color-muted-foreground);
|
color: var(--color-muted-foreground);
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue