jedarden/ai-code-battle
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Bug fix bf-1unj: Fix match card participant names cut off on mobile

Browse source 
- Add display: flex and align-items: center to .participant on mobile
- Change .participant-name from flex-shrink: 1 to flex: 1 for proper space allocation
- Add margin-left spacing to .participant-score and .winner-badge
- Ensures all participant info (name, score, winner badge) is visible on mobile

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
jedarden 2026-05-13 18:34:19 -04:00
parent 3a5244fbae
commit 676cd8bc64
1 changed files with 6 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
web/src/styles/mobile.css
View file

@ -396,13 +396,16 @@
}
.participant {
display: flex;
align-items: center;
gap: var(--space-xs);
flex-shrink: 1;
min-width: 0;
padding: var(--space-xs) var(--space-sm);
}
.participant-name {
flex-shrink: 1;
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
@ -411,10 +414,12 @@
.participant-score {
flex-shrink: 0;
margin-left: var(--space-xs);
}
.winner-badge {
flex-shrink: 0;
margin-left: var(--space-xs);
}
.match-footer {