[rdlu]

The home page's headline now works like the NMSii hero (rdlu/nms-items-interface#25). It types each line, holds it, backspaces it and moves on to the next, round and round, with a 35-70 ms jitter between keys.

Lines

The lines are in the hero front matter of site/content/_index.md, each written as { text, hold }. Adding, dropping or retiming a line changes one line there. layouts/_shortcodes/hero-typed.html renders them.

#	Line	Hold
1	plugii: a live USB port monitor for Linux	4.5 s
2	Know what every USB port is really doing	5 s (the tagline)
3	10G capable, linked at 5G. It's the cable.	2.5 s
4	USB-C: the C is for Could be anything.	2.5 s

Behaviour

• Return visits: the site isn't a SPA, so "once per page load" becomes once per tab session (sessionStorage). Coming back to the home page picks up at the tagline, already typed.
• Cursor: the block cursor stays solid while text is typed or erased, and blinks while a line is held or paused.
• No layout shift: every line sits invisibly in the h1's grid cell. The > prompt and the cursor are on each line, so they all wrap the same way.
• Pause toggle (WCAG 2.2.2): ‖ pause / ▶ resume. It is a 24 px button positioned absolutely in the headline's bottom margin, with an aria-label that changes with its state and a focus ring.
• Automatic holds: the rotation also stops while the mouse is over the line (mouse only), while the toggle has keyboard focus, while the tab is hidden, and while the hero is scrolled out of view. Resuming with the toggle also lifts the focus hold.
• Screen readers, reduced motion and no-JS: screen readers hear only the tagline (the h1's aria-label). With reduced motion or without JS, the tagline shows still and there is no toggle.

The NMSii PR's Enter-key fix doesn't apply here, because the docs site has no page-wide key handler that takes Enter.

Checks

These ran in headless chromium against hugo server:

• Height: the h1 was sampled every 50 ms for 28 s, which covers all four lines.
  • At 1400 px the h1 was always 64 px tall, in both dark and light themes.
  • At 390 px it was always 160 px tall, in both themes.
  • The subtitle's top never moved.
• Holds, each started mid-typing: hover, a hidden tab and the hero scrolled away each kept the text frozen for 5.5 s, and the typing resumed afterwards.
• Toggle: keyboard focus on it holds the rotation, Enter pauses it, and Enter again resumes it.
• Return visit: a reload in the same tab starts on the tagline.
• Reduced motion: the tagline is static and the toggle stays hidden.

🤖 Generated with Claude Code