Differential D15304
[Cashtab] Receive screen improvements Authored by bytesofman on Jan 26 2024, 23:54.
Details
QR code is an important part of any crypto wallet app. It's the only thing we want to see on the Receive screen and should take up most of the space. Users do not read the entire address string. So, only show a preview. Show the entire address in monospace blocks when it is copied. npm start, confirm the QR code can be scanned at widths > 500px and and 320px, confirm this looks better.
Diff Detail
Event TimelineComment Actions It's not autosizing on extension, resulting in extra swipes from the user to move the QR code into view. There's also not a great deal of room either with the header now fixed so the QR code should auto size on extension to render everything in the component.  In terms of mobile, d15304.netlify.app loads fine on android s21 chrome, but has the same clipping issue on iOS safari. Is there a way for the automated integration tests to simulate web vs mobile vs extension and validate the dimensions?
Comment Actions Dimensions now look all ok across mobile and extension, however it has scanning issues as per video below specific to the version on https://cashtab-local-dev.netlify.app.
I've also refreshed cashtab on mobile and reopened the QR code scanner and it's still not scanning. Tried both ios and android, chrome and safari mobile browsers. Comment Actions ok. this is probably related to increasing the size of the logo. Removed this for mobile-sized qr codes. Redeployed rebased version at https://cashtab-local-dev.netlify.app/ | ||||||||||||||