Currently, the mechanism for resizing the panels is only a proof of concept. It needs to be *completely rewritten*, as doing it by-percentage is not smooth. The resizing needs to be completely smooth. (To be sure: the config internally needs to be stored as percentage of viewport, but to resize, some other math should be used.)

You should setup the project (if you haven’t already) to see the panels, a map on the left, some markers and stuff on the right. You need a few “locations” locally, I commonly use “earth”, “construct0” and “construct1”.

You can ask on stack overflow, how to do it. It’s probably best to figure out what pattern to use first, then do the implementation (because the pattern I used doesn’t work).

Do not worry about mobile for now. Do not worry about object-oriented design and structure of components for now.

Bonus: change the hamburger icon to the “resize” icon from Ionic or Material Icons:

Bonus: there would be 4 icons on the “border” (aka “handle”): resize, fold right, fold left, and reset which is exactly the middle. The icon for reset is digit “1”. So add another icon below left arrow, “1”, clicking which sets the panel sizes to 50/50%.