From fae654a95283064c4ccbf4438e6de2cb60a6b11a Mon Sep 17 00:00:00 2001
From: wwayne <wayne.wang0821@gmail.com>
Date: Tue, 28 May 2024 10:56:01 +0800
Subject: [PATCH] fix(ui): chat question*answer margin left

---
 ee/tabby-ui/components/chat/chat-panel.tsx      | 2 +-
 ee/tabby-ui/components/chat/question-answer.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/ee/tabby-ui/components/chat/chat-panel.tsx b/ee/tabby-ui/components/chat/chat-panel.tsx
index e0ae46da8c95..62d9659baf63 100644
--- a/ee/tabby-ui/components/chat/chat-panel.tsx
+++ b/ee/tabby-ui/components/chat/chat-panel.tsx
@@ -38,7 +38,7 @@ export function ChatPanel({
   return (
     <div className={className}>
       <ButtonScrollToBottom container={container} />
-      <div className={`mx-auto ${chatMaxWidthClass}`}>
+      <div className={`md:px-4 mx-auto ${chatMaxWidthClass}`}>
         <div className="flex h-10 items-center justify-center gap-2">
           {isLoading ? (
             <Button
diff --git a/ee/tabby-ui/components/chat/question-answer.tsx b/ee/tabby-ui/components/chat/question-answer.tsx
index 409d5b76b0e3..c9f2253b40ca 100644
--- a/ee/tabby-ui/components/chat/question-answer.tsx
+++ b/ee/tabby-ui/components/chat/question-answer.tsx
@@ -104,7 +104,7 @@ function UserMessageCard(props: { message: UserMessage }) {
 
   return (
     <div
-      className={cn('group relative mb-4 flex items-start md:-ml-12')}
+      className={cn('group relative mb-4 flex items-start md:-ml-4')}
       {...props}
     >
       <div className="shrink-0 select-none rounded-full border bg-background shadow">
@@ -178,7 +178,7 @@ function AssistantMessageCard(props: AssistantMessageCardProps) {
 
   return (
     <div
-      className={cn('group relative mb-4 flex items-start md:-ml-12')}
+      className={cn('group relative mb-4 flex items-start md:-ml-4')}
       {...rest}
     >
       <div className="shrink-0 select-none rounded-full border bg-background shadow">