Styling header

[WouterBos]

@berthubert Hi! I played a bit with the main navigation this evening. I could play a bit more with it but first I wanted to check if you find this valuable.

[berthubert]

Thanks for the work - I'm not entirely sure if this is a strict improvement. That the menu stays put a the top of the screen is not clearly a winner. Also, the photo on the persoon.html is now centered, is that intended? Some other things now also no longer seem centered. I've also not yet evaluated what this looks like on mobile, which is a big fraction of our users. So I'm not sure yet, but it does look better at least in some ways already!

[WouterBos]

Also, the photo on the persoon.html is now centered, is that intended?

I guess you mean not centered, as it's already centered. But no, that is not intended. For this first draft I focused on the menu. Everything in the customheader that contains stuff like the form field, will be addressed in the final PR.

I've also not yet evaluated what this looks like on mobile

This first draft only focused on the menu in desktop. After some time playing with it, I reckoned that it was better to check if my work has a chance to be accepted before I spend the whole afternoon coding. So mobile and darkmode are not addressed but will be in the final Pull Request.

That the menu stays put a the top of the screen is not clearly a winner.

In the final Pull Request, the menu will only be sticky if the viewport is high enough, something like >900px. The advantage of heaving a sticky menu on desktop is that navigation is a visual "anchor" and readily available without scrolling.

[...] on mobile, which is a big fraction of our users.

After I'm done with the header, I might take a look at the tables to see if I can make them a bit more responsive for small screens.

With that being said, let me know if I can continue in this direction or not. It was just 2 hours of work so I'm yet not too attached to this code change.