Automattic
Login: only first 2FA button is styled correctly
Quick summary
In the 2FA login step on WordPress.com, only the first button shown has the correct styles. The second one that appears ("Continue with backup code") looks broken.
In desktop Safari:
Steps to reproduce
- Start at https://wordpress.com/log-in and login with an account that has 2FA enabled
- Check out the buttons on the following 2FA step (https://wordpress.com/log-in/push)
What you expected to happen
The buttons should be styled consistently.
What actually happened
The second button ("Continue with backup code") looks broken.
Impact
Some (< 50%)
Available workarounds?
No but the platform is still usable
Platform (Simple and/or Atomic)
No response
Logs or notes
No response
Unable to triage as I have a Security Key (not 2FA) but adding to the One Board for someone to pick up
This is how I see it on my end, but it looks like the one above also involves a WordPress app connected account.
I'm unable to replicate this anymore, however, @bluefuton if you see this again, please reopen the issue and ping me.
Hi @Robertght - still broken for me. Tested in both Firefox and Chrome.
This is at https://wordpress.com/log-in/push:
I'm using a non-a8c user account that must have been associated with the Jetpack mobile app somewhere along the way.
Let me know if I can help you reproduce it.
Reproduction steps: With a non-a8c account:
- Login to the Jetpack App
- Via Web, setup 2FA via TOTP app
- Ensure no Security keys or other auth things are set (No SMS, keys, etc)
- Logout on web
- Attempt login, duplicate issue.
I noticed that the button styles are targeted to :first-of-type:
This was introduced with #75414, looking at the screenshots there, that change appears to have been intended and valid.
The UI however has changed since then, and whilst I can't find the PR that changed it, it seems that relaxing this rule is relatively safe. PR incoming.
