fix: #384 improve scroll

app/components/chat.tsx

@@ -461,8 +461,9 @@ export function Chat(props: {
 
   // Auto focus
   useEffect(() => {
+    if (props.sideBarShowing) return;
     inputRef.current?.focus();
-  }, []);
+  }, [props.sideBarShowing]);
 
   return (
     <div className={styles.chat} key={session.id}>
@@ -530,7 +531,6 @@ export function Chat(props: {
         className={styles["chat-body"]}
         ref={scrollRef}
         onScroll={(e) => onChatBodyScroll(e.currentTarget)}
-        onMouseOver={() => inputRef.current?.blur()}
         onTouchStart={() => inputRef.current?.blur()}
       >
         {messages.map((message, i) => {
@@ -592,6 +592,7 @@ export function Chat(props: {
                         if (!isMobileScreen()) return;
                         setUserInput(message.content);
                       }}
+                      onMouseOver={() => inputRef.current?.blur()}
                     >
                       <Markdown content={message.content} />
                     </div>
@@ -626,6 +627,9 @@ export function Chat(props: {
               setAutoScroll(false);
               setTimeout(() => setPromptHints([]), 500);
             }}
+            onMouseOver={() => {
+              inputRef.current?.focus();
+            }}
             autoFocus={!props?.sideBarShowing}
           />
           <IconButton

app/styles/highlight.scss

@@ -8,16 +8,22 @@
     font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
   }
 
-  pre code.hljs {
+  pre code {
     display: block;
     overflow-x: auto;
     padding: 1em;
   }
 
-  code.hljs {
+  code {
     padding: 3px 5px;
   }
 
+  .hljs,
+  pre {
+    background: #1a1b26;
+    color: #cbd2ea;
+  }
+
   /*!
   Theme: Tokyo-night-Dark
   origin: https://github.com/enkia/tokyo-night-vscode-theme
@@ -99,11 +105,6 @@
     color: #c0caf5;
   }
 
-  .hljs {
-    background: #1a1b26;
-    color: #9aa5ce;
-  }
-
   .hljs-emphasis {
     font-style: italic;
   }