From 830e9dd6f9821179a20d315da4090ae50fe074b6 Mon Sep 17 00:00:00 2001
From: yujiangping <yujiangping@taofen8.com>
Date: Wed, 14 Jan 2026 16:42:32 +0800
Subject: [PATCH] style(chat): improve chat layout spacing and empty state
 styling

- Add top margin (rb:mt-2) to bottom label in ChatContent for better spacing
- Wrap Chat component in centered container with max-width (760px) and top padding
- Replace AnalysisEmptyIcon with BgImg in empty state for improved visual consistency
- Add size prop [320,180] to Empty component for proper empty state dimensions
- Adjust contentClassName spacing for better layout alignment
- Improves overall chat interface visual hierarchy and spacing consistency
---
 web/src/components/Chat/ChatContent.tsx | 2 +-
 web/src/views/Conversation/index.tsx    | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/web/src/components/Chat/ChatContent.tsx b/web/src/components/Chat/ChatContent.tsx
index 11ccb5c3..ecc2e4e9 100644
--- a/web/src/components/Chat/ChatContent.tsx
+++ b/web/src/components/Chat/ChatContent.tsx
@@ -68,7 +68,7 @@ const ChatContent: FC<ChatContentProps> = ({
                 </div>
                 {/* 底部标签（如时间戳、用户名等） */}
                 {labelPosition === 'bottom' &&
-                  <div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4 rb:font-regular">
+                  <div className="rb:text-[#5B6167] rb:text-[12px] rb:leading-4 rb:font-regular rb:mt-2">
                     {labelFormat(item)}
                   </div>
                 }
diff --git a/web/src/views/Conversation/index.tsx b/web/src/views/Conversation/index.tsx
index d791bf2d..7fa1ada1 100644
--- a/web/src/views/Conversation/index.tsx
+++ b/web/src/views/Conversation/index.tsx
@@ -254,9 +254,10 @@ const Conversation: FC = () => {
       </div>
 
       <div className="rb:relative rb:h-screen rb:px-4 rb:flex-[1_1_auto]">
+        <div className='rb:w-[760px]  rb:h-screen rb:mx-auto rb:pt-10'>
         <Chat
-          empty={<Empty url={AnalysisEmptyIcon} className="rb:h-full" subTitle={t('memoryConversation.emptyDesc')} />}
-          contentClassName="rb:h-[calc(100%-152px)]"
+          empty={<Empty url={BgImg} className="rb:h-full" size={[320,180]} subTitle={t('memoryConversation.emptyDesc')} />}
+          contentClassName="rb:h-[calc(100%-152px)] "
           data={chatList}
           streamLoading={streamLoading}
           loading={loading}
@@ -285,6 +286,7 @@ const Conversation: FC = () => {
             </Flex>
           </Form>
         </Chat>
+        </div>
       </div>
     </Flex>
   )