From 5d12689d930618c08b4a79d02fc0cb9f855273e9 Mon Sep 17 00:00:00 2001 From: mattshax Date: Fri, 25 Sep 2026 14:10:35 +0000 Subject: [PATCH] fix(chat): the conversations rail matches the Library rail under ai-chat 0.5 An audit of the Studio's rules against the ai-chat 0.5 markup found two more selectors written for 0.4 that no longer matched. The rail is now an aside on the muted-panel token rather than theme-panel border-r, so it lost the Library rail's background: identical in light mode, #2e3032 against #232528 in dark. And its rows render as spans in li, button, and a elements rather than bare links, so they grew from the Library tree's 13px to 14px. Both rules now match either version. Measured in a browser after the change: the rail is #232528 in dark and white in light, rows and actions are 13px, and the Chats header stays 14px. The audit's other unmatched selectors apply only in states the check did not render (the activity drawer open, a reply streaming, dark mode) and their classes still ship in 0.5. --- web/src/styles.css | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/web/src/styles.css b/web/src/styles.css index 20fce3d..4b22a2c 100644 --- a/web/src/styles.css +++ b/web/src/styles.css @@ -309,7 +309,11 @@ main.content { min-height: 0; min-width: 0; } dark mode. They all take the same muted-panel token now. */ .library-rail { flex-shrink: 0; display: flex; flex-direction: column; min-height: 0; background: var(--pw-rail-bg); } .rail-strip { display: flex; flex-direction: column; padding: 8px 6px; border-right: 1px solid var(--theme-border, var(--pw-border)); background: var(--pw-rail-bg); } -.chat-canvas .theme-panel.border-r { background: var(--pw-rail-bg); } +/* The conversations rail: ai-chat 0.4 drew it as theme-panel border-r; 0.5 + as an aside on the muted-panel token. Both take the + Library rail's token so the two rails match in dark mode. */ +.chat-canvas .theme-panel.border-r, +.chat-canvas aside[class*="bg-(--theme-muted-panel-bg)"] { background: var(--pw-rail-bg); } .library .divider { width: 5px; flex-shrink: 0; cursor: col-resize; /* The same token the chat rail divides with, and the strip carries the @@ -1266,7 +1270,8 @@ code, pre, kbd, .text-body, .viewer-path, .sql-box, [data-streamdown='code-block .toggle-note { margin: 2px 0 12px 26px; max-width: var(--settings-measure); } /* Conversation rows and rail actions match the Library tree scale (13px); the "Chats" header itself stays 14px like the rail titles. */ -.chat-canvas .theme-panel.border-r a { font-size: 13px; } +.chat-canvas .theme-panel.border-r a, +.chat-canvas aside li span, .chat-canvas aside button span, .chat-canvas aside a span { font-size: 13px; } .chat-filter-btn { position: absolute; left: 12px; bottom: 10px; z-index: 4;