Replace translateX hack with text-align left on h1 for logo alignment

Logo and title naturally left-align within the centered lobby box.
Mobile (<480px) gets text-align center + inline display for single line.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
adlee-was-taken 2026-02-23 23:02:17 -05:00
parent 4dff1da875
commit cd2d7535e3

View File

@ -101,17 +101,24 @@ body {
filter: drop-shadow(1px 2px 2px rgba(0,0,0,0.25));
}
#lobby-screen h1,
#lobby-screen .logo-row {
text-align: left;
}
.logo-row {
display: inline-block;
margin-bottom: -0.3em;
transform: translateX(-5.5rem);
}
@media (max-width: 449px) {
@media (max-width: 479px) {
#lobby-screen h1,
#lobby-screen .logo-row {
text-align: center;
}
.logo-row {
display: inline;
margin-bottom: 0;
transform: none;
}
}