From ee1bf8a1875a543c03f3d387a9d12982f50c3b81 Mon Sep 17 00:00:00 2001
From: mesalogo <pettygay757@gmail.com>
Date: Mon, 28 Sep 2026 01:08:54 +0800
Subject: [PATCH] fix: unify composer tool button styles
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Use matching button and icon sizes, spacing, and hover feedback for attachment, voice input, and composer options while preserving recording and expanded states.

Release note: 修复输入框附件、语音和设置按钮的样式不一致问题，统一尺寸、间距和悬停效果。
---
 src/renderer/src/App.tsx    |  2 +-
 src/renderer/src/styles.css | 35 ++++++++++-------------------------
 2 files changed, 11 insertions(+), 26 deletions(-)

diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index c0d19c43..1e8be694 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -10007,7 +10007,7 @@ function App(): React.JSX.Element {
                                 title={t("composer.settings")}
                                 type="button"
                               >
-                                <SlidersHorizontal aria-hidden="true" size={17} />
+                                <SlidersHorizontal aria-hidden="true" size={18} />
                               </button>
                               <div
                                 aria-label={t("composer.settings")}
diff --git a/src/renderer/src/styles.css b/src/renderer/src/styles.css
index 07ebd5c7..c1255d34 100644
--- a/src/renderer/src/styles.css
+++ b/src/renderer/src/styles.css
@@ -7485,27 +7485,6 @@ button > svg {
   overflow-wrap: anywhere;
 }
 
-.composer__options-trigger {
-  display: inline-flex;
-  width: 34px;
-  height: 34px;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-  border: 1px solid transparent;
-  border-radius: var(--radius-control);
-  background: transparent;
-  color: var(--text-secondary);
-  cursor: pointer;
-  flex: 0 0 auto;
-}
-
-.composer__options-trigger:hover,
-.composer__options-trigger[aria-expanded="true"] {
-  background: var(--accent-subtle);
-  color: var(--accent);
-}
-
 .composer__options {
   position: absolute;
   z-index: 25;
@@ -7619,11 +7598,8 @@ button > svg {
   gap: var(--space-2);
 }
 
-.composer__tool-group {
-  gap: 2px;
-}
-
 .composer__tool-group button,
+.composer__options-trigger,
 .knowledge-scope > button {
   display: grid;
   min-width: 32px;
@@ -7642,7 +7618,16 @@ button > svg {
     color var(--motion-fast, 120ms) ease-out;
 }
 
+.composer__tool-group button,
+.composer__options-trigger {
+  width: 32px;
+  padding: 0;
+  flex: 0 0 auto;
+}
+
 .composer__tool-group button:hover,
+.composer__options-trigger:hover,
+.composer__options-trigger[aria-expanded="true"],
 .knowledge-scope > button:hover {
   border-color: var(--accent-selected);
   background: var(--accent-subtle);