fix(capsule): keep confirm icon inside pill on done/error states

[weikeyi]

User description

摘要

修复 capsule 在 done/error 状态下确认图标溢出 pill 的问题。

当 capsule 进入 done 或 error 状态时，确认图标可能会在视觉上超出 pill 边界。本 PR 将确认图标保持在 capsule pill 内部，同时保留现有的布局行为。

修复 / 新增 / 改进

• 将确认图标限制在 done/error 状态下的 capsule pill 内部。
• 保留现有的 capsule 间距和状态行为。
• 将改动范围限制在 capsule UI 布局/样式。

兼容

• 不改动 ASR、polish、文本插入、快捷键或 provider 行为。
• 不影响本地环境或构建流程。
• 仅包含 UI 改动。

测试计划

• 已运行 npm run build
• 已运行 cargo check --manifest-path src-tauri/Cargo.toml
• 已目测验证 capsule done 状态
• 已目测验证 capsule error 状态

---

PR Type

Bug fix

---

Description

• Replace fixed widths with flexible constraints

• Add min-width:0 to inner elements and flex container

• Preserve existing visual spacing and behavior

---

Diagram Walkthrough

flowchart LR
  A["CenterText span"] -- "width:100%, maxWidth, minWidth:0" --> B["Prevents overflow"]
  C["Polishing flex container"] -- "width:100%, maxWidth, minWidth:0" --> B
  D["Button flex container"] -- "minWidth:0 added" --> B

Loading

File Walkthrough

	Relevant files
Bug fix	Capsule.tsx Constrain pill content with flexible widths to prevent overflow openless-all/app/src/components/Capsule.tsx Replace fixed width with width:'100%', maxWidth, minWidth:0 on CenterText span Apply same flexible constraints to polishing layout container Add minWidth:0 to processing text span and the flex container between buttons +8/-3

---

[chatgpt-codex-connector]

Codex usage limits have been reached for code reviews. Please check with the admins of this repo to increase the limits by adding credits.
Credits must be used to enable repository wide code reviews.

[github-actions]

PR Reviewer Guide 🔍

Here are some key observations to aid the review process:

⏱️ Estimated effort to review: 2 🔵🔵⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ No major issues detected