Usability issues on Redocly-based site

XRPLF / xrpl-dev-portal

Source code for xrpl.org including developer documentation

https://xrpl.org

Other

526 stars 1.02k forks source link

Usability issues on Redocly-based site #2408

Open amarantha-k opened 7 months ago

amarantha-k commented 7 months ago

[x] Navigation to go back "home" in the header doesn't work.
[x] The homepage image container div ideally needs dimensions set as it causes a large layout shift (affecting core web vitals)
[ ] Issue with line at bottom on mobile. Screenshot here
[ ] When you expand a menu item on mobile, a flash of the background bleeds through. See https://www.loom.com/share/29d9ba62e78d4540a93a09ed645fa319
[x] Search bar icon color is not accessible/hard to see in light mode.
[ ] Clicking into search mode on mobile has no way to close out.
[ ] The page scrolls behind the open menu on mobile. If you scroll and then try to tap a menu item, it takes 2 taps.
[ ] Clicking a menu item on mobile often results in a delay on page change depending on network connection speed, even though the menu changes (this means the react code isn’t handling transitions properly in spa mode)
[ ] Language selector is not visible on mobile

tequdev commented 6 months ago

Navigation to go back "home" in the header doesn't work.

Some pages in Japanese will transition to https://xrpl.org/jaundefined.

https://xrpl.org/ja/resources/dev-tools/xrp-faucets/

mDuo13 commented 6 months ago

Navigation to go back "home" in the header doesn't work.

This seems to work for me (on desktop/Firefox). Was it fixed, or is there more context to where it doesn't work?

amarantha-k commented 6 months ago

Navigation to go back "home" in the header doesn't work.

This seems to work for me (on desktop/Firefox). Was it fixed, or is there more context to where it doesn't work?

This has been fixed and works now.

mDuo13 commented 3 months ago

Upon further investigation, there is a cancel button to close out of search on mobile. On my actual phone, it's below the bottom of the viewport unless you scroll down, and there's little to no indication that you can scroll.

For some reason, dev tools on both Chrome and Firefox don't show it accurately in the mobile preview, and it looks like the cancel button is visible in the normal place.

EDIT: I confirmed the issue was coming from Redocly's search component and was able to reproduce the issue on Redocly's own site. I have reported it upstream.

mDuo13 commented 3 months ago

The language selector being entirely disabled on mobile is also a Redocly issue, also reported upstream.

mDuo13 commented 3 months ago

The language selector and possible a couple other issues will be fixed with the next Redocly version update