From 533ccacd69b3becf4fc13faffbee40c5d3244880 Mon Sep 17 00:00:00 2001
From: Shantur Rathore <i@shantur.com>
Date: Tue, 12 May 2026 13:14:50 +0100
Subject: [PATCH] fix(ui): base timeline width on center pane

Move the compact timeline width rule from viewport media queries to the session-center narrow width step. This keeps the timeline compact when the chat pane is narrow due to side panels, even on wide desktop viewports.

Validation: npm run typecheck --workspace @codenomad/ui
---
 .../src/styles/messaging/message-timeline.css  | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/packages/ui/src/styles/messaging/message-timeline.css b/packages/ui/src/styles/messaging/message-timeline.css
index b4a8efd4..8c91f2a1 100644
--- a/packages/ui/src/styles/messaging/message-timeline.css
+++ b/packages/ui/src/styles/messaging/message-timeline.css
@@ -26,14 +26,12 @@
   pointer-events: none;
 }
 
-@media (max-width: 720px) {
-  .message-layout--with-timeline {
-    grid-template-columns: minmax(0, 1fr) 40px;
-  }
+.session-center-column[data-session-center-width="narrow"] .message-layout--with-timeline {
+  grid-template-columns: minmax(0, 1fr) 40px;
+}
 
-  .message-layout--with-timeline::after {
-    inset-inline-end: 40px;
-  }
+.session-center-column[data-session-center-width="narrow"] .message-layout--with-timeline::after {
+  inset-inline-end: 40px;
 }
 
 .message-stream-shell {
@@ -59,10 +57,8 @@
  }
 
 
-@media (max-width: 720px) {
-  .message-timeline-sidebar {
-    width: 40px;
-  }
+.session-center-column[data-session-center-width="narrow"] .message-timeline-sidebar {
+  width: 40px;
 }
 
 .message-timeline {