Repository navigation
Add the Activity rail and mobile panel to /news/ #278
Copy link
Copy link
Labels
Description
Part of #271 (Phase 4).
Why. Option A, decided in #266: the news cards keep the main column, and an Activity rail beside them shows the latest updates, so anyone glancing at News sees that the project is active. The design is section 2 of the round-2 handoff (see the round 2 outcome), as amended there.
Panel height. Round 2 chose a tinted panel that runs the full height of the news column. With real content it may read as unfinished: with 20 cards the panel is about 3,400px tall at 1440px, beside about 570px of rail content under All, so around 80% of it is empty tint. The fitted fallback is CSS-only: the column goes transparent, and the tint, border and radius sit on the sticky box.
Work.
- A two-column grid at 1200px and wider. The
<aside>comes first in the source. This page'ssection.inner-pagegetsoverflow: clip, because the site-widesection { overflow: hidden }(main.scssline 779) stopsposition: stickyworking. - The rail:
- the latest 6 rows under Monday–Sunday week headings;
- a type filter;
- "View all activity", and the feed link once
/activity/feed.xmlexists.
- Stickiness:
- only the list sticks;
- it sticks by its bottom edge when it's taller than the screen;
- a small "Activity" label goes inside the sticky part;
- build the panel full height as designed, then judge it on this PR's preview at 1280×720 and 1440×900 under All and Translations. If it reads as an unfinished column, switch to the fitted fallback.
- The mobile panel below 1200px: collapsed, with its summary line plus a short second line such as "Library releases and lecture updates, from GitHub".
- Fixes the handoff didn't specify:
- scope the panel-collapse rule to below 1200px; as written, it hides the desktop rail;
scroll-padding-topon/news/too, so keyboard focus never lands under the fixed header (WCAG 2.2 SC 2.4.11);- a visually hidden
<h2>before the news list, so the posts aren't filed under "Activity"; - on phones, the title link is stretched over the row rather than wrapping it, so the link doesn't read the whole summary.
- Remove the intro line under the News h1.
Acceptance criteria (handoff checks)
- 1: at 390×844, with the sponsor bar shown and the panel collapsed, the newest post's whole title is visible.
- 2: no horizontal scroll at 320px.
- 3: at 1280×720 with the sponsor bar, every part of the rail, including "View all activity", can be reached under every filter.
- 4: the rail's rows and week headings under each filter match the fixture from Compute the Activity rows at build time, with tests #276.
- 8: AA contrast and visible focus, including tabbing back through a stuck rail.
- 9: the panel reads "Activity · 6 updates in September · latest Sep 27", with the second line below.
- Resizing across 1200px with the panel open keeps its state.
- The panel height is judged on the preview, and the choice is recorded in Design review: Activity and News pages #266's Decisions table.
Reactions are currently unavailable
Activity
mmcky commentedon Sep 29, 2026
Decisions for the build (2026-09-29).
/activity/. Check that five buttons fit./activity/feed.xmlexists onmainwhen this is built.activity: add the Activity rail to /news/, with a collapsed panel bel…