Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add an arrow icon for handling the UI of RTL #19962

Merged
merged 3 commits into from
Jan 19, 2024

Conversation

jarvislin
Copy link
Contributor

@jarvislin jarvislin commented Jan 17, 2024

Fixes #18807


We have two arrow icons, → and ←. We only handle RTL for the ← icon, which causes the two arrows are in the same direction when the device is using the RTL language.

This PR contains a new arrow under the ldrtl directory for handling RTL.

To Test:

  1. Install JP and sign in.
  2. Click Reader at the bottom tab.
  3. Find a post and click it.
  4. Click the three dot icon at the top-right corner.
  5. Click Visit site
  6. Change the locale on your device to a RTL language, e.g. Arabic.
  7. Back to the app.
  8. The arrow icons should be displayed correctly.
Before the fix After the fix
255023331-de8735ba-798c-44f7-96bd-99f00324caa3 Screenshot_٢٠٢٤٠١١٧-١٤٣٢٠٠

Regression Notes

  1. Potential unintended areas of impact

    • None
  2. What I did to test those areas of impact (or what existing automated tests I relied on)

    • Manual
  3. What automated tests I added (or what prevented me from doing so)

    • None

PR Submission Checklist:

  • I have completed the Regression Notes.
  • I have considered adding accessibility improvements for my changes.
  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

UI Changes Testing Checklist:

  • Portrait and landscape orientations.
  • Light and dark modes.
  • Fonts: Larger, smaller and bold text.
  • High contrast.
  • Talkback.
  • Languages with large words or with letters/accents not frequently used in English.
  • Right-to-left languages. (Even if translation isn’t complete, formatting should still respect the right-to-left layout)
  • Large and small screen sizes. (Tablet and smaller phones)
  • Multi-tasking: Split screen and Pop-up view. (Android 10 or higher)

@wpmobilebot
Copy link
Contributor

wpmobilebot commented Jan 17, 2024

WordPress📲 You can test the changes from this Pull Request in WordPress by scanning the QR code below to install the corresponding build.
App NameWordPress WordPress
FlavorJalapeno
Build TypeDebug
Versionpr19962-94e31de
Commit94e31de
Direct Downloadwordpress-prototype-build-pr19962-94e31de.apk
Note: Google Login is not supported on these builds.

@wpmobilebot
Copy link
Contributor

wpmobilebot commented Jan 17, 2024

Jetpack📲 You can test the changes from this Pull Request in Jetpack by scanning the QR code below to install the corresponding build.
App NameJetpack Jetpack
FlavorJalapeno
Build TypeDebug
Versionpr19962-94e31de
Commit94e31de
Direct Downloadjetpack-prototype-build-pr19962-94e31de.apk
Note: Google Login is not supported on these builds.

@antonis antonis self-requested a review January 18, 2024 06:30
Copy link
Contributor

@antonis antonis left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for fixing this @jarvislin 🙇
The added resource looks good and the app behaved as expected when testing it on a Pixel 5 (Android 14) 🎉

LTR RTL
Screenshot_20240118_105951 Screenshot_20240118_110038

@peril-wordpress-mobile
Copy link

Warnings
⚠️ This PR is assigned to a milestone which is closing in less than 4 days Please, make sure to get it merged by then or assign it to a later expiring milestone

Generated by 🚫 dangerJS

@dangermattic
Copy link
Collaborator

1 Warning
⚠️ This PR is assigned to the milestone 24.1. This milestone is due in less than 4 days.
Please make sure to get it merged by then or assign it to a milestone with a later deadline.

Generated by 🚫 Danger

@jarvislin
Copy link
Contributor Author

@antonis Thanks for the review 👍

@jarvislin jarvislin enabled auto-merge January 19, 2024 01:29
@jarvislin jarvislin merged commit e450383 into trunk Jan 19, 2024
19 of 20 checks passed
@jarvislin jarvislin deleted the issue/19097-worng-navigation-button-when-using-rtl branch January 19, 2024 01:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Navigation buttons point to the same side when viewing a post in the web for RTL languages.
4 participants