fix: unify composer tool button styles
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: 修复输入框附件、语音和设置按钮的样式不一致问题,统一尺寸、间距和悬停效果。
This commit is contained in:
@@ -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")}
|
||||
|
||||
+10
-25
@@ -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);
|
||||
|
||||
Reference in New Issue
Block a user