Tighten landscape logo-golfer gap, alternate suit colors on ball logo

Reduce golfer-container margin from 10px to 4px in landscape (2-row)
mode while keeping 10px on mobile. Swap bottom suits to checkerboard
pattern: club/diamond on top, heart/spade on bottom.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-24 01:52:25 -05:00
parent 4b00094140
commit 7c58543ec8
2 changed files with 6 additions and 3 deletions

View File

@ -62,6 +62,6 @@
<!-- Card suits - 2x2 grid --> <!-- Card suits - 2x2 grid -->
<text x="36" y="40" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#1a1a1a" text-anchor="middle">&#9827;</text> <text x="36" y="40" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#1a1a1a" text-anchor="middle">&#9827;</text>
<text x="64" y="40" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#cc0000" text-anchor="middle">&#9830;</text> <text x="64" y="40" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#cc0000" text-anchor="middle">&#9830;</text>
<text x="36" y="64" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#1a1a1a" text-anchor="middle">&#9824;</text> <text x="36" y="64" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#cc0000" text-anchor="middle">&#9829;</text>
<text x="64" y="64" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#cc0000" text-anchor="middle">&#9829;</text> <text x="64" y="64" font-family="Arial, sans-serif" font-size="28" font-weight="bold" fill="#1a1a1a" text-anchor="middle">&#9824;</text>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@ -141,13 +141,16 @@ body {
margin-left: 0; margin-left: 0;
margin-right: 10px; margin-right: 10px;
} }
.golfer-container {
margin-left: 10px;
}
} }
/* Golfer + ball container */ /* Golfer + ball container */
.golfer-container { .golfer-container {
position: relative; position: relative;
display: inline-block; display: inline-block;
margin-left: 10px; margin-left: 4px;
} }
/* Golfer swing animation */ /* Golfer swing animation */