styling: use full width for ecommerce

devflowinc · Nov 11, 2024 · e9dca8a · e9dca8a
1 parent bda902d
commit e9dca8a
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 3 deletions.
diff --git a/clients/search-component/src/TrieveModal/Chat/ChatMessage.tsx b/clients/search-component/src/TrieveModal/Chat/ChatMessage.tsx
@@ -94,12 +94,16 @@ export const Message = ({
   return (
     <div>
       {message.text == "Loading..." ? (
-        <div className="system">
+        <div
+          className={`system ${props.type === "ecommerce" ? "ecommerce" : ""}`}
+        >
           <LoadingIcon className="loading" />
         </div>
       ) : null}
       {message.type === "system" && message.text != "Loading..." ? (
-        <div className="system">
+        <div
+          className={`system ${props.type === "ecommerce" ? "ecommerce" : ""}`}
+        >
           {message.additional && props.type === "ecommerce" && (
             <div className="additional-image-links">
               {message.additional

diff --git a/clients/search-component/src/TrieveModal/index.css b/clients/search-component/src/TrieveModal/index.css
@@ -313,7 +313,7 @@ body {
       }
 
       .system {
-        @apply mt-2 sm:mt-8 mb-5 items-center overflow-ellipsis max-w-[100vw] sm:max-w-[530px];
+        @apply mt-2 sm:mt-8 mb-5 items-center overflow-ellipsis max-w-[100vw] sm:max-w-[330px];
 
         p {
           @apply pb-1;