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:
@@ -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 */
|
||||
|
||||
@@ -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", () => {
|
||||
|
||||
Reference in New Issue
Block a user