Removal of the dreaded Beak

[gpeuc]

Our various little popups currently have a little triangle beak which is attempting to point into the object that opened it. Like this:

The main challenge with those was to try and align the beak with the object. In some cases due to various mathematical problems this was impossible. We had scenarios where top element (a chevron) is aligned to point between the pixels, and the beak was actually on half a pixel, and this caused them to look misaligned and messy.

Essentially due to the way various UI frameworks handle rotation, positioning, how they calculate the distances and width, we would end up in this situation too many times:

We have had too much time spent by our developers trying to align two objects, and just when they think they succeeded something breaks the alignment. For example, some users run their screens and VS Code / Browser at 120% zoom at all time due to accessibility needs. This +20% zoom causes all those mentioned UI frameworks to try and recalculate the position again, and something that was nicely positioned at 100% suddenly breaks at 120%.

Therefore, this is a dragon 🐉 that we keep chasing but we cannot catch. It's just easier for everyone to simply remove the beak.

---

All of the designs still look good, and I do not believe users will be confused without the beak. It's clear which element is the parent element of the popup, what exactly opened it.

---

The beak on large mega-tooltips should stay. That one is OK.

---

@815are

@vadson71