Groups TaskCard header badges so the id and right-aligned size/actions cluster never wrap, fixing the S/M/L size chip dropping to its own row when extra badges (fast-mode, priority, oversight, PR/GitHub, etc.) are present.
- Introduce hasHeaderBadges/hasHeaderActions guards and wrap the middle badge cluster in a new .card-header-badges container so only .card-header-badges wraps, while .card-id and .card-header-actions stay pinned to the top row
- Update TaskCard.css: .card-header becomes a non-wrapping flex row; .card-header-badges takes over the wrapping/flex-grow behavior previously on .card-header; .card-id gets flex-shrink: 0; .card-header-actions gets flex: 0 0 auto and align-self: flex-start; mobile media query gains .card-header-badges alongside .card-meta-badges
- Add FNXC:TaskCardLayout comments documenting the FN-7837 layout requirement (non-wrapping header row, wrapping badge cluster)
- Extend TaskCard.badge-wrap.test.tsx and TaskCard.test.tsx coverage for the new header grouping/wrap behavior
- Add changeset FN-7837-card-size-badge-alignment.md (patch, fix) for @runfusion/fusion
Files changed:
.changeset/FN-7837-card-size-badge-alignment.md | 7 +++
packages/dashboard/app/components/TaskCard.css | 29 +++++++--
packages/dashboard/app/components/TaskCard.tsx | 38 ++++++++++++
.../__tests__/TaskCard.badge-wrap.test.tsx | 70 ++++++++++++++++++++--
.../app/components/__tests__/TaskCard.test.tsx | 27 ++++++---
5 files changed, 156 insertions(+), 15 deletions(-)
Fusion-Task-Id: FN-7837
Fusion-Task-Lineage: 9f70abcf-3b23-41b3-8642-aa34a561996d
Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
66e91f96ae