style phone section nav like the light/dark toggle

This commit is contained in:
Martin Dvořák 2026-09-30 13:26:36 +00:00
commit b6abd972f1
2 changed files with 11 additions and 6 deletions

View file

@ -1116,19 +1116,22 @@ html[data-theme="web"][data-scheme="dark"] .heatmap-legend-cell[data-level="4"]
}
/* Section nav: fit every link on screen instead of a sideways-scrolling row,
so the collapsed top panel never scrolls horizontally — a 3-up button
grid (2-up on very narrow phones, see the 374px block below). */
grid (2-up on very narrow phones, see the 374px block below) styled like
the Light/Dark toggle (.web-ctl): same surface, radius, shadow and type. */
.web-nav {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 6px;
gap: 8px;
overflow: visible;
padding-bottom: 0;
}
.web-nav a {
justify-content: center;
padding: 9px 8px;
border: 1px solid var(--btn-border, var(--glass-border));
background: var(--btn-bg, var(--glass-lo));
box-shadow: var(--btn-shadow, none);
color: var(--fg);
font-size: 0.82rem;
font-weight: 600;
}
.project-grid {
columns: 1;