Navigation Panel Overlaps Header? (Mobile)

Hello,
In the past couple hours I believe an update was issued that has caused issues for mobile users on our site by pushing the navigation panel to overlap the header and making it so we can’t click to our profiles, notifications etc…

Anyone know why this has happened/how to fix it?

Thank you.

Is this site public? could you share a link?

4 Likes

Registration is closed.

https://dnstars.vip

I saw this on another discourse for Pi Hole last night. Not sure if related, at the time I assumed it was their own customization.

1 Like

Yeah same issue, happening on both iOS and Android. Just removed the header code for now until something can be done. Any ideas?

Maybe @Johani can advise.

1 Like

Could you share the code being used? It’s hard to diagnose this by sight.

4 Likes

I think I know what’s going on here because I came across this before.

Your site is not loading for me now, but when I looked yesterday I noticed that the menu uses the same class names used here:

The menu on https://discourse.pi-hole.net/ uses very, very similar styles - although the classes are different. Essentially all of these sites are using some variation of

on both desktop and mobile, which I believe is not the intended use for that customization. I think it’s meant for desktop only since mobile has no space for menus in that area.

I’m not really sure how this ever worked on your site in the mobile view.

You have a few of options:

  1. modify the code to make it responsive (not really worth it as you’d only be able to show one link tops due to lack of space)

  2. move the customization to desktop tabs in your theme.

  3. use one of the supported theme components I mentioned here

3 Likes

Thanks mate, I’m working on this currently Header submenus - however some of the icons don’t appear?

Got it all sussed. thanks again.

As Johani has replied below, we were using the same as those other pages. I’ve gone for this now Header submenus.

Thanks

4 Likes