Settings Button UX Improvements

Opened a draft MR. Currently resolves:

> When expanded, it should be possible to click outside of the button to close the dropdown.

MR contains all of the listed fixes and is ready for review.

I've succesfully applied MR46. First a feedback about the points listed in the issue summary:

* When expanded, it should be possible to click outside of the button to close the dropdown.

that works as described but i wonder if would it make sense to close the dropdown also when the user clicks inside the preview area? at the moment it only closes when the dark title bar, the frame in slightly lighter dark or one of the other buttons is clicked.
and talking about closing the dropdown the usual pattern keyboard users are familiar with is pressing the ESC key. but that immediately closes the entire preview window. would it be possible and make sense when ESC key pressed and the dropdown is open the dropdown is closed while if the dropdown is closed and the ESC key is pressed the preview window is closed?
And there is also no aural feedback when the dropdown is showing or closed - a screenreader user is unaware if a dropdown is opened or closed (see keyboard_vo.mp4). that might be accomplished by introducing a toggle or switch button for the settings button?

* It should be possible to click on the checkbox to toggle an option in addition to clicking on the link.

That works as described in the issue summary the only problem i notice is if you navigate by the keyboard and you have the screenreader announcement active. that way you get two announcements per setting within the aural interface (see keyboard_vo.mp4) which is sort of redundant.

✅ The dropdown should not overlap other buttons.

✅ Dropdown links should show pointer on hover.

✅ Preview panel jumps slightly when view mode control is added or removed.

aside those points there are two more details to note. First the focus outline has a too low color contrast with 1.5:1 it should be at least 3:1.

and one detail about settings in general. those four settings overlap with the settings found on /admin/config/content/same-page-preview in one setting, the "open preview by default". but that surfaces one problem. it is not clear to me at all if the settings on the node are "individual" settings aka overrides on a per node basis or a mirror of the global overall settings (on a sidenote "open preview by default" is way more clear than "on by default" on the settings page)? i've unticked the "on by default" checkbox on /admin/config/content/same-page-preview while "open preview by default" is ticked on the node preview, when i open a node the preview window is opened automatically though. that is confusing, me as the user i always ask myself which of the two counts and is there a "hierarchy" or do the settings simply mirror themselve? having that kind of settings in two different places, with some only available on the node others only availble on the config page and some availble in both places, is simply confusing.