Inspect UI improvements proposal

[bolbat]

First problem/hack what can be improved is titles in server selector combobox.

Currently title for each element is concatenated from [name]@[host]:[port] and when result string is longer than width of sidebar - this string automatically wrapped but not in best way.

Hack solution for this is to use "space" character in configuration at the end of the "name" property.
This will help browser to wrap after name.
But when name or host name is long - this solution is not working.

In attached screenshots we can see example configuration and how it looks for us with this hack solution.

[bolbat]

Second problem with header bad markup when text on the middle is big or browser size is not too wide to handle all stuff in header in one line.

I purpose to set right min-width for page content container (can be used from some responsive standard). (@ssergiichuk already know all details about this standard sizes and how to work with them.)
And then make markup more agile to handle overflows in some way.

In attached screenshots we can see example of this problem.

[bolbat]

And third part is about server sector and quick connect improvement.

I purpose to move this sections somehow to header and combine with middle text where moskito show current interval, server information and connection information.

On second screenshot in first comment in this ticket we can see what i mean (check red arrows).

With this proposal we can have more wide server selector and reduce information duplication on the page (i'm about server selector + header connection information).

Also Quick Connect feature can be button joined with server selector combobox and show modal with required form fields. I think this will be useful because of rare usage of this feature (i think they usage is rare, or once per server, then we can select from general selector combobox).

From my point of view this improvement will make page more elegant and lightweight.

[ssergiichuk]

Second problem with header bad markup when text on the middle is big or browser size is not too wide to handle all stuff in header in one line.

FIxed (hidden on small browser size)
About min-width, i don't want to hide all responsive layout, but i set min-width 520px – it's for normal chart view on small browser size.

And third part is about server sector and quick connect improvement.

We have so many different elements on header, it's not so good for responsive, but I think of another place where all this information is well displayed

[bolbat]

We have so many different elements on header, it's not so good for responsive, but I think of another place where all this information is well displayed

I mean:

• replace in header text: current interval, server information and connection information
• to text with: current interval, server information + combobox with: server selector + button (joined to combobox) for modal with quick connect
• and remove server selector + quick connect from sidebar

But i know that you can provide a good solution for this improvement in this or other way.