From 6e5dab76ccda4af0083b889f4ecad1d5505bd427 Mon Sep 17 00:00:00 2001
From: Henry Li <henry1943@163.com>
Date: Fri, 16 Jan 2026 20:06:30 +0800
Subject: [PATCH] feat: adjust layout

---
 .../workspace/message-list/message-list-item.tsx           | 7 ++++---
 .../src/components/workspace/message-list/message-list.tsx | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/workspace/message-list/message-list-item.tsx b/frontend/src/components/workspace/message-list/message-list-item.tsx
index 1b8569f..cc6ee6e 100644
--- a/frontend/src/components/workspace/message-list/message-list-item.tsx
+++ b/frontend/src/components/workspace/message-list/message-list-item.tsx
@@ -15,9 +15,10 @@ import {
 import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
 import { cn } from "@/lib/utils";
 
-import { MessageGroup } from "./message-group";
 import { CopyButton } from "../copy-button";
 
+import { MessageGroup } from "./message-group";
+
 export function MessageListItem({
   className,
   message,
@@ -31,11 +32,11 @@ export function MessageListItem({
 }) {
   return (
     <AIElementMessage
-      className={cn("relative", "group/conversation-message", className)}
+      className={cn("group/conversation-message relative w-full", className)}
       from={message.type === "human" ? "user" : "assistant"}
     >
       <MessageContent
-        className={className}
+        className={message.type === "human" ? "w-fit" : "w-full"}
         message={message}
         messagesInGroup={messagesInGroup}
         isLoading={isLoading}
diff --git a/frontend/src/components/workspace/message-list/message-list.tsx b/frontend/src/components/workspace/message-list/message-list.tsx
index 520ba31..215b6ab 100644
--- a/frontend/src/components/workspace/message-list/message-list.tsx
+++ b/frontend/src/components/workspace/message-list/message-list.tsx
@@ -28,7 +28,7 @@ export function MessageList({
     <Conversation
       className={cn("flex size-full flex-col justify-center pt-2", className)}
     >
-      <ConversationContent className="mx-auto w-full max-w-(--container-width-md)">
+      <ConversationContent className="mx-auto w-full max-w-(--container-width-md) gap-12">
         {groupMessages(
           thread.messages,
           (groupedMessages) => {