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 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0169iPWwKHZoBTNN9qwXiwqk
This commit is contained in:
max
2026-09-08 18:59:33 +02:00
co-authored by Claude Fable 5.1
parent 742788efa3
commit 23d9ba1fc9
+13 -5
View File
@@ -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 ---------------------------------------------------- */