From abc0faf197a0464778b55d02259af1b12e84e454 Mon Sep 17 00:00:00 2001
From: chenhang <averych@126.com>
Date: Wed, 1 Jul 2026 12:51:51 +0800
Subject: [PATCH] style(chat): distinguish empty send button state

---
 src/app/chat/components/chat-input-bar.tsx          | 1 +
 src/app/chat/components/chat-send-button.module.css | 6 ++++++
 src/app/chat/components/chat-send-button.tsx        | 6 +++++-
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/app/chat/components/chat-input-bar.tsx b/src/app/chat/components/chat-input-bar.tsx
index c34b2ca4..fddffeb8 100644
--- a/src/app/chat/components/chat-input-bar.tsx
+++ b/src/app/chat/components/chat-input-bar.tsx
@@ -60,6 +60,7 @@ export function ChatInputBar({ disabled = false }: ChatInputBarProps) {
         />
         <ChatSendButton
           disabled={disabled}
+          hasContent={hasContent}
           onClick={handleSend}
         />
       </div>
diff --git a/src/app/chat/components/chat-send-button.module.css b/src/app/chat/components/chat-send-button.module.css
index 20a33e95..7c354b46 100644
--- a/src/app/chat/components/chat-send-button.module.css
+++ b/src/app/chat/components/chat-send-button.module.css
@@ -21,6 +21,12 @@
   cursor: not-allowed;
 }
 
+.buttonEmpty {
+  background: #f8a8ce;
+  color: rgba(255, 255, 255, 0.88);
+  box-shadow: none;
+}
+
 .button:focus-visible,
 .buttonActive {
   background: linear-gradient(
diff --git a/src/app/chat/components/chat-send-button.tsx b/src/app/chat/components/chat-send-button.tsx
index 072eb25f..f0bc9346 100644
--- a/src/app/chat/components/chat-send-button.tsx
+++ b/src/app/chat/components/chat-send-button.tsx
@@ -16,17 +16,21 @@ import styles from "./chat-send-button.module.css";
 
 export interface ChatSendButtonProps {
   disabled: boolean;
+  hasContent: boolean;
   onClick: () => void;
 }
 
 export function ChatSendButton({
   disabled,
+  hasContent,
   onClick,
 }: ChatSendButtonProps) {
   return (
     <button
       type="button"
-      className={`${styles.button} ${disabled ? "" : styles.buttonActive}`}
+      className={`${styles.button} ${
+        hasContent && !disabled ? styles.buttonActive : styles.buttonEmpty
+      }`}
       disabled={disabled}
       onClick={onClick}
       aria-label="Send message"