Use width:fit-content on h1 for bulletproof logo-title alignment

The h1 shrinks to its widest child (GolfCards.club), centers via
margin auto, and text-align left aligns both lines within it.
No breakpoint-dependent transforms needed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-23 23:14:56 -05:00
parent d32ae83ce2
commit 1b748470a0

View File

@ -101,8 +101,9 @@ body {
filter: drop-shadow(1px 2px 2px rgba(0,0,0,0.25)); filter: drop-shadow(1px 2px 2px rgba(0,0,0,0.25));
} }
#lobby-screen h1, #lobby-screen h1 {
#lobby-screen .logo-row { width: fit-content;
margin: 0 auto;
text-align: left; text-align: left;
} }
@ -113,12 +114,10 @@ body {
@media (max-width: 749px) { @media (max-width: 749px) {
#lobby-screen h1 { #lobby-screen h1 {
width: auto;
text-align: center; text-align: center;
text-indent: -18px; text-indent: -18px;
} }
#lobby-screen .logo-row {
text-align: center;
}
.logo-row { .logo-row {
display: inline; display: inline;
margin-bottom: 0; margin-bottom: 0;