make it more obvious that 2F phone setup is a 2-step process

[Selene ToyKeeper]

I've had a few people try to set up 2F with their phone, and they fail to finish the process. They scan the QR code, poke the phone app, see a number, and think they're done. SSO should make it more clear that they need to enter the code into SSO and submit the form.

[Selene ToyKeeper (toykeeper)]

> > - The 2F phone setup is still a little confusing to people;
> > they add the config to the phone and don't realize they
> > still have to finish the setup in SSO.
>
> Suggestions on what we can do to improve this? (besides
> switching to TOTP -- and loosing support for yubikeys)

I think it just needs a bit of change to the page markup. One
suggestion I received was to use big header text above each part
to emphasize that there is both a Step 1 (phone setup) and a Step
2 (test the device in SSO).

It could also be helpful to rearrange the flow a bit to eliminate
the need to scroll (on small screens) to see the second step.
Like, perhaps put the QR code to the right of its instruction
text instead of vertically between paragraphs. This would bring
the text for Step 2 up higher.

Or, along those lines, we could use two panels with Step 1 on the
left and Step 2 on the right, at the same vertical level, using a
table or divs+CSS or whatnot. There's plenty of horizontal space
for it.

Similar changes could perhaps be applied to the setup pages for
Yubikeys too, since its second step is almost off the bottom of
the screen on a 1280x800 device.