envide/teecup
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rett navn-avkorting på smale mobilskjermer i offentlig leaderboard

Browse source 
Funnet under scratch-verifisering (360px viewport): spillernavn ble kuttet
med "..." ("Erol Haag..."), under lesbarhetsbarren (CLAUDE.md, ufravikelig
tilgjengelighetsregel). Navnet får nå bryte til ny linje i stedet for å
avkortes -- undertittelen (HCP/klasse) beholder truncate siden den er
mindre kritisk. Strammet også inn radens gap/padding på de minste
skjermene for å gi navnekolonnen mer plass. Verifisert på nytt mot 360px
med et bevisst langt testnavn, bekreftet OK.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Erol Haagenrud 2026-08-21 20:08:11 +02:00
parent 9fad4b3f38
commit b8e7d1d004
2 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
frontend/components/public-individual-live.tsx
View file

@ -305,7 +305,12 @@ function LeaderboardRow({
<> <>
<RankBadge position={entry.position} isLeader={entry.is_leader} /> <RankBadge position={entry.position} isLeader={entry.is_leader} />
<span className="flex min-w-0 flex-1 flex-col"> <span className="flex min-w-0 flex-1 flex-col">
<span className="truncate text-[15px] font-bold text-foreground">{entry.player_name}</span> {/* Navnet får bryte til ny linje i stedet for å avkortes med "..." på
smale skjermer (360px) -- funnet 2026-08-21 under scratch-
verifisering: et reelt navn ("Erol Haagenrud") kuttet ned til
"Erol Haag..." er under lesbarhetsbarren (CLAUDE.md, ufravikelig).
Undertittelen (HCP/klasse, mindre viktig) beholder truncate. */}
<span className="text-pretty text-[15px] font-bold leading-tight text-foreground">{entry.player_name}</span>
<span className="truncate text-xs text-muted-foreground"> <span className="truncate text-xs text-muted-foreground">
{entry.handicap_index != null && `HCP ${entry.handicap_index.toFixed(1).replace(".", ",")}`} {entry.handicap_index != null && `HCP ${entry.handicap_index.toFixed(1).replace(".", ",")}`}
{entry.handicap_index != null && entry.class_name ? " · " : ""} {entry.handicap_index != null && entry.class_name ? " · " : ""}
@ -356,7 +361,7 @@ function LeaderboardRow({
) )
if (!roundId) { if (!roundId) {
return <li className="flex items-center gap-2.5 px-3 py-3 sm:px-4">{rowInner}</li> return <li className="flex items-center gap-2 px-2.5 py-3 sm:gap-2.5 sm:px-4">{rowInner}</li>
} }
return ( return (
@ -366,7 +371,7 @@ function LeaderboardRow({
onClick={() => void toggle()} onClick={() => void toggle()}
aria-expanded={open} aria-expanded={open}
aria-controls={panelId} aria-controls={panelId}
className="flex w-full items-center gap-2.5 px-3 py-3 text-left transition-colors hover:bg-muted/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset sm:px-4" className="flex w-full items-center gap-2 px-2.5 py-3 text-left sm:gap-2.5 transition-colors hover:bg-muted/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset sm:px-4"
> >
{rowInner} {rowInner}
<span className="sr-only">{open ? "Skjul hull for hull" : "Vis hull for hull"}</span> <span className="sr-only">{open ? "Skjul hull for hull" : "Vis hull for hull"}</span>

2
frontend/tsconfig.tsbuildinfo
View file

File diff suppressed because one or more lines are too long