Ensure highlighted menu items are within viewport on global nav
Currently the global nav behaves exactly like the left-side navigation of the GitLab product.
That is, highlighted items on the menu can leave the viewport. Put another way, the menu always refreshes to the top, so highlighted things be initially unseeable.
Docs are a little different to the product, in that a long list of items isn't necessary a problem. Au contraire, long list can help with discoverability. For example: https://docs.gitlab.com/ee/api/README.html.
Suggested implementation:
- If a highlighted menu item is naturally in the viewport, take no action. This link illustrates: https://docs.gitlab.com/ee/api/applications.html
- If a highlighted menu item is naturally out of the viewport, auto scroll so that it sit it at 1/3rd from the top of the menu. This link would be a candidate: https://docs.gitlab.com/ee/api/license.html.
- If a highlighted menu item is so far down the menu that it "can't reach" 1/3rd from the top, just scroll to the bottom. This link illustrates: https://docs.gitlab.com/ee/api/wikis.html.
If it was simpler, I guess always aim for 1/3rd from the top if the menu will "reach" that far. That is, it isn't so low as it can't.
The scrolling/highlighting behavior of the ToC is pretty great. I think the suggest implementation here mimics what happens there.