[BUG] Arrows directions in RTL (Right to Left)
Opened this issue · 5 comments
Describe the bug
Arrows used for navigation are always pointing to the same direction as LTR, regardless of the UI direction (LTR or RTL). This can be confusing for users navigating the UI in RTL mode, where the expectation is for the arrows to point to the different direction.
Steps To Reproduce
- Set the UI direction to RTL (Right-to-Left) in your Refinejs project.
- Navigate to any page containing one or more arrows used for navigation
- Observe that the arrows are all pointing to the same direction as LTR.
Expected behavior
In RTL mode, the arrows used for navigation should be flipped so that they point to the opposite direction. This would be consistent with the user's expectation when navigating a right-to-left UI.
Packages
{
"dependencies": {
"@refinedev/antd": "^5.38.1",
"@refinedev/cli": "^2.16.31",
"@refinedev/core": "^4.49.2",
"@refinedev/react-router-v6": "^4.5.9",
"@refinedev/simple-rest": "^5.0.6",
"@uiw/react-md-editor": "^3.19.5",
"antd": "5.16.5",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-router-dom": "^6.8.1"
},
"devDependencies": {
"@types/node": "^18.16.2",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@vitejs/plugin-react": "^4.2.1",
"typescript": "^5.4.2",
"vite": "^5.1.6"
}
}Additional Context
No response
Can I take a look at it?
And if possible can you provide the files in the codebase I can look at to understand this problem better?
@ShatilKhan You just need to run the rtl example provided at
https://github.com/refinedev/refine/tree/master/examples/customization-rtl
npm create refine-app@latest -- --example customization-rtl
@alicanerdurmaz Can you please assign this issue to me, I think I can fix it!!