Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Bug]: RTL Support Issues #770

Open
AmitMY opened this issue Jan 24, 2025 · 2 comments
Open

[Bug]: RTL Support Issues #770

AmitMY opened this issue Jan 24, 2025 · 2 comments
Labels
bug Something isn't working

Comments

@AmitMY
Copy link

AmitMY commented Jan 24, 2025

Expected Behavior

Before translating to Hebrew, wanted to check if RTL is supported.
It can be better supported.

Following #388

Current Behavior

small popover:

  • buttons are not correctly aligned, no space in between
  • terms & privacy (links) don't have space in between
Image

modal:

  • title has unnecessary right margin
  • buttons don't have space between
  • toggle is still on the right (should be left) - notice how for "GA" it is correct
  • "Service 1" should be "1 Service" still (in Hebrew you say "sherut 1" instead of "1 sherut")
  • Table headers should be aligned to the right
Image

Steps to reproduce

<html lang="he" dir="rtl"

Proposed fix or additional info.

This library works very well otherwise! Thanks a lot!

Version

3.0.1

On which browser do you see the issue?

Chrome
@AmitMY AmitMY added the bug Something isn't working label Jan 24, 2025
@github-actions github-actions bot added the triage yet to be reviewed label Jan 24, 2025
AmitMY added a commit to AmitMY/cookieconsent that referenced this issue Jan 24, 2025
@AmitMY
Partially address orestbida#770
0f70354
@AmitMY AmitMY mentioned this issue Jan 24, 2025
Open
@orestbida
Copy link
Owner

Did you try the rtl language list option?

@orestbida orestbida removed the triage yet to be reviewed label Jan 25, 2025
@AmitMY
Copy link
Author

AmitMY commented Jan 25, 2025

I did not! but, I think it doesn't matter. Specifically, my website supports many languages (110 to be specific, including English, and Hebrew)
My cookieconsent modal currently only supports English, until we perfect it, then it will go through human translation etc.

When someone watches my website in hebrew - you can try, right now - https://sign.mt/?lang=he - the website language is Hebrew, but the modal language is English.

The two options that make sense to me are:

  1. If rtl languages need to be speicifed, the modal itself should have a dir=ltr on it by default
  2. If rtl languages do not need to be specified (preferred case), browser supported solutions should be applied - Partially address #770 #771 - Then, there not needs to be a specific behavior for rtl and ltr, but the browser understands it.
    a. If someone similar to me, would have html.dir=rtl, but would want the modal in ltr, that's, in my honest opinion, is on them to address, by applying dir=ltr to the modal

If solution 1 is adopted, still, I would advocate for it being handled in CSS by native primitives.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@AmitMY @orestbida