alee/golfgame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add subtle dark gradient to mobile header for status bar visibility

Browse Source 
Replaces background:none with a dark-to-transparent gradient so the
status message and mute button are visible against the green felt.
Reverts mute button circle in favor of the gradient approach.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-22 17:08:57 -05:00
parent 0e594a5e28
commit 118912dd13
1 changed files with 6 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
client/style.css
View File

@ -4966,15 +4966,15 @@ body.mobile-portrait .game-header {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
padding: 2px 0; padding: 6px 8px;
padding-top: env(safe-area-inset-top, 0px); padding-top: calc(6px + env(safe-area-inset-top, 0px));
font-size: 0.75rem; font-size: 0.75rem;
min-height: 0; min-height: 0;
width: 100%; width: 100%;
margin-left: 0; margin-left: 0;
gap: 4px; gap: 4px;
margin-bottom: 8px; margin-bottom: 4px;
background: none; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0%, transparent 100%);
} }
body.mobile-portrait .header-col-left { body.mobile-portrait .header-col-left {
@ -5020,16 +5020,8 @@ body.mobile-portrait #leave-game-btn {
} }
body.mobile-portrait .mute-btn { body.mobile-portrait .mute-btn {
font-size: 0.85rem; font-size: 0.95rem;
padding: 4px; padding: 2px;
background: rgba(0, 0, 0, 0.35);
border-radius: 50%;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0.9;
} }
body.mobile-portrait .final-turn-badge { body.mobile-portrait .final-turn-badge {