froxxxy/bscscore
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(#28): place breaker indicator inline to the right of player name

Browse Source 
- Indicator now renders after the name, inline, sized to 1em height
- Tooltip/aria-label remains “Break”

Refs #28
This commit is contained in:
Frank Schwenk
2025-10-30 11:47:46 +01:00
parent 1bd9919b6b
commit a11d41f934
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/GameDetail.tsx
View File

@@ -46,15 +46,15 @@ const GameDetail = ({ game, onFinishGame, onUpdateScore, onUpdateGame, onUndo, o
key={name + idx} key={name + idx}
> >
<span className={styles['player-name']}> <span className={styles['player-name']}>
{name}
{(() => { {(() => {
const order = (game as any).breakOrder as number[] | undefined; const order = (game as any).breakOrder as number[] | undefined;
const breakerIdx = (game as any).currentBreakerIdx as number | undefined; const breakerIdx = (game as any).currentBreakerIdx as number | undefined;
if (order && typeof breakerIdx === 'number' && order[breakerIdx] === idx + 1) { if (order && typeof breakerIdx === 'number' && order[breakerIdx] === idx + 1) {
return <span title="Break" aria-label="Break" style={{ display: 'inline-block', width: 10, height: 10, borderRadius: '50%', background: '#fff', marginRight: 6, verticalAlign: 'middle' }} />; return <span title="Break" aria-label="Break" style={{ display: 'inline-block', width: '1em', height: '1em', borderRadius: '50%', background: '#fff', marginLeft: 6, verticalAlign: 'middle' }} />;
} }
return null; return null;
})()} })()}
{name}
</span> </span>
<div className={styles['progress-bar']}> <div className={styles['progress-bar']}>
<div <div