handle rtl styles

This commit is contained in:
2025-11-24 01:08:25 +03:00
parent 7e5a5e30a4
commit 23ce25f418

View File

@@ -52,7 +52,13 @@ export function RateBottomSheet() {
// Calculate which part of the star was clicked // Calculate which part of the star was clicked
// Divide star into 4 parts: 0-25% = 0.25, 25-50% = 0.5, 50-75% = 0.75, 75-100% = 1.0 // Divide star into 4 parts: 0-25% = 0.25, 25-50% = 0.5, 50-75% = 0.75, 75-100% = 1.0
const clickPercentage = clickX / starWidth; let clickPercentage = clickX / starWidth;
// In RTL mode, invert the click percentage since stars are displayed in reverse
if (isRTL) {
clickPercentage = 1 - clickPercentage;
}
let starValue = 0; let starValue = 0;
if (clickPercentage <= 0.25) { if (clickPercentage <= 0.25) {
@@ -179,7 +185,7 @@ export function RateBottomSheet() {
style={{ style={{
position: "absolute", position: "absolute",
top: 0, top: 0,
left: 0, ...(isRTL ? { right: 0 } : { left: 0 }),
width: `${fillPercentage}%`, width: `${fillPercentage}%`,
height: "100%", height: "100%",
overflow: "hidden", overflow: "hidden",
@@ -194,7 +200,7 @@ export function RateBottomSheet() {
style={{ style={{
position: "absolute", position: "absolute",
top: 0, top: 0,
left: 0, ...(isRTL ? { right: 0 } : { left: 0 }),
width: 40, width: 40,
height: 40, height: 40,
}} }}