Skip to content

fix: use logical alignment classes for RTL support - #253

Merged
O2sa merged 1 commit into
O2sa:mainfrom
Xhenzouu:fix/rtl-logical-alignment
Oct 19, 2026
Merged

O2sa merged 1 commit into
O2sa:mainfrom
Xhenzouu:fix/rtl-logical-alignment

Conversation

@Xhenzouu

@Xhenzouu Xhenzouu commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

Fixes #252

Additionally, at the time of submission of this PR:

  • The referred issue is not blocked currently
  • All unittests passed after changes were made

Summary

Replaced hardcoded physical alignment classes with Tailwind logical equivalents so Arabic (RTL) mode mirrors correctly.

Root cause

text-left, text-right, -right-1 and sm:right-0 are physical: they always mean left or right and never flip when the page direction becomes RTL.

The fix

  • text-left / sm:text-left -> text-start / sm:text-start
  • text-right -> text-end
  • -right-1 / sm:right-0 -> -end-1 / sm:end-0

Logical classes follow the dir attribute, so LTR is unchanged and RTL mirrors. Files: language-switcher, country-grid-client, user-profile-client, result-dashboard, and the repo/PR/community card items (7 files, 9 lines).

Edge cases

  • English (LTR) layout is unchanged.
  • Left dir === "rtl" ? "left-0" : "right-0" in language-switcher.tsx as is, since it already handles direction explicitly.
  • skeletons.tsx has one more text-right that is not part of this issue, so it could be a follow-up.

How I tested

I wrote these changes by hand and tested them manually.

Copilot AI balanced review requested due to automatic review settings October 19, 2026 05:00
@vercel

vercel Bot commented Oct 19, 2026

Copy link
Copy Markdown

@Xhenzouu is attempting to deploy a commit to the osama's projects Team on Vercel.

A member of the Team first needs to authorize it.

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@github-actions

Copy link
Copy Markdown

Thank you for the pull request! ✅

A maintainer will review this soon. Please be patient while we take a look. 🙌

@O2sa
O2sa merged commit 6229134 into O2sa:main Oct 19, 2026
2 of 3 checks passed
@O2sa

O2sa commented Oct 19, 2026

Copy link
Copy Markdown
Owner

🎊 Welcome, @Xhenzouu! Your first contribution has been merged! 🚀

Thank you for helping improve the project! If you find this tool useful, please consider giving us a ⭐ star on GitHub—it helps more developers find our work and motivates us to keep improving!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: Physical alignment classes (text-left / text-right) break bidirectional RTL text in Arabic

3 participants