Documentation menu bar including search functionality not working

[dlebauer]

Problem

Chrome based browsers

Using Chrome (or derivatives) when I open the documentation at https://pecanproject.github.io/documentation/develop/

At first, the menu bar shows up

But once I try to search, or navigate to other pages, it disappears and never returns. And when I try to search, the search box doesn't appear (although at first it is active).

Safari

This works on Safari, except that the menu and search bark can be hidden by the header bar, and it is necessary to scroll up (swipe down, depending on your perspective & settings) twice to see the menu bar and search box.

twice because the first time it appears then bounces back. the second time it appears and stays.

Before swiping down (and after swiping down once):

after swiping down twice

[eshantri]

Thanks @dlebauer , I tried this on Chrome, this issue is present. Will try to debug locally and see if there are any quick fixes available. At first glance, it seems due to the way how iframe tag (the one which contains our documentation) is rendered below the header.

[eshantri]

Hey @dlebauer , I cloned this on my desktop and ran the website locally. This issue can be fixed easily (for which I'll raise a PR, need some time for testing on Safari and Firefox browser). My main concern is , that we're using a lot of npm packages which are outdated, should we raise a new issue for this? There's a bunch of errors I'm getting on my terminal (in the screenshot below). When the project was started we were using Docusaurus 2.0.1 (which is pretty old now, with present version being 3.4.0), is it time to plan about upgrading the website to the latest one?