Wonderland-Money / wonderland-frontend

MIT License
229 stars 295 forks source link

Add trader joe links / dropdown on mobile #11

Open xzilja opened 2 years ago

xzilja commented 2 years ago

Is your feature request related to a problem? Please describe. Dropdown that links to trader joe swap for TIME / MEMO tokens is missing on mobile.

Describe the solution you'd like. Include clear acceptance criteria. Perhaps add it somewhere in that main hamburger menu?

Is any UX Design input needed?

Describe alternatives you've considered

Tech Notes/Testing Notes

Out of scope

Additional context

nebuk4d commented 2 years ago

Hey @IljaDaderko 🙋🏻‍♂️ , the link should be there if you click on the time button right next to the hamburger menu. IMG_1120

xzilja commented 2 years ago

Hey, yep it is on desktop, this issue is solely for mobile, as that time button doesn't appear. The only difference I see in our screenshots is that I am connected and you are not, perhaps that could be the issue?

This is on iOS / Metamask browser IMG_0083

nebuk4d commented 2 years ago

hm yeah weird. I also tested now on iOS and metamask browser and still it is there 🤔 Are u using iPad or iPhone? / Also how big is your screen size?

IMG_1123

nebuk4d commented 2 years ago

The button is not printed on smaller screens. (width 400px) That could be the reason.

See: https://github.com/Wonderland-Money/wonderland-frontend/blob/master/src/components/Header/index.tsx#L55

xzilja commented 2 years ago

That's probably it, do you reckon it should be printed when users are in a "connected" state perhaps? As screen real estate allows for it and I guess it makes sense to want to add the tokens once you connected

nebuk4d commented 2 years ago

Yeah I think it makes sense. I see that beginning with a width of 388px the buttons start to not fit properly. So till that value it might can be tweaked a bit otherwise the buttons need to be changed or we live with the newLine which I personalld don't like much. What iPhone do you have or better what screen size?

xzilja commented 2 years ago

Yo, sorry for late reply, I'm on iPhone 12 Pro, I believe its 375px width. Which would still not fit in this case. What about making that button an icon instead of "TIME" text? Like icon of a contract or something that would make sense for tokens and trader joe?

Also, if it is at least shown in "connected" state, that would help a lot. I understand that in disconnected state "Connect Wallet" button takes up a lot of space.

nebuk4d commented 2 years ago

https://github.com/Wonderland-Money/wonderland-frontend/pull/14

Maybe just decreasing the padding a bit, so that the range of devices supported grows, is more efficient right now, without changing to much of the design.