Standardize on the .agents/ directory (shared with project skills): phases/, user_stories/, reports/, screenshots/, validate.sh, and phase-sessions/ + pipeline.log all move to .agents/ (git mv preserves history; runtime artifacts move alongside). Updates every reference in AGENTS.md, README.md, .gitignore, app docstrings, and test story headers. Historical KB content in data/ and the runtime pipeline.log transcript are left untouched.
1.7 KiB
1.7 KiB
Story: One Header, Same Size Everywhere
Phase: 12_header_consistency.md · E2E: tests/e2e/test_header_consistency.py
Narrative
As a user, I want the top bar to be the same height on every page so moving between Chat, Sources, and a document never feels like the app "grew".
Today the document viewer (the page whose back button says "Sources") uses a content-sized header (≈66px desktop / ≈63px+ mobile) while Chat and Sources use the fixed 64px bar (58px mobile) — the perceived "header changes size between sources and chat".
- Given any of the three pages at any viewport
- When I look at the sticky top bar
- Then it is exactly
var(--header-h)tall on all of them.
Acceptance criteria
.doc-headeris exactlyvar(--header-h)tall (64px desktop, 58px ≤640px) — same box as.app-headeron/and/sources.html.- Title + meta still fit: title stays single-line (ellipsis), meta row clips instead of growing the header on narrow screens.
- Existing phase-10 viewer behavior (back link, title, meta badges, a11y frame) unchanged.
- Unit + integration green,
app/coverage >90%, story E2E green in isolation, one--no-gpg-signcommit.
Playwright Mapping Rule
Test Scenario → tests/e2e/test_header_consistency.py:
test_header_height_identical_across_pages_desktop— measured bounding boxes of.app-header(chat),.app-header(sources),.doc-header(viewer) are all exactly 64px tall.test_header_height_identical_across_pages_mobile— same at a 375px viewport: all exactly 58px.test_viewer_header_content_still_fits— title ellipsizes, meta row visible, back link + badges present (regression guard for phase 10).