made scroll-to-bottom indicator more clear

Author: brandonkachen

cli/src/chat.tsx

@@ -267,6 +267,7 @@ export const Chat = ({
   }, [])
 
   const [nextCtrlCWillExit, setNextCtrlCWillExit] = useState(false)
+  const [scrollIndicatorHovered, setScrollIndicatorHovered] = useState(false)
 
   const handleCtrlC = useCallback(() => {
     if (inputValue) {
@@ -863,9 +864,20 @@ export const Chat = ({
             {/* Center section - scroll indicator (always centered) */}
             <box style={{ flexShrink: 0 }}>
               {!isAtBottom && (
-                <text onMouseDown={() => scrollToLatest()}>
-                  <span fg={theme.info} attributes={TextAttributes.BOLD}>
-                    ↓
+                <text
+                  onMouseDown={() => scrollToLatest()}
+                  onMouseOver={() => setScrollIndicatorHovered(true)}
+                  onMouseOut={() => setScrollIndicatorHovered(false)}
+                >
+                  <span
+                    fg={theme.info}
+                    attributes={
+                      scrollIndicatorHovered
+                        ? TextAttributes.BOLD
+                        : TextAttributes.DIM
+                    }
+                  >
+                    {scrollIndicatorHovered ? '↓ Scroll to bottom ↓' : '↓'}
                   </span>
                 </text>
               )}