search

advanced-cropper / react-advanced-cropper

The react cropper library that embraces power of the advanced cropper core to give the possibility to create croppers that exactly suited for your website design
https://advanced-cropper.github.io/react-advanced-cropper/
Other
678 stars 34 forks source link

resize work reverse in rtl app #36

Closed soraya-mi closed 1 year ago

soraya-mi commented 1 year ago

Hi,

My app is RTL, so I have set the "dir" property of the "html" tag to "rtl". However, I'm facing an issue when trying to resize the cropper area by dragging its corners. The behavior seems to be reversed. When I drag the corners outward, the crop area becomes smaller, and when I drag them inward, it becomes larger.

I attempted to resolve this problem by changing the CSS direction property of the cropper container to "ltr," but it didn't solve the issue. Could you please advise me on what I should do to fix this problem?

Norserium commented 1 year ago

@soraya-mi, try to set the custom class for the cropper and add the following rule for it:

direction: ltr;
soraya-mi commented 1 year ago

I tried that, but it didn't work. The issue only gets resolved when I change the "dir" property of the HTML tag.

soraya-mi commented 1 year ago

the problem was the postcssRTl plugin which affects cropper behavior in rtl direction.

Norserium commented 1 year ago

@soraya-mi, all's well that ends well. Thank you for your information, it can be very useful to other users. Good luck!