fix navToggle in landscape mode

This commit is contained in:
stefan.tollkuehn committed 2026-10-07 16:58:15 +02:00
1 parent 1a00e7430a
commit faa5f428d0
1 file changed
+25 -36
+25 -36
View File
@@ -289,41 +289,6 @@ button, .button {
} }
} }
/*
* Schmale Bildschirme: Navbar umbrechen lassen,
* Abstände und Logo verkleinern.
*/
@media (max-width: 600px) {
body {
/* 130px räumen die fixe Navbar frei */
padding-top: 130px;
/* min-height gilt für die Content-Box: Navbar-Freiraum
* abziehen, sonst sitzt die Karte unter der Mitte */
min-height: calc(100vh - 130px);
}
.navbar {
top: 8px;
left: 4%;
width: 92%;
padding: 10px;
flex-wrap: wrap;
}
.logo-bar img {
height: 40px;
}
button, .button {
padding: 10px 14px;
font-size: 15px;
}
.card {
padding: 20px;
}
}
/* Sehr schmale Telefone: noch kompakter */ /* Sehr schmale Telefone: noch kompakter */
@media (max-width: 400px) { @media (max-width: 400px) {
.navbar { .navbar {
@@ -350,14 +315,38 @@ button, .button {
/* /*
* Phone: Navbar-Aktionen in beiden Ausrichtungen * Phone: Navbar-Aktionen in beiden Ausrichtungen
* hinter dem Hamburger-Button als Dropdown anzeigen. * hinter dem Hamburger-Button als Dropdown anzeigen.
*
* Landscape-Phone: Viewport breiter als 600px – kurze
* Seite (Höhe) und Touch-Eingabe entscheiden.
*/ */
@media (max-width: 600px) { @media (max-width: 600px),
(orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
body { body {
/* Navbar ist hier einzeilig */ /* Navbar ist hier einzeilig */
padding-top: 80px; padding-top: 80px;
min-height: calc(100vh - 80px); min-height: calc(100vh - 80px);
} }
.navbar {
top: 8px;
left: 4%;
width: 92%;
padding: 10px;
}
.logo-bar img {
height: 40px;
}
button, .button {
padding: 10px 14px;
font-size: 15px;
}
.card {
padding: 20px;
}
button.nav-toggle { button.nav-toggle {
display: inline-flex; display: inline-flex;
} }