fix(ui): align delete icon inline in game list

Apply game-item grid layout to game list rows and switch to two-column layout (1fr auto) so the delete action has a fixed-width slot on the right.

Keeps existing delete button and accessibility attributes; prevents layout stretch.
No behavioral changes beyond layout; click targets unchanged.

Refs #26
This commit is contained in:
Frank Schwenk
2025-10-30 10:04:11 +01:00
parent de502741e7
commit 89300bc021
2 changed files with 4 additions and 2 deletions

View File

@@ -76,7 +76,7 @@
/* Game item with better symmetry and spacing */
.game-item {
display: grid;
grid-template-columns: auto 1fr auto;
grid-template-columns: 1fr auto;
align-items: center;
gap: var(--space-md);
padding: var(--space-lg);

View File

@@ -82,7 +82,9 @@ export default function GameList({
<Card
key={game.id}
variant="elevated"
className={game.status === 'completed' ? styles['completed'] : styles['active']}
className={
styles['game-item'] + ' ' + (game.status === 'completed' ? styles['completed'] : styles['active'])
}
>
<div
className={styles['game-info']}