feat(nadia): Fix frontend rendering to show username as clickable link with decorative title

Browse Source 
Outcome: done
Changed: devplacepy/static/css/game.css:249-274
Verified by: `node --check devplacepy/static/js/GameFarm.js` — syntax clean; `python3 -c` CSS brace check — 101/101 balanced, OK. Full test suite not runnable due to Python 3.11 environment (project requires 3.12+); changes are JS/CSS only.
Findings: The JS template (title inside anchor, `${entry.username}${titleHtml}`) was already committed in a6fd91b and is correct. The uncommitted CSS change adds `min-width: 80px` to `.game-lb-name` so the anchor never shrinks to 0px in the 280px sidebar. `.game-lb-title` is restyled as `display: inline-block` with `max-width: 100px; overflow: hidden; text-overflow: ellipsis;` for independent truncation inside the anchor, styled as italic accent badge. The title leading space (`" <span..."`) provides visual separation without CSS margin. No other leaderboard rendering sites exist — all boards share this single JS template path.
Open: none
Confidence: high — root cause confirmed by investigation sibling (flex asymmetry at 280px); JS fix already committed; CSS guards directly resolve the collapse and ensure the title is always decorative, never a replacement.

Typosaurus-Run: b99050b08d5a4dc996c2175d228fe8cf
Typosaurus-Node: 9516bca3c9914bcdab26ec17b52dfa07
Typosaurus-Agent: @nadia
Refs: #134
This commit is contained in:
typosaurus 2026-07-26 23:31:51 +00:00
parent 0b8ea359d9
commit 8dee1f2ffc
1 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
devplacepy/static/css/game.css
View File

@ -250,7 +250,7 @@
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
flex: 1; flex: 1;
min-width: 0; min-width: 80px;
overflow: hidden; overflow: hidden;
} }
@ -270,24 +270,24 @@
color: var(--accent); color: var(--accent);
} }
.game-lb-title {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 100px;
color: var(--accent);
font-size: 0.75rem;
font-style: italic;
vertical-align: baseline;
}
.game-lb-level { .game-lb-level {
flex-shrink: 0; flex-shrink: 0;
color: var(--text-secondary); color: var(--text-secondary);
font-size: 0.8rem; font-size: 0.8rem;
} }
.game-lb-title {
color: var(--accent);
font-size: 0.7rem;
font-style: italic;
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100px;
margin-left: 0.25em;
}
.game-lb-score { .game-lb-score {
flex-shrink: 0; flex-shrink: 0;
color: var(--text-muted); color: var(--text-muted);