fix(next to expire): the headline answers the cursor

It is the thing on the page a reader is most likely to tap and the only
clickable text in the panel that did nothing under the pointer — the
queued deadlines beneath it brighten, and every list row brightens, so
the headline read as a heading rather than as a way in.

Co-Authored-By: Claude Opus 5 (1M context) <[email protected]>
This commit is contained in:
Lucas Winther
2026-08-19 05:31:20 +02:00
co-authored by Claude Opus 5
parent eafb2a596e
commit 74a50f8dca
+6 -2
View File
@@ -63,12 +63,16 @@ export function NextUp({
<div className="relative"> <div className="relative">
<p className="eyebrow">Next to expire</p> <p className="eyebrow">Next to expire</p>
{/* The one thing on the page a reader is most likely to tap, and it was
the only clickable text here that did not answer the cursor — the
queued rows under it brighten, the row list brightens, and this sat
inert and read as a heading rather than a way in. */}
<button <button
type="button" type="button"
onClick={() => onOpen(event.id)} onClick={() => onOpen(event.id)}
className="mt-2 block max-w-full text-left" className="group mt-2 block max-w-full text-left"
> >
<h1 className="font-display text-[1.75rem] font-semibold leading-[1.15] tracking-tight"> <h1 className="font-display text-[1.75rem] font-semibold leading-[1.15] tracking-tight transition-colors duration-150 group-hover:text-ink-strong">
{event.title} {event.title}
</h1> </h1>
<p className="mt-1 text-sm" style={{ color: game.hue }}> <p className="mt-1 text-sm" style={{ color: game.hue }}>