From c6f5a4585ed8471ab8a1be977fd36960b9123d16 Mon Sep 17 00:00:00 2001
From: yiliang114 <1204183885@qq.com>
Date: Fri, 5 Dec 2025 12:43:04 +0800
Subject: [PATCH] style(vscode-ide-companion/ui): improve InfoBanner layout and
 centering

Add maxWidth constraint and auto margins to center the InfoBanner component
for better visual presentation.
---
 .../webview/components/toolcalls/shared/LayoutComponents.tsx    | 1 +
 .../src/webview/components/ui/InfoBanner.tsx                    | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/packages/vscode-ide-companion/src/webview/components/toolcalls/shared/LayoutComponents.tsx b/packages/vscode-ide-companion/src/webview/components/toolcalls/shared/LayoutComponents.tsx
index bff26ffe..b821eb25 100644
--- a/packages/vscode-ide-companion/src/webview/components/toolcalls/shared/LayoutComponents.tsx
+++ b/packages/vscode-ide-companion/src/webview/components/toolcalls/shared/LayoutComponents.tsx
@@ -49,6 +49,7 @@ export const ToolCallContainer: React.FC<ToolCallContainerProps> = ({
     className={`qwen-message message-item ${_className || ''} relative pl-[30px] py-2 select-text toolcall-container toolcall-status-${status}`}
   >
     {/* Timeline connector line using ::after pseudo-element */}
+    {/* TODO: gap-0 */}
     <div className="toolcall-content-wrapper flex flex-col gap-1 min-w-0 max-w-full">
       <div className="flex items-center gap-1 relative min-w-0">
         <span className="text-[14px] leading-none font-bold text-[var(--app-primary-foreground)]">
diff --git a/packages/vscode-ide-companion/src/webview/components/ui/InfoBanner.tsx b/packages/vscode-ide-companion/src/webview/components/ui/InfoBanner.tsx
index cc9d4e81..d94b7af7 100644
--- a/packages/vscode-ide-companion/src/webview/components/ui/InfoBanner.tsx
+++ b/packages/vscode-ide-companion/src/webview/components/ui/InfoBanner.tsx
@@ -51,6 +51,8 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
       style={{
         gap: '12px',
         padding: '8px 16px',
+        maxWidth: '500px',
+        margin: '0 auto',
       }}
     >
       <div className="flex items-center flex-1 min-w-0" style={{ gap: '8px' }}>