From 9f7e6ee0e360f2c4491dbe37b1f888951c30cae8 Mon Sep 17 00:00:00 2001 From: Fini Jastrow Date: Mon, 9 Oct 2023 17:22:08 +0200 Subject: [PATCH] Fix navbar in two lines [why] The navbar should only be one line, switching to smaller and smaller items, until we reach a very small size (the smallest) where we finally allow it to overlow into the next lines. But that is not the case, the navbar switches between one and two lines already at medium sized screens. [how] Correct the width point when the navbar titles switch from long-titles to short-titles. Introduce new width switch point that reduces the cell widths of the navbar one they become very full and further reduction in width would result in overflow into the next line. Tested on Netscape and Chromium; the later needs bigger numbers (hmm) Fixes: #1375 Signed-off-by: Fini Jastrow --- _includes/css/nerd-font-tweaks.scss | 6 ++++++ _includes/css/skeleton.scss | 4 ++-- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/_includes/css/nerd-font-tweaks.scss b/_includes/css/nerd-font-tweaks.scss index 64f2c38142..fa034617c8 100644 --- a/_includes/css/nerd-font-tweaks.scss +++ b/_includes/css/nerd-font-tweaks.scss @@ -738,6 +738,12 @@ a.nerd-font-button:before { } } +@media only screen and (max-width: 785px) { + nav ul li { + min-width: 50px; + } +} + /* util */ .text-left { diff --git a/_includes/css/skeleton.scss b/_includes/css/skeleton.scss index 46bc86e37b..3eb15b1d0a 100644 --- a/_includes/css/skeleton.scss +++ b/_includes/css/skeleton.scss @@ -91,14 +91,14 @@ } /* top nav tweaks */ -@media(min-width:768px) { +@media(min-width:940px) { .hide-on-larger-view { display: none !important; } } -@media(max-width:767px) { +@media(max-width:939px) { .hide-on-smaller-view { display: none !important; }