UI/UX: QR Code Scan with redirection stores; addition in the Download Button in new-design

[reach2saksham]

🎨 The UI/UX Update

This issue solves the problem of providing proper download functionality for QR scanning on Android and iOS, and of store redirection across Windows and MacBooks in the Resonate Landing Page's new design.

Current Design Issues

Problem:

Currently, in the new design, the Download Button redirects users to the desktop web version of the Play Store.

Expected Behaviour:

When the user clicks on the Download Button, they should get the option to the following things:

1. Option to scan a QR code in a mobile device to get redirected directly to the phone's store.
2. Option to choose between the device stores
3. Option to redirect to the required web version store from any desktop device. (For example: Someone owns a Windows laptop but has an iPhone, but they still want to check the App Store Desktop version on their Windows laptop)

Proposed Solution

Creating a Dialog box with proper UI/UX that accompanies all the required features and solves each problem.
The solution is shown in the screenshot below:

Design Considerations

• Accessibility
• Visual consistency
• User flow/navigation
• Responsive design
• Dark mode support
• Other

[nnadidan360]

Hello @reach2saksham , are you taking up this issue? Or do you mind if I take it up?

[reach2saksham]

Hello @reach2saksham , are you taking up this issue? Or do you mind if I take it up?

Hi @nnadidan360 , I would be taking up this issue!

[codewith-shivansh]

@reach2saksham have you done with this issue or may i take this one ?

[reach2saksham]

@reach2saksham have you done with this issue or may i take this one ?

I have done this one locally but haven't raised a PR to avoid any unnecessary merge conflicts since many of my PRs are pending.