RangeControl: Fix style issue in RTL (#35777)

* Fixes #34855 RangeControl style issue in RTL * addjest the dot offset so it lines up with tool tip * swapped to using translateX for the adjustment
WordPress · Oct 25, 2021 · 2bb4e77 · 2bb4e77
1 parent 19da62a
commit 2bb4e77
Showing 1 changed file with 4 additions and 1 deletion.
diff --git a/packages/components/src/range-control/styles/range-control-styles.js b/packages/components/src/range-control/styles/range-control-styles.js
@@ -189,10 +189,13 @@ export const ThumbWrapper = styled.span`
 	user-select: none;
 	width: ${ thumbSize }px;
 	border-radius: 50%;
-	transform: translateX( 4.5px );
 
 	${ thumbColor };
 	${ rtl( { marginLeft: -10 } ) };
+	${ rtl(
+		{ transform: 'translateX( 4.5px )' },
+		{ transform: 'translateX( -4.5px )' }
+	) };
 `;
 
 const thumbFocus = ( { isFocused } ) => {