feat(FN-4059): keep task timestamps on a single row in detail modal

Adds a UI refinement to the TaskDetailModal that keeps timestamps on a single row instead of wrapping, with matching tests and docs for FN-4059.

Fusion-Task-Id: FN-4059
This commit is contained in:
Fusion
2026-05-11 19:27:39 -07:00
committed by gsxdsm
parent dcdcbd7644
commit bea1345b88
5 changed files with 7 additions and 3 deletions

View File

@@ -159,7 +159,7 @@
.detail-timestamps {
display: inline-flex;
align-items: center;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: var(--space-xs);
color: var(--text-dim);
margin-top: var(--space-xs);

View File

@@ -193,6 +193,8 @@ describe("TaskDetailModal", () => {
const timestamps = screen.getByLabelText("Task timestamps");
expect(timestamps).toHaveTextContent("Created 2d ago");
expect(timestamps).toHaveTextContent("Updated 3h ago");
expect(getComputedStyle(timestamps).flexWrap).toBe("nowrap");
expect(timestamps.querySelector(".detail-timestamp-separator")).toBeTruthy();
const times = timestamps.querySelectorAll("time");
expect(times[0]?.getAttribute("dateTime")).toBe("2026-05-09T12:00:00.000Z");

View File

@@ -32,7 +32,7 @@ describe("TaskDetailModal", () => {
const css = readDashboardStylesSource();
expectBaseRule(css, ".detail-timestamps", "display: inline-flex;");
expectBaseRule(css, ".detail-timestamps", "flex-wrap: wrap;");
expectBaseRule(css, ".detail-timestamps", "flex-wrap: nowrap;");
expectBaseRule(css, ".detail-timestamp-item", "display: inline-flex;");
expect(css).toMatch(/@media \(max-width: 768px\)\s*\{\s*\.detail-provenance\s*\{[^}]*\}\s*\.detail-timestamps\s*\{[^}]*flex-direction:\s*column;/);