feat(FN-4295): complete Step 5 — documentation & delivery

Fusion-Task-Id: FN-4295
Fusion-Task-Lineage: e2a47487-33f5-4077-8031-c7bb14882121
This commit is contained in:
Fusion
2026-05-13 10:07:42 -07:00
committed by gsxdsm
parent e640da60eb
commit e4d5216c0f
3 changed files with 36 additions and 13 deletions

View File

@@ -1133,6 +1133,18 @@
/* === Mobile Responsive Overrides === */
@media (max-width: 768px) {
.card-header {
flex-wrap: wrap;
row-gap: var(--space-xs);
}
.card-header-actions {
width: 100%;
margin-left: 0;
justify-content: flex-end;
flex-wrap: wrap;
}
/* Card edit button: always visible on mobile (no hover) */
.card-edit-btn {
opacity: 1;
@@ -1174,12 +1186,14 @@
.card-archive-btn,
.card-unarchive-btn {
opacity: 1;
padding: calc(var(--space-xs) - (var(--space-xs) / 4)) var(--space-sm);
min-height: calc(var(--space-xl) + var(--space-md));
padding: var(--space-xs) var(--space-md);
}
.card-send-back-btn {
opacity: 1;
padding: calc(var(--space-xs) - (var(--space-xs) / 4)) var(--space-sm);
min-height: calc(var(--space-xl) + var(--space-md));
padding: var(--space-xs) var(--space-md);
}
/* Card: compact progress bar on narrow cards */

View File

@@ -226,19 +226,25 @@ describe("TaskCard mobile", () => {
expectRuleToContain(mobileSection, ".card-archive-btn", "opacity: 1;");
});
it("does not force .card-archive-btn min-height in the mobile media block", () => {
it("uses tokenized 36px min-height for archive/unarchive/send-back buttons in the mobile media block", () => {
const css = loadAllAppCss();
const mobileSection = getMainMobileSection(css);
// Archive buttons use natural height from padding — no forced min-height
const pattern = /([^{}]+)\{([\s\S]*?)\}/g;
for (const match of mobileSection.matchAll(pattern)) {
const selector = match[1].trim();
const block = match[2];
if (!selector.includes(".card-archive-btn") && !selector.includes(".card-unarchive-btn")) continue;
// Archive/unarchive buttons should not have min-height in mobile block
expect(block).not.toContain("min-height");
}
expectRuleToContain(
mobileSection,
".card-archive-btn",
"min-height: calc(var(--space-xl) + var(--space-md));",
);
expectRuleToContain(
mobileSection,
".card-unarchive-btn",
"min-height: calc(var(--space-xl) + var(--space-md));",
);
expectRuleToContain(
mobileSection,
".card-send-back-btn",
"min-height: calc(var(--space-xl) + var(--space-md));",
);
});
it("does not force .card-steps-toggle min-height in the mobile media block", () => {
@@ -276,8 +282,11 @@ describe("TaskCard mobile", () => {
it("keeps TaskCard timer chip in-flow and right-aligned in footer metadata row", () => {
const css = loadAllAppCss();
const mobileSection = getMainMobileSection(css);
expectRuleToContain(css, ".card-time-indicator", "margin-left: auto;");
expectRuleToContain(css, ".card-header-actions", "margin-left: auto;");
expectRuleToContain(mobileSection, ".card-header-actions", "width: 100%;");
expectRuleToContain(mobileSection, ".card-header-actions", "margin-left: 0;");
});
it("truncates TaskCard files-changed text instead of wrapping", () => {