[codex] Compact provider model capability badges

[musnows]

中文

说明

这是 #242 的 develop 版本。#242 已合入 master，因此本 PR 从 upstream/develop 新建分支并 cherry-pick 同一个修复提交，避免把 master 上的其它差异带入 develop。

变更内容

• 调整供应商模型列表的行布局，让模型名独占第一行，能力标识换行显示。
• 缩小模型能力标识的字号、图标和间距，减少对模型名空间的挤压。
• 增加静态渲染测试，覆盖模型名与能力标识分行展示的结构。

修复原因

模型列表中多个能力标识与模型名处在同一行时，会抢占模型名宽度，导致模型名被截断得过短，影响识别。

影响

设置页的模型列表更容易阅读，尤其是带有上下文、识图、推理等多个能力标识的模型。

验证

• npm test -- src/renderer/src/components/settings-section-provider-models.test.ts

English

Note

This is the develop-targeted version of #242. Since #242 was already merged into master, this PR starts from upstream/develop and cherry-picks the same fix commit to avoid carrying unrelated master differences into develop.

What changed

• Updated provider model rows so the model name stays on the first line and capability badges wrap onto a second line.
• Made capability badges more compact by reducing text size, icon size, and spacing.
• Added a static render test for the split model-name and capability-badge layout.

Why

When several capability badges were rendered on the same row as the model name, they consumed horizontal space and caused model names to truncate too aggressively.

Impact

The provider model list in Settings is easier to scan, especially for models with context, vision, and reasoning badges.

Validation

• npm test -- src/renderer/src/components/settings-section-provider-models.test.ts