Mobile-Fixes: Spiele scrollbar + FinalFlux-Hub Overlap/Menue
- MindMatch/TechTacular: Boards passten auf dem Handy nicht in 100vh
(iOS-Adressleiste) und die Seite war auf overflow:hidden gesperrt ->
untere Felder unerreichbar. Auf <=820px jetzt scrollbar (height:auto,
overflow-y:auto, 100dvh), Karten via aspect-ratio, Kacheln via min-height.
- FinalFlux-Hub: das generische `main {}` aus der Alt-style.css traf das
Hub-<main class="finalflux-main"> (display:flex; width:90%; margin:auto)
und verursachte Overlap + unerreichbares Themen-Menue. In .finalflux-main
neutralisiert; Shell stapelt auf Mobil als display:block, Sidebar volle Hoehe.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -264,3 +264,13 @@ body.tt-body {
|
||||
.tt-stat { font-size: 0.62rem; padding: 0.3rem 0.5rem; }
|
||||
.tt-q-text { font-size: 1.05rem; }
|
||||
}
|
||||
|
||||
/* Auf Touch/Handy scrollbar: das "alles passt ohne Scrollen"-Layout bricht bei
|
||||
100vh (iOS-Adressleiste) und 5x5-Board -> untere Reihen (500) unerreichbar.
|
||||
Hier: Seite scrollbar, Kacheln mit fester Mindesthöhe statt flex-fill. */
|
||||
@media (max-width: 820px) {
|
||||
body.tt-body { height: auto; min-height: 100vh; min-height: 100dvh; overflow-y: auto; }
|
||||
.tt-stage { overflow: visible; }
|
||||
.tt-board { height: auto; }
|
||||
.tt-tile { flex: 0 0 auto; min-height: clamp(58px, 12vw, 86px); }
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user