Feature/floating action buttons

[matthiaslehnertum]

This pull request adds floating action buttons to Apollon to make editing and deleting elements more easily accessible.

Checklist

• I documented the TypeScript code using JSDoc style.
• I added multiple screenshots/screencasts of my UI changes
• I translated all the newly inserted strings into German and English

Motivation and Context

So far, editing elements was only available through rather unintuitive double clicks. Now, every element shows a set of floating action buttons when either selected or hovered.

Steps for Testing

Select any element on the canvas or hover it via your cursor. You should now see two floating action buttons, one for editing, one for deleting said element on the canvas.

Screenshots

[loreanvictor]

works as intended. a few small (non-blocking) notes:

• it is a bit inconsistent that relationships don't have the same feature, making them seem less editable in comparison. but I suspect its much harder to add the same feature for relationships and requires a separate PR.
• it would be nice if you could add coverage reports to the PR itself (the coverage looks good though)
• (this is personal preference 😅): I'd personally place the buttons a bit closer to the element and make animations faster, including the fade in but specifically the fade out animation. for repeated actions, I think the recommended duration is somewhere between 100-150ms.

[matthiaslehnertum]

@loreanvictor I will add the same implementation for relationships! Figuring out a sensible positioning algorithm is just a lot harder because simply positioning the buttons relative to the relationship's bounding box tends to lead to really strangely positioned buttons. 😅

I'll try to improve the animation speed and positioning real quick!