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

@ -177,8 +177,10 @@ Themes: `web` = default frosted-glass website (sidebar + content, light/dark),
top panel it's just noise; the desktop/tablet sidebar keeps it.
- On phones (`max-width: 640px`) the section nav (`.web-nav`) stops being the
sideways-scrolling row it is on tablets and becomes a wrapping **grid**
(3-up, 2-up below `375px`) of button tiles, so every section fits with no
horizontal scroll — the collapsed top panel must never scroll sideways.
(3-up, 2-up below `375px`) styled to match the Light/Dark toggle (`.web-ctl`):
same `--btn-*` surface / radius / shadow and `0.82rem` / `600` type. Every
section fits with no horizontal scroll — the collapsed top panel must never
scroll sideways.
- Under `max-width: 640px` the year-grid heatmap (`.heatmap-container`) and its
legend/hover row (`.heatmap-status-row`) are `display: none` — the grid is
unreadable at phone widths. The contribution total and the commit history