Uses same recovery code visuals on loa3#992
Conversation
**Why**: To present a consistent interface to the user
|
Let's change the header to match the other personal key page. We're adding a new page for success and handoff to an agency that covers completing the process. Thanks! |
| end | ||
| end | ||
|
|
||
| context 'with javascript enabled', js: true do |
There was a problem hiding this comment.
I thought our accordions didn't require JS, per @esgoodman. Is that something we're going to change later? By that, I mean that the user should be able to collapse and expand the accordion without JS.
There was a problem hiding this comment.
Something like this perhaps, which only uses CSS + HTML? https://codepen.io/abergin/pen/ihlDf
There was a problem hiding this comment.
I can do some digging, but I think it may be difficult to make an accordion that is CSS only, but also a11y friendly to screen readers and keyboards. I believe the USWDS accordion also relies on JS. I tested @el-mapache's implementation out which shows the information in it's expanded state for non-JS users which seems like a good fallback option.
| @@ -0,0 +1,44 @@ | |||
| shared_examples_for 'recovery code page' do | |||
There was a problem hiding this comment.
The name of this file does not need the .spec
| expect(page).to have_content(t('users.recovery_code.help_text')) | ||
| end | ||
| end | ||
| it_behaves_like 'recovery code page', @user |
There was a problem hiding this comment.
I don't think the @user argument is necessary here because it's not being passed in to the shared examples. By setting @user in the before block, the shared examples have access to it.
There was a problem hiding this comment.
It is, I forgot to remove it. Thanks for catching
monfresh
left a comment
monfresh
left a comment
There was a problem hiding this comment.
LGTM % the spec comments
**Why**: To keep consistency with our other recovery code management screen
* Uses same recovery code visuals on loa3 **Why**: To present a consistent interface to the user * Renames spec helper, fixes heading i18n refs **Why**: To keep consistency with our other recovery code management screen
* Uses same recovery code visuals on loa3 **Why**: To present a consistent interface to the user * Renames spec helper, fixes heading i18n refs **Why**: To keep consistency with our other recovery code management screen
4 participants
Why: To present a consistent interface to the user
Screenshots:
Before:
After:
@andrewhughey I left the header the same. If it should change to match the text on the loa1 sign up recovery code screen, let me know.