Improve status-bar overlapping

[simurai]

Problem:

The left and right sides of the status-bar can overlap when the window gets narrow.

This PR:

• adds a max-width to any .inline-blocks. Like when there is a huge branch name.

• prioritizes right side with 2/3 of the space
• left side with 1/3 -> will get cut-off first
• adds overflow scrolling

Fixes #48, #38 and maybe also #53.

Questions:

1. There was a flexbox hack added: b953bc3 Not sure if adding a flexbox inside has a negative effect
2. The .cursor-position ( e.g. 9/25 after the file path) gets cut off first, maybe it could be moved to the far left, before the file path?

[thomasjo]

👍

One little thought though, how about adding a tooltip to the text elements instead of scrolling? Scrolling stuff in a status bar feels a little bit weird. Otherwise, perhaps a "scrolling" animation on a 500 ms activation timeout or some such.

[simurai]

Adding a tooltip could be an option, it also got mentioned in #53.

Yeah, I agree that scrolling in the status bar is a bit odd, but it's more a measure of last resort. Because even with tooltips, there is still a chance of items getting cut off. So in emergency you can still scroll rather than not be able to see some items at all.

Another option would be to have some sort of "more" popup. Something like [Item Item Item ... ], then when clicking on "..." a popup appears with the rest. But maybe that's for another PR.

[thomasjo]

Another option would be to have some sort of "more" popup. Something like [Item Item Item ... ], then with clicking on "..." a popup appears with the rest. But maybe that's for another PR.

I think I like this concept. Best of both worlds in a sense. And I agree it might be best to experiment with that in a separate PR, since this PR improves the current state and looks good to me.

[benogle]

no?

[simurai]

Yep! Could still be improved, but at least looks less broken.