Comfy-Org / Comfy-Org/ComfyUI_frontend
Add RTL (Right-to-Left) support for Arabic interface
- Dominant language
- TypeScript
- Stars
- 2k
- Forks
- 699
- Avg merge
- 1d 7h
- Merged PRs (30d)
- 490
Description
## Description
PR #4916 successfully added Arabic translations to ComfyUI. However, Arabic is a right-to-left (RTL) language, and the current interface remains left-to-right, which creates an awkward reading experience for Arabic users.
## Current Status
Arabic translations are implemented and working, but the UI layout and text alignment remain optimized for LTR languages.
## Proposed Enhancement
Implement proper RTL support when Arabic is selected as the interface language. This would include:
- Dynamic RTL layout switching based on selected language
- Mirrored UI components (navigation, sidebars, button groups)
- Proper text alignment for RTL reading flow
- Adjusted positioning for dropdowns, tooltips, and context menus
- Special handling for the node editor canvas if needed
## Technical Considerations
Modern CSS approaches like logical properties (`margin-inline-start`, `padding-inline-end`) could be used to minimize the need for separate RTL stylesheets. Alternatively, PostCSS RTL plugins or dedicated RTL CSS could be implemented.
## Expected Outcome
When Arabic is selected, the entire interface should flip to provide a natural right-to-left reading and interaction experience, matching user expectations for Arabic interfaces.
## References
- Original translation PR: #4916
- [MDN: CSS Logical Properties](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties)
- [Material Design RTL Guidelines](https://m2.material.io/design/usability/bidirectionality.html)
┆Issue is synchronized with this [Notion page](https://www.notion.so/Issue-4937-Add-RTL-Right-to-Left-support-for-Arabic-interface-24d6d73d365081209421d057379921f5) by [Unito](https://www.unito.io)
Contributor guide
Assessment
This issue has not been assessed yet.