New positions added to drop down panel positions.

[magda-chrzescian]

Suggested merge commit message (convention)

Bug (ui): The dropdown should always take an accurate position to be fully visible. Closes #7700. Closes #8669.

[oleq]

The solution is correct. Although to see the results we need to wait for #8669 to resolve.

We could also try defining more south positions like the BalloonPanelView to give the algorithm more choices. But maybe let's see how #8669 turns out first.

[magda-chrzescian]

I added 4 additional positions, so the "step" in positioning is now 25% of the view width. I also set drop-down max-width to 75vw so all of the potential cases should be fully covered.

I think that a test checking if the positions of rendered panels are equal to these calculated would be useful.

I'd like to resolve #8669 also in this PR to have a full preview before merging.

[magda-chrzescian]

FYI @oleq I specified this selector because it affected the size of dropdowns nested in the toolbar dropdown (it was messing up with the sizes of the panels).

[oleq]

Take-aways from yesterday's call:

• Let's prioritize (S|N)W and (S|N)E positions to avoid using intermediate ones when there's no such need, for instance here:
  
• Let's handle Special characters grid exceeds drop-down size on small screen. #8669 in the same PR. Although not exactly the same issue, these are related, and handling them both will certainly help me verify whether everything works as expected.