UI Layout Broken for RTL Language After Latest Update

Bug
,
1

The image shows a Slack interface with thread categories, such as "My Threads," "General," and "DMS," and a dropdown menu labeled "Default." (Captioned by AI)
The image shows a Slack interface with thread categories, such as "My Threads," "General," and "DMS," and a dropdown menu labeled "Default." (Captioned by AI)462×337 9.66 KB

This image shows a discussion in Arabic between two users, with one asking about book designs and the other providing advice on using third-party software for designing book covers in Microsoft Word. (Captioned by AI)
This image shows a discussion in Arabic between two users, with one asking about book designs and the other providing advice on using third-party software for designing book covers in Microsoft Word. (Captioned by AI)1826×746 146 KB

The image is a screenshot of a digital chat platform featuring a conversation in Arabic language moderated by a user named "내말씨" (Chat Moderator) and includes instructions for helping prevent hoax information from spreading, as organized by "Staff" with various emojis and icons present. (Captioned by AI)
The image is a screenshot of a digital chat platform featuring a conversation in Arabic language moderated by a user named "내말씨" (Chat Moderator) and includes instructions for helping prevent hoax information from spreading, as organized by "Staff" with various emojis and icons present. (Captioned by AI)1826×746 63.3 KB

I am experiencing a critical UI layout issue with my Discourse instance after updating to the latest version today.

When the user interface language is set to Persian (RTL), the entire layout appears broken and scrambled. Various UI components are overlapping, misaligned, and generally rendered incorrectly. I have attached a screenshot to illustrate the problem clearly.

However, when I switch the user interface language to English, the layout renders perfectly with no issues whatsoever. This strongly suggests the problem is specific to the Persian language localization or its interaction with the updated Discourse core.

I have already attempted basic troubleshooting steps such as clearing browser cache and testing on different browsers, but the issue persists consistently when Persian is selected.

Could you please investigate this matter?
Thank you."

3 Likes
4

To provide further clarity on the issue, I have annotated the attached screenshot. You can observe these issues firsthand at mobahasah.ir.

As illustrated, when the interface language is set to Persian (RTL), the DiscoTOC generated table of contents displays incorrectly, simultaneously showing both the table of contents and the timeline. Additionally, the Google Font component is non-functional.

Furthermore, applying different themes does not fully render; for instance, the main forum background color remains unchanged. All these issues are resolved by switching the user interface language to English.

The image shows a enlarged section of text from a source account in Arabic, overlaid with green highlighting and directional arrows. (Captioned by AI)
The image shows a enlarged section of text from a source account in Arabic, overlaid with green highlighting and directional arrows. (Captioned by AI)1826×746 73.1 KB

1 Like
7

Hey @serkhelesheyi

This issue should be resolved by FIX: Serve RTL CSS for themes and components (#32916) · discourse/discourse@1de8960 · GitHub. Could you update your site again and confirm the issue is fixed?

5 Likes
9

Yes, thank you very much for your efforts, Osama. The issues have been resolved.

4 Likes
10

This topic was automatically closed after 5 days. New replies are no longer allowed.