Allow overflow-x with horizontal scrolling in VPNav

[mohdibntarek]

Description

This PR fixes the issue of a truncated navigation bar when the content of the navbar is too wide for the viewport but the viewport width is more than 960px which is hard-coded in the media query.

Linked Issues

Downstream issues

• Top navigation bar LuxDL/DocumenterVitepress.jl#61
• Right side of page truncated LuxDL/DocumenterVitepress.jl#118

Additional Context

I am not a CSS expert so this may not be the cleanest fix.

---

Tip

The author of this PR can publish a preview release by commenting /publish below.

[mohdibntarek]

A video sample showing the effect of that change by editing the CSS directly in the browser.

Screen.Recording.2026-01-19.at.2.42.08.PM.mov

[mrcego]

A video sample showing the effect of that change by editing the CSS directly in the browser.

Screen.Recording.2026-01-19.at.2.42.08.PM.mov

Cool fix! Could be ok if logo and search input it's still visible and the rest is scrollable.

[mohdibntarek]

I pushed a commit that limits the scrolling to the menu bar, keeping the logo, search bar and theme and layout change buttons fixed. However, an issue that existed with the previous solution and persists which I just noticed is that the drop-down menus are no longer floating. I show the issue in the video. I tried simple z-index potential fixes but they didn't work.

Also my development environment where I try these changes is very primitive because I almost never do any JS or CSS development. So I basically just tweak the CSS in the browser and mimic the changes in the repo. This gets tedious with larger changes. Ideally, I should do a proper test build of vitepress and the website to ensure the changes propagate as expected. I will probably revisit this on and off just for fun until I fix it or a CSS expert comes along and solves the issue first.

output.mp4

[mohdibntarek]

For reference, the current state of the website is https://deeppumas-docs.pumas.ai/stable/.