diff --git a/packages/builtin-tool-user-interaction/src/client/Intervention/AskUserQuestion/index.tsx b/packages/builtin-tool-user-interaction/src/client/Intervention/AskUserQuestion/index.tsx index 5a5cc27bee..5dc4f840d7 100644 --- a/packages/builtin-tool-user-interaction/src/client/Intervention/AskUserQuestion/index.tsx +++ b/packages/builtin-tool-user-interaction/src/client/Intervention/AskUserQuestion/index.tsx @@ -133,6 +133,7 @@ const AskUserQuestionIntervention = memo - {escapeActive ? ( + {escapeActive && shouldShowEscapeAction ? ( {t('form.otherBack')} @@ -216,9 +217,11 @@ const AskUserQuestionIntervention = memo {t('form.skip')} - - {t('form.other')} - + {shouldShowEscapeAction && ( + + {t('form.other')} + + )} )} diff --git a/src/features/Conversation/InterventionBar/style.ts b/src/features/Conversation/InterventionBar/style.ts index 44e04302a9..820e22abf0 100644 --- a/src/features/Conversation/InterventionBar/style.ts +++ b/src/features/Conversation/InterventionBar/style.ts @@ -2,35 +2,40 @@ import { createStaticStyles } from 'antd-style'; export const styles = createStaticStyles(({ css, cssVar }) => ({ actions: css` - padding-block: 8px; - padding-inline: 16px; + padding-block: 8px 10px; + padding-inline: 10px; border-block-start: 1px solid ${cssVar.colorBorderSecondary}; + background: color-mix(in srgb, ${cssVar.colorBgElevated} 92%, ${cssVar.colorFillSecondary}); &:empty { display: none; } `, container: css` + overflow: hidden; margin-block-end: 12px; `, content: css` overflow-y: auto; flex: 1; min-height: 0; - padding-block: 8px 12px; + padding-block: 6px 8px; `, tab: css` cursor: pointer; - padding-block: 6px; - padding-inline: 14px; + padding-block: 5px; + padding-inline: 10px; border-block-end: 2px solid transparent; font-size: 12px; color: ${cssVar.colorTextSecondary}; white-space: nowrap; - transition: all 0.2s; + transition: + border-color 0.2s, + color 0.2s, + background 0.2s; &:hover { color: ${cssVar.colorText}; @@ -49,8 +54,8 @@ export const styles = createStaticStyles(({ css, cssVar }) => ({ `, tabCounter: css` margin-inline-start: auto; - padding-block: 6px; - padding-inline: 14px; + padding-block: 5px; + padding-inline: 10px; font-size: 11px; color: ${cssVar.colorTextTertiary}; diff --git a/src/features/Conversation/Messages/AssistantGroup/Tool/Detail/Intervention/ApprovalActions.tsx b/src/features/Conversation/Messages/AssistantGroup/Tool/Detail/Intervention/ApprovalActions.tsx index a602757008..754633d49c 100644 --- a/src/features/Conversation/Messages/AssistantGroup/Tool/Detail/Intervention/ApprovalActions.tsx +++ b/src/features/Conversation/Messages/AssistantGroup/Tool/Detail/Intervention/ApprovalActions.tsx @@ -34,7 +34,7 @@ const styles = createStaticStyles(({ css, cssVar }) => ({ footer: css` display: flex; justify-content: flex-end; - margin-block-start: 12px; + margin-block-start: 8px; `, number: css` flex-shrink: 0; @@ -49,9 +49,10 @@ const styles = createStaticStyles(({ css, cssVar }) => ({ gap: 8px; align-items: center; - padding-block: 8px; - padding-inline: 12px; - border-radius: 8px; + min-height: 40px; + padding-block: 7px; + padding-inline: 16px; + border-radius: calc(${cssVar.borderRadiusLG} - 2px); color: ${cssVar.colorTextSecondary}; @@ -121,6 +122,13 @@ const styles = createStaticStyles(({ css, cssVar }) => ({ margin-inline-start: 6px; color: ${cssVar.colorTextTertiary}; `, + submitButton: css` + &.ant-btn { + min-width: 88px; + height: 36px; + border-radius: calc(${cssVar.borderRadiusLG} - 2px); + } + `, })); const ApprovalActions = memo( @@ -290,9 +298,9 @@ const ApprovalActions = memo(