[FEATURE REQUEST] Improve UI design for pattern screen

[fesave]

The passcode screen is a bit outdated in UI terms, so it would be great to perform a design improvement on it. Some mockups will be created so that we can compare among the current design and several proposals.

TASKS

• Research (if needed)
• Create branch feature/improve_pattern_screen
• Development tasks
  • Add a back arrow to cancel in the toolbar
  • Align the design with the new passcode's design
• Code review and apply changes requested
• Design test plan
• QA
• Merge branch feature/feature_name into master

PR

• App
• Library (if needed)

[davcres]

Hello @tbsbdr.
We are redesigning the pattern screen, and we want to ask you which option is better for tablets.

Old design	First option	Second option

The first option is very similar to the old one but the second one leaves more space between the text and the pattern.
Maybe a third option could be join the text with the pattern of the second option.

Thank you.

[tbsbdr]

I would prefer the first option, because "Place Related Elements near Each Other" (https://www.nngroup.com/articles/gestalt-proximity/) and the whitespace around looks to me more noble 👑

I also support to remove "Cancel" as the primary action in this screen because it is obviously not the primary action here ;-)