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:
@@ -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);
|
||||
|
||||
@@ -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");
|
||||
|
||||
@@ -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;/);
|
||||
|
||||
Reference in New Issue
Block a user