Giorgio Gilestro
2b3ea33884
≤480px gets a hamburger button in the topbar and a fixed slide-out panel from the right edge (width min(82vw, 320px)). The topbar keeps only brand + tone toggle + hamburger visible; nav and the header-right widgets (theme, lang, user menu, version meta) move into the drawer. Markup change: nav and .header-right are now wrapped in .mobile-drawer, which is display:contents on desktop (no layout effect) and a fixed translateX panel on mobile. The user-menu dropdown chip hides on mobile and its links surface flat inside the drawer. JS: ~50 lines of vanilla. Tap hamburger / backdrop / ESC / swipe- right-on-drawer all close. Clicking a nav link inside the drawer closes it after the navigation kicks off so the panel doesn't linger on the next page. CSS: per-file @media block at the bottom of layout.css per the agreed-upon organisation. |
||
|---|---|---|
| .. | ||
| auth.css | ||
| dashboard.css | ||
| layout.css | ||
| log-chat.css | ||
| news.css | ||
| panels.css | ||
| portfolio.css | ||
| public.css | ||
| settings.css | ||
| tokens.css | ||