Improve UX: Save notification covers the buttons

[jkufner]

Describe the enhancement

When I save a YAML configuration of a device, a notification appears and covers the Install and Save buttons. Then I need to close the notification or wait until it disappears before I can click the covered Install button.

Possible solution: Move the notification above the bar with the buttons (like 4em up).

(I know, it is a little silly thing, but it is very annoying.)

Use cases

Improved user experience.

Visual examples

Notification moved just a few pixels up:

Anything else?

No response

[nagyrobi]

This was moved to the left of the screen earlier, but someone reverted it...

[bharvey88]

I also agree the current UX is not user friendly. We all have muscle memory and expect to be able to click save then install and this prevents that from happening. When I started making wiki articles showing how to change and update devices I ran in to this limitation.

At the very least it would be nice to be able to disable popups if we are unwilling/unable to move them again.

Continued from esphome/device-builder#2504 and esphome/esphome#18371

Note that this was intentionally changed in esphome/device-builder-frontend#1366. If there is enough interest, we can revisit the decision.

[masterofnonemx]

Keep it at the bottom-right, just move the popup above the row of buttons and possibly discard it with button click/action

[mrbubble62]

Annoying as is. please move it.

[bdraco]

additional duplicate esphome/device-builder-frontend#1675

[bdraco]

esphome/device-builder-frontend#1681

[bharvey88]

Thanks!