From c45bc4d5219d280f36bd8e07f881b78e3a3d0564 Mon Sep 17 00:00:00 2001
From: mt <mt@deerflow.tech>
Date: Wed, 10 Jun 2026 17:52:02 +0800
Subject: [PATCH] =?UTF-8?q?style(input):=20=E8=B0=83=E6=95=B4=E5=8F=91?=
 =?UTF-8?q?=E9=80=81=E6=8C=89=E9=92=AE=E4=B8=BA=E5=9C=86=E5=BD=A2=E5=9B=BE?=
 =?UTF-8?q?=E6=A0=87=E6=A0=B7=E5=BC=8F=E5=B9=B6=E6=9B=B4=E6=96=B0=E4=B8=BB?=
 =?UTF-8?q?=E9=A2=98=E8=89=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- prompt-input.tsx: 发送按钮改为 36x36 圆形，使用 SVG 箭头/方块图标替代文字
- input-box.tsx: 占位区域尺寸同步调整为 36x36
- globals.css: 新增 brand-default/brand-sxwz 品牌 CSS class，新增 ws-interactive-hover token，主题色 #8e47f0 → #150033
---
 .../components/ai-elements/prompt-input.tsx   | 22 ++++++++++++-------
 .../src/components/workspace/input-box.tsx    |  4 ++--
 frontend/src/styles/globals.css               | 12 ++++++++--
 3 files changed, 26 insertions(+), 12 deletions(-)

diff --git a/frontend/src/components/ai-elements/prompt-input.tsx b/frontend/src/components/ai-elements/prompt-input.tsx
index 8b712dfe..6f73a226 100644
--- a/frontend/src/components/ai-elements/prompt-input.tsx
+++ b/frontend/src/components/ai-elements/prompt-input.tsx
@@ -1157,7 +1157,11 @@ export const PromptInputSubmit = ({
     ? !!disabled
     : disabled || !hasContent || isSubmitted;
 
-  let Icon = <ArrowUpIcon className="size-4" />;
+  // let Icon = <ArrowUpIcon className="size-4" />;
+ let Icon =  <svg width="12" height="16" viewBox="0 0 12 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.75 14.75V0.75M0.75 5.75L5.75 0.75L10.75 5.75" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>;
+
 
   let text: string = t.inputBox.submit;
 
@@ -1165,11 +1169,13 @@ export const PromptInputSubmit = ({
     Icon = <Loader2Icon className="size-4 animate-spin" />;
     text = t.inputBox.submitting;
   } else if (status === "streaming") {
-    Icon = <SquareIcon className="size-4" />;
+    Icon = <svg className="!w-[12px] !h-[12px]" width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="12" height="12" rx="2" fill="white"/>
+</svg>;
     text = t.inputBox.stop;
   } else if (status === "error") {
     // 没有报错状态，先用error状态代替
-    Icon = <XIcon className="size-4" />;
+    // Icon = <XIcon className="size-4" />;
     // MARK: 这里后端没有返回错误信息，先写死一个文本
     text = t.inputBox.submit;
   }
@@ -1180,10 +1186,10 @@ export const PromptInputSubmit = ({
         aria-label="Submit"
         // 被button{bgc:#fff}覆盖了，只能加"!"
         className={cn(
-          "h-[40px] w-[140px] rounded-[10px] border-0 font-bold transition-all",
+          "h-[36px] w-[36px] rounded-[50%] border-0 font-bold transition-all ",
           isDisabled
-            ? "cursor-not-allowed !bg-gray-200 text-gray-400"
-            : "!bg-[#F0E8FB] text-[#8E47F0] hover:!bg-[#8E47F0] hover:text-[#FFFFFF]",
+            ? "cursor-not-allowed !bg-[#15003399] text-gray-400"
+            : "!bg-[#150033] text-[#8E47F0]  hover:text-[#FFFFFF]",
           className,
         )}
         size={size}
@@ -1192,8 +1198,8 @@ export const PromptInputSubmit = ({
         disabled={isDisabled}
         {...props}
       >
-        {/* {children ?? Icon} */}
-        {text}
+        {children ?? Icon}
+        {/* {text} */}
       </InputGroupButton>
     </Tooltip>
   );
diff --git a/frontend/src/components/workspace/input-box.tsx b/frontend/src/components/workspace/input-box.tsx
index dad7f713..c64b3deb 100644
--- a/frontend/src/components/workspace/input-box.tsx
+++ b/frontend/src/components/workspace/input-box.tsx
@@ -151,7 +151,7 @@ function WorkspaceToolButton({
   return (
     <PromptInputButton
       className={cn(
-        "group h-full rounded-[10px] p-[10px]! hover:bg-ws-surface-subtle hover:text-ws-interactive-primary",
+        "group h-full rounded-[10px] p-[10px]! hover:bg-ws-interactive-hover hover:text-ws-interactive-primary",
         className,
       )}
       {...props}
@@ -1050,7 +1050,7 @@ export function InputBox({
           </ModelSelector> */}
           <PromptInputTools>
             {/* 占位符 */}
-            <div className="w-[150px] h-[40px]"></div>
+            <div className="w-[36px] h-[36px]"></div>
           </PromptInputTools>
         </PromptInputFooter>
         <PromptInputSubmit
diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
index 1d4be598..04b0d4e3 100644
--- a/frontend/src/styles/globals.css
+++ b/frontend/src/styles/globals.css
@@ -68,6 +68,12 @@
 @source inline("bg-{background,muted,primary,secondary,accent}");
 @source inline("border-{border,input}");
 
+.brand-default {
+}
+
+.brand-sxwz {
+}
+
 @custom-variant dark (&:is(.dark *));
 
 @theme {
@@ -206,6 +212,7 @@
   --color-ws-surface-subtle: var(--ws-color-surface-subtle);
   --color-ws-surface-elevated: var(--ws-color-surface-elevated);
   --color-ws-interactive-primary: var(--ws-color-interactive-primary);
+  --color-ws-interactive-hover: var(--ws-color-interactive-hover);
   --color-ws-line-default: var(--ws-color-line-default);
   --color-ws-text-muted: var(--ws-color-text-muted);
   --color-ws-icon-muted: var(--ws-color-icon-muted);
@@ -311,7 +318,8 @@
   --ws-color-fg-primary: #333333;
   --ws-color-surface-subtle: #f9f8fa;
   --ws-color-surface-elevated: #fbfafc;
-  --ws-color-interactive-primary: #8e47f0;
+  --ws-color-interactive-hover: #1500331A;
+  --ws-color-interactive-primary: #150033;
   --ws-color-line-default: #e4e7ec;
   --ws-color-text-muted: #667085;
   --ws-color-icon-muted: #a3a1a1;
@@ -364,7 +372,7 @@
   --ws-color-fg-primary: #f5f5f5;
   --ws-color-surface-subtle: #1f1f1f;
   --ws-color-surface-elevated: #24222a;
-  --ws-color-interactive-primary: #b987ff;
+  --ws-color-interactive-primary: #150033;
   --ws-color-line-default: #3b3f48;
   --ws-color-text-muted: #98a2b3;
   --ws-color-icon-muted: #d0d0d0;