Chat user prompt preserve formatting

bit-gpt · Nov 8, 2023 · 9213008 · 9213008
1 parent 96c7b32
commit 9213008
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/assets/css/prem-chat.css b/src/assets/css/prem-chat.css
@@ -97,8 +97,8 @@
   @apply flex items-end mb-[40px];
 }
 
-.user-reply p {
-  @apply bg-grey-100 border py-4 px-[22px] ml-auto max-w-[660px]  text-base text-grey-700;
+.user-reply pre {
+  @apply bg-grey-100 border py-4 px-[22px] ml-auto max-w-[660px] text-base text-grey-700 overflow-x-auto;
   box-shadow:
     10.4294px 10.4294px 26.0736px rgba(112, 124, 151, 0.05),
     15.6442px 15.6442px 36.5031px rgba(112, 124, 151, 0.05);

diff --git a/src/shared/components/UserReply.tsx b/src/shared/components/UserReply.tsx
@@ -4,7 +4,7 @@ import type { UserReplyProps } from "shared/types";
 const UserReply = ({ reply }: UserReplyProps) => {
   return (
     <div className="user-reply">
-      <p>{reply}</p>
+      <pre>{reply}</pre>
       <div className="flex justify-center align-center bg-grey-100 ml-3 rounded-full min-w-[35px] h-[35px]">
         <img src={user} alt="user" width={16} height={16} />
       </div>