Fix opponent row fitting 3 per row on mobile
- Remove excessive 44px bottom padding on game-table (was eating vertical space) - Tighten opponents-row: reduce gap 6px->4px, side padding 8px->4px - Reduce opponent-area side padding 5px->4px - Allow opponent areas to shrink (remove flex-shrink: 0) - 3 opponents now fit in ~367px, well within 412px Pixel 10 Pro Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
3b9522fec3
commit
6ba0639d51
@ -5006,7 +5006,6 @@ body.mobile-portrait .game-table {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
padding: 0 4px;
|
padding: 0 4px;
|
||||||
padding-bottom: calc(44px + env(safe-area-inset-bottom, 0px));
|
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -5016,9 +5015,9 @@ body.mobile-portrait .opponents-row {
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
gap: 4px 6px;
|
gap: 4px;
|
||||||
min-height: 0 !important;
|
min-height: 0 !important;
|
||||||
padding: 2px 8px 6px;
|
padding: 2px 4px 6px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
}
|
}
|
||||||
@ -5039,11 +5038,10 @@ body.mobile-portrait .player-row {
|
|||||||
body.mobile-portrait .opponents-row .opponent-area {
|
body.mobile-portrait .opponents-row .opponent-area {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
transform: none !important;
|
transform: none !important;
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
body.mobile-portrait .opponent-area {
|
body.mobile-portrait .opponent-area {
|
||||||
padding: 3px 5px 4px;
|
padding: 3px 4px 4px;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user