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"
>
-
+
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);