Top of the sidebar gets hidden on small windows when scrolling

[AlenkaF]

We have noticed that the top part of the primary and secondary sidebar menu gets hidden on small windows in case of the double header height.
When the header/navbar is not doubled in height, that doesn't happen.

Also the layout of the header elements in this case looks a bit random (version switcher, search box, icons, etc.).

I am sure this is not a trivial thing, but I still think it is worth checking.

Examples:

Beginning

After scrolling just a bit:

Arrow example

[12rambau]

the new search button is a lot wider and is breaking the display of the header navbar in lots of cases. It's on our radar but complicated. Any design idea is welcome !

[AlenkaF]

Ah, I see!
Is it only the search button or the version switcher also?

I am brainstorming here (not knowing the code really, so this might be silly):
Is it possible to move the buttons to the top of the sidebar if/when the space is too little?

[12rambau]

both of them are free components so you can place them wherever you see fit.
On the other hand it's complicated to move them dynamically.

They are currently placed in the header navbar as this is the only one that is always available even on landing page (see #1092 to understand how this can become an issue)

[AlenkaF]

Huh, that's a bummer. I will brainstorm with Joris, in case he has any ideas!

[jorisvandenbossche]

While it would certainly be good to improve the layout so it happens less often that the items in the header get wrapped around causing the navbar of double height, but just to be clear: the actual root issue here is still a separate bug report. When it happens that the header is larger, it shouldn't cover the sidebar, I think?