From bff484a51b8f12e8e4663b3a880709f2e8cfc1c1 Mon Sep 17 00:00:00 2001 From: Teknium <127238744+teknium1@users.noreply.github.com> Date: Mon, 4 May 2026 02:41:51 -0700 Subject: [PATCH] fix(kanban-dashboard): widen drawer, bump body fonts, fix code-block contrast (#19638) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 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 , which then falls back to the UA default (near-black) instead of inheriting from the drawer's . 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. --- plugins/kanban/dashboard/dist/style.css | 39 ++++++++++++++++--------- 1 file changed, 25 insertions(+), 14 deletions(-) diff --git a/plugins/kanban/dashboard/dist/style.css b/plugins/kanban/dashboard/dist/style.css index 74876aeff5..c638946ad2 100644 --- a/plugins/kanban/dashboard/dist/style.css +++ b/plugins/kanban/dashboard/dist/style.css @@ -268,7 +268,7 @@ } .hermes-kanban-drawer { - width: min(480px, 92vw); + width: min(var(--hermes-kanban-drawer-width, 640px), 92vw); height: 100vh; background: var(--color-card); border-left: 1px solid var(--color-border); @@ -334,7 +334,7 @@ .hermes-kanban-meta-row { display: flex; gap: 0.5rem; - font-size: 0.72rem; + font-size: 0.8rem; } .hermes-kanban-meta-label { width: 92px; @@ -367,14 +367,15 @@ .hermes-kanban-pre { margin: 0; - padding: 0.45rem 0.55rem; + padding: 0.5rem 0.6rem; white-space: pre-wrap; word-break: break-word; background: color-mix(in srgb, var(--color-foreground) 4%, transparent); border: 1px solid var(--color-border); border-radius: var(--radius-sm, 0.25rem); font-family: var(--font-mono, ui-monospace, monospace); - font-size: 0.72rem; + font-size: 0.8rem; + line-height: 1.5; color: var(--color-foreground); } @@ -605,8 +606,8 @@ /* ---- Markdown rendering -------------------------------------------- */ .hermes-kanban-md { - font-size: 0.8rem; - line-height: 1.55; + font-size: 0.85rem; + line-height: 1.6; color: var(--color-foreground); } .hermes-kanban-md p { margin: 0.25rem 0; } @@ -632,15 +633,22 @@ } .hermes-kanban-md code { font-family: var(--font-mono, ui-monospace, monospace); - font-size: 0.75rem; + font-size: 0.8rem; padding: 0.05rem 0.3rem; background: color-mix(in srgb, var(--color-foreground) 8%, transparent); 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 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 { margin: 0.35rem 0; 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-radius: var(--radius-sm, 0.25rem); overflow-x: auto; @@ -648,8 +656,9 @@ .hermes-kanban-md-code code { background: transparent; padding: 0; - font-size: 0.75rem; + font-size: 0.8rem; white-space: pre; + color: inherit; } .hermes-kanban-md strong { font-weight: 600; } @@ -684,11 +693,11 @@ /* ---- Worker log pane ------------------------------------------------ */ .hermes-kanban-log { - max-height: 340px; + max-height: 360px; overflow: auto; white-space: pre; - font-size: 0.7rem; - line-height: 1.45; + font-size: 0.78rem; + line-height: 1.5; } @@ -739,7 +748,8 @@ color: var(--color-muted-foreground); } .hermes-kanban-run-summary { - font-size: 0.75rem; + font-size: 0.82rem; + line-height: 1.5; padding: 0.2rem 0 0; color: var(--color-foreground); } @@ -751,7 +761,8 @@ } .hermes-kanban-run-meta { display: block; - font-size: 0.65rem; + font-size: 0.72rem; + line-height: 1.5; padding: 0.15rem 0 0; color: var(--color-muted-foreground); white-space: pre-wrap;