(feat:ui) message input, search icon

frontend/src/Navigation.tsx

@@ -571,14 +571,14 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
           )}
           {conversations?.data && conversations.data.length > 0 ? (
             <div className="mt-7">
-              <div className="my-auto mt-2 ml-4 flex h-9 items-center justify-between gap-4 rounded-3xl">
+              <div className="my-auto mt-2 ml-2.75 p-1 flex h-9 items-center justify-between gap-4 rounded-3xl">
                 <p className="mt-1 ml-4 text-sm font-semibold">{t('chats')}</p>
                 <Button
                   type="button"
                   variant="ghost"
                   size="icon"
                   onClick={() => setSearchOpen(true)}
-                  className="text-muted-foreground hover:text-foreground hover:bg-sidebar-accent mr-3 rounded-full"
+                  className="mr-1 text-muted-foreground hover:text-foreground hover:bg-sidebar-accent rounded-full"
                   aria-label={t('modals.searchConversations.searchPlaceholder')}
                   title={t('modals.searchConversations.searchPlaceholder')}
                 >

frontend/src/components/MessageInput.tsx

@@ -908,14 +908,13 @@ export default function MessageInput({
   });
 
   const handleInput = useCallback(() => {
-    if (inputRef.current) {
-      if (window.innerWidth < 350) inputRef.current.style.height = 'auto';
-      else inputRef.current.style.height = '64px';
-      inputRef.current.style.height = `${Math.min(
-        inputRef.current.scrollHeight,
-        96,
-      )}px`;
-    }
+    if (!inputRef.current) return;
+    if (window.innerWidth < 350) inputRef.current.style.height = 'auto';
+    else inputRef.current.style.height = '64px';
+    inputRef.current.style.height = `${Math.min(
+      inputRef.current.scrollHeight,
+      Math.round(window.innerHeight * 0.4),
+    )}px`;
   }, []);
 
   const buildVoiceDraftValue = (baseText: string, transcript: string) => {

frontend/src/conversation/Conversation.tsx

@@ -354,14 +354,20 @@ export default function Conversation() {
               ) : undefined
             }
           />
-          <div className="from-background pointer-events-none absolute right-1.5 bottom-0 left-0 h-6 rounded-t-2xl bg-linear-to-t to-transparent" />
+          <div
+            className={`from-background pointer-events-none absolute bottom-0 left-1/2 h-6 w-full -translate-x-1/2 rounded-t-2xl bg-linear-to-t to-transparent bg-clip-content px-2 ${
+              isSplitArtifactOpen
+                ? 'max-w-325'
+                : 'max-w-325 md:w-9/12 lg:w-8/12 xl:w-8/12 2xl:w-6/12'
+            }`}
+          />
         </div>
 
         <div
           className={`bg-opacity-0 z-3 flex h-auto w-full flex-col items-end self-center rounded-2xl py-1 ${
             isSplitArtifactOpen
-              ? 'max-w-[1300px]'
-              : 'max-w-[1300px] md:w-9/12 lg:w-8/12 xl:w-8/12 2xl:w-6/12'
+              ? 'max-w-325'
+              : 'max-w-325 md:w-9/12 lg:w-8/12 xl:w-8/12 2xl:w-6/12'
           }`}
         >
           <div className="flex w-full items-center rounded-full px-2">