amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-22 03:42:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(rtl): resolve RTL issues in Challenges component (#7942)

Browse Source
This commit is contained in:
Mohammad Reza Badri
2025-09-02 20:07:21 +03:30
committed by GitHub
parent 9ced8851e6
commit 04feec4582
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Icon/IconArrowSmall.tsx
View File

@@ -19,6 +19,7 @@ export const IconArrowSmall = memo<
const classes = cn(className, {
'rotate-180': displayDirection === 'left',
'rotate-180 rtl:rotate-0': displayDirection === 'start',
'rtl:rotate-180': displayDirection === 'end',
'rotate-90': displayDirection === 'down',
});
return (

4
src/components/MDX/Challenges/Navigation.tsx
View File

@@ -108,7 +108,7 @@ export function Navigation({
onClick={handleScrollLeft}
aria-label="Scroll left"
className={cn(
'bg-secondary-button dark:bg-secondary-button-dark h-8 px-2 rounded-l border-gray-20 border-r rtl:rotate-180',
'bg-secondary-button dark:bg-secondary-button-dark h-8 px-2 rounded-l rtl:rounded-r rtl:rounded-l-none border-gray-20 border-r rtl:border-l rtl:border-r-0',
{
'text-primary dark:text-primary-dark': canScrollLeft,
'text-gray-30': !canScrollLeft,
@@ -120,7 +120,7 @@ export function Navigation({
onClick={handleScrollRight}
aria-label="Scroll right"
className={cn(
'bg-secondary-button dark:bg-secondary-button-dark h-8 px-2 rounded-e rtl:rotate-180',
'bg-secondary-button dark:bg-secondary-button-dark h-8 px-2 rounded-e',
{
'text-primary dark:text-primary-dark': canScrollRight,
'text-gray-30': !canScrollRight,