Updated "Review & Confirm" Name Request Modal Design

[tlebedovich]

Updated the visual design for the modal. Needs @forgeuxGH5 to review first

• Use NR modal template
• Use Severin's Payment Details modal for how to style the Payment details
• update look of timer (and swapped Applicant info/contact order)
• update look of buttons
• update spacing between text elements
• match width of the modal to the design comp

Invision Design Comps: https://projects.invisionapp.com/share/VFZQYD9PUK3#/screens/440700710/comments?browse

[vysakh-menon-aot]

@tlebedovich @Kaineatthelab as per the design countdown circle style has been changed. This countdown is been used in other modal (reapply, upgrade). Should I update that as well?

[Kaineatthelab]

@vysakh-menon-aot we actually don't want to countdown to happen anymore in the UI or backend, can it be removed as part of this ticket? right @forgeuxGH5

[tlebedovich]

@vysakh-menon-aot I'm back from holidays and ready to review any design related tickets so I've added the UX Assurance tag to this one :)

[vysakh-menon-aot]

@tlebedovich @riyazuddinsyed countdown has been removed from the modal as part of this ticket

[tlebedovich]

UX Assurance Feedback for you thanks @vysakh-menon-aot:

See attached screenshot for mark ups (design comp on left, live modal on right):

• We want a avoid a scroll bar showing up for 768px high browser users but with the changes below it should fix it;
• Turn off the "Fees" subtotal line item and the "Tax" line item
• Change "Reg. Submission Online" to "Name Request Fee" (if this title isn't share with other apps)
• Change "Priority Fee" to "Priority Request Fee"
• Remove extra spacing between the line items
• widen the Cancel and Continue buttons a bit so the text has more breathing room on the sides of the button shape (text feels squished in)
• Adjust size of the 3 titles to 16px bold as marked (they are one size too big)
• Should be "Information" not "Info"
• Make sure "Payment Details" and all the line items align left with each other, no indenting

[tlebedovich]

Looks great @vysakh-menon-aot - think it can move on to QA, thanks!