kyle/SignageHTML
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use 2-column grid for normal mode on large screens

Browse Source 
Change from 4-column to 2-column grid in the @media (min-width: 1200px)
block for body.normal, giving each departure card ~580px width on 1080p
monitors. Also add font-size increases for destination text (1.1em),
countdown numbers (1.4em), and next departures (0.9em) to improve
readability at the wider card size.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
kyle
2026-02-15 20:00:26 +01:00
parent 84ce6efb2d
commit f0b04a7a0d
1 changed files with 13 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
public/css/main.css
View File

@@ -101,7 +101,7 @@ body {
body.normal .departure-container { body.normal .departure-container {
display: grid; display: grid;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(2, 1fr);
gap: 6px; gap: 6px;
margin-bottom: 0; margin-bottom: 0;
width: 100%; width: 100%;
@@ -127,6 +127,18 @@ body {
margin: 0; margin: 0;
max-width: 100%; max-width: 100%;
} }
body.normal .direction-destination {
font-size: 1.1em;
}
body.normal .countdown-large {
font-size: 1.4em;
}
body.normal .next-departures {
font-size: 0.9em;
}
} }
/* ======================================== /* ========================================