Security settings reorganization

[kra-mo]

Depends on nextcloud-libraries/nextcloud-vue#8436

Similar to #57008

Changes

In general, instead of using regular NcButtons, let's just use NcFromBoxButtons everywhere. Upon reflection, I found that there is no good semantic difference between these two, so eventually, it'd be nice to just merge them. See also nextcloud-libraries/nextcloud-vue#8082.

Beyond visuals, the following would change:

Password

Changing the password would use an input as described in nextcloud-libraries/nextcloud-vue#8436. I think this is actually a good example use case for it, since it would be two-step and it would dynamically change its label and icon.

would become

would become

and then the first one again.

Two-factor authentication

Regenerating backup codes should open the following dialog, instead of displaying them inline:

And setting up 2FA with an authenticator app should display this dialog:

WebAuthn

When adding a WebAuthn device to either 2FA or passwordless, it should ask for the device name using the same component as the password:

Apps and devices

"New app password" should open the following dialog:

And the current session should also have a menu with a single "Log out" item.

The menu for these items in general should be anchored to the ellipsis icon, even though the whole row should be clickable. I hope that is possible now?

Please let me know if I missed anything :)