From 454453788e759fa16442e755434fbb842fa1acab Mon Sep 17 00:00:00 2001 From: bndw Date: Sat, 28 Feb 2026 21:49:29 -0800 Subject: feat: **`globals.css`** — Edit `.chat-pane`: remove `width: 3… (+7 more) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - ✅ **`globals.css`** — Edit `.chat-pane`: remove `width: 380px`, add `min-width: 0`, `overflow: hidden`, `transition: width 0.2s ease` - ✅ **`globals.css`** — Insert `.chat-resize-handle`, `.chat-header`, `.chat-collapse-btn` rules after `.chat-pane` block - ✅ **`globals.css`** — Append `::-webkit-scrollbar` rules at end of file - ✅ **`ChatPane.tsx`** — Full rewrite: new props interface, header strip, conditional body, inline width style - ✅ **`App.tsx`** — Add `chatWidth` + `chatCollapsed` state with lazy localStorage initialisers - ✅ **`App.tsx`** — Add two `useEffect` persistence hooks - ✅ **`App.tsx`** — Add `handleResizeMouseDown` function - ✅ **`App.tsx`** — Update `.main-content` JSX: insert conditional resize handle div, pass new props to `` --- renderer/src/styles/globals.css | 77 ++++++++++++++++++++++++++++++++++++++++- 1 file changed, 76 insertions(+), 1 deletion(-) (limited to 'renderer/src/styles') diff --git a/renderer/src/styles/globals.css b/renderer/src/styles/globals.css index 8e43f3a..03c7443 100644 --- a/renderer/src/styles/globals.css +++ b/renderer/src/styles/globals.css @@ -408,10 +408,57 @@ html[data-theme="light"] .session-rename-input { /* ── Chat Pane ───────────────────────────────────────────────── */ .chat-pane { - width: 380px; display: flex; flex-direction: column; background: var(--bg-secondary); + min-width: 0; + overflow: hidden; + transition: width 0.2s ease; +} + +/* ── Chat Resize Handle ──────────────────────────────────────── */ +.chat-resize-handle { + width: 5px; + background: transparent; + cursor: col-resize; + flex-shrink: 0; + transition: background 0.15s; +} + +.chat-resize-handle:hover { + background: var(--accent); +} + +/* ── Chat Header Strip ───────────────────────────────────────── */ +.chat-header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 7px 12px; + background: var(--bg-secondary); + border-bottom: 1px solid var(--border); + font-size: 11px; + letter-spacing: 0.07em; + text-transform: uppercase; + color: var(--text-secondary); + flex-shrink: 0; +} + +.chat-collapse-btn { + background: transparent; + border: 1px solid var(--border); + border-radius: 2px; + color: var(--text-secondary); + cursor: pointer; + font-size: 12px; + padding: 2px 7px; + font-family: inherit; + transition: background 0.15s, color 0.15s; +} + +.chat-collapse-btn:hover { + background: var(--bg-tertiary); + color: var(--text-primary); } .chat-messages { @@ -998,3 +1045,31 @@ html[data-theme="light"] .settings-textarea:focus { background: var(--bg-tertiary); color: var(--text-primary); } + +/* ── Scrollbars ──────────────────────────────────────────────── */ +.chat-messages::-webkit-scrollbar, +.document-content::-webkit-scrollbar, +.cm-scroller::-webkit-scrollbar { + width: 8px; + height: 8px; +} + +.chat-messages::-webkit-scrollbar-track, +.document-content::-webkit-scrollbar-track, +.cm-scroller::-webkit-scrollbar-track { + background: var(--bg-primary); +} + +.chat-messages::-webkit-scrollbar-thumb, +.document-content::-webkit-scrollbar-thumb, +.cm-scroller::-webkit-scrollbar-thumb { + background: var(--bg-tertiary); + border-radius: 4px; + border: 2px solid var(--bg-primary); +} + +.chat-messages::-webkit-scrollbar-thumb:hover, +.document-content::-webkit-scrollbar-thumb:hover, +.cm-scroller::-webkit-scrollbar-thumb:hover { + background: var(--border); +} -- cgit v1.2.3