From 23d9ba1fc990e0468b05d96a35ec3079ae710f2f Mon Sep 17 00:00:00 2001 From: max Date: Tue, 8 Sep 2026 18:59:33 +0200 Subject: [PATCH] Read and write badges as a matched coloured pair Info hue for read, warning hue for write, both as tints. Read no longer looks disabled next to write's alert box. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_0169iPWwKHZoBTNN9qwXiwqk --- media/panel.css | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/media/panel.css b/media/panel.css index 1d9c06d..acf7182 100644 --- a/media/panel.css +++ b/media/panel.css @@ -342,15 +342,23 @@ body.resizing { text-overflow: ellipsis; } +/* Read and write are a pair, so they get the same treatment: the theme's info and + warning hues, tinted for the background and border so both stay readable on any + theme. Before, write was an alert box and read a greyed-out label, which made read + look disabled rather than merely "not a write". */ .kind-read { - color: var(--vscode-descriptionForeground); - background: var(--vscode-badge-background); + --kind-hue: var(--vscode-editorInfo-foreground, var(--vscode-textLink-foreground)); } .kind-write { - color: var(--vscode-inputValidation-warningForeground, var(--vscode-foreground)); - background: var(--vscode-inputValidation-warningBackground); - border-color: var(--vscode-inputValidation-warningBorder, transparent); + --kind-hue: var(--vscode-editorWarning-foreground, var(--vscode-charts-orange)); +} + +.kind-read, +.kind-write { + color: var(--kind-hue); + background: color-mix(in srgb, var(--kind-hue) 16%, transparent); + border-color: color-mix(in srgb, var(--kind-hue) 45%, transparent); } /* --- filters popover ---------------------------------------------------- */