root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: raise TaskCard Actions control onto header centerline

Browse Source 
Nudge the text+chevron Actions/Send-back chip up by a quarter space-xs so
it no longer sits optically below the ⋯ menu and size badge on the locked
chip-height row.
This commit is contained in:
gsxdsm
2026-07-13 01:06:01 -07:00
parent 0b60fe9548
commit b487f4542d
2 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/dashboard/app/components/TaskCard.css
View File

@@ -1675,10 +1675,14 @@ too so future divergence doesn't have to rediscover the shared selector group.
/*
FNXC:TaskCardLayout 2026-07-12-00:00:
FN-7928 requires the Send-back/Actions trigger, ⋯ menu button, and size badge to share one optical vertical center inside .card-header-actions. Normalize their line boxes while preserving FN-7889's cluster↔id transform nudge, FN-7862's flex-start header anchor, FN-7837's middle-badge wrap/size-chip-not-orphaned contract, and FN-4351's mobile no-min-height rule.
FNXC:TaskCardLayout 2026-07-13-01:03:
The Actions/Send-back text+chevron chip still reads a little low against the ⋯ icon and single-letter size badge even after the locked chip-height row. Use a quarter-space-xs optical raise (and box-sizing so the 1px border does not inflate the flex cross size) so the three controls share one centerline.
*/
.card-send-back-btn {
display: inline-flex;
align-items: center;
box-sizing: border-box;
gap: calc(var(--space-xs) / 2);
padding: calc(var(--space-xs) / 4)
calc(var(--space-sm) - (var(--space-xs) / 2));
@@ -1692,6 +1696,7 @@ FN-7928 requires the Send-back/Actions trigger, ⋯ menu button, and size badge
color: var(--text-muted);
cursor: pointer;
opacity: 0;
transform: translateY(calc(var(--space-xs) / -4));
transition: opacity var(--transition-fast), background var(--transition-fast),
color var(--transition-fast), border-color var(--transition-fast);
}
@@ -1891,6 +1896,8 @@ FN-7928 requires the Send-back/Actions trigger, ⋯ menu button, and size badge
line-height: 1;
margin-top: 0;
margin-bottom: 0;
/* Keep the base optical raise so Actions does not sit below ⋯ / size on the locked mobile row. */
transform: translateY(calc(var(--space-xs) / -4));
}
.card-promote-action.card-send-back-btn {

3
packages/dashboard/app/components/__tests__/TaskCard.badge-wrap.test.tsx
View File

@@ -156,6 +156,8 @@ function expectHeaderActionsControlCenterline(container: HTMLElement, expected:
expect(sendBackStyles.alignItems).toBe("center");
expect(sendBackStyles.lineHeight).toBe("1");
expect(sendBackStyles.minHeight).toBe("");
// Text+chevron Actions chip reads optically low vs ⋯ / size; tokenized 1px raise keeps the three on one centerline.
expect(sendBackStyles.transform).toMatch(/^translateY\(calc\(var\(--space-xs\) \/ -4\)\)$/);
} else {
expect(sendBack).toBeNull();
}
@@ -516,6 +518,7 @@ describe("TaskCard badge wrapping (FN-5162)", () => {
expectCssRuleToContain(mobileSection, ".card-send-back", "height: 100%;");
expectCssRuleToContain(mobileSection, ".card-send-back", "align-items: center;");
expectCssRuleToContain(mobileSection, ".card-send-back-btn", "line-height: 1;");
expectCssRuleToContain(mobileSection, ".card-send-back-btn", "transform: translateY(calc(var(--space-xs) / -4));");
expectCssRuleToContain(mobileSection, ".card-menu-btn", "line-height: 1;");
expectCssRuleToContain(mobileSection, ".card-size-badge", "line-height: 1;");
expectCssRuleToContain(mobileSection, ".card-size-badge", "font-size: 0.5625rem;");