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.

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

Issues with RTL languages #423

Closed
Orenico10 opened this issue Jun 17, 2024 · 7 comments · Fixed by #428
Closed

Issues with RTL languages #423

Orenico10 opened this issue Jun 17, 2024 · 7 comments · Fixed by #428
Labels
bug Something isn't working

Comments

@Orenico10
Copy link

I tried using your theme on docusaurus 3.4.0, I set the docs direction to be RTL but it seems to break how the searchbar looks, is it possible to manually fix it without breaking your theme?

@weareoutman
Copy link
Member

Can you share a link or screenshot?

@Orenico10
Copy link
Author

Can you share a link or screenshot?

I changed the docusaurus to be RTL and the search bar is doing this weird behavior once I hover over it
20240619_163050.jpg

This is the best screenshot I can get because I'm running it on an offline environment.

@weareoutman
Copy link
Member

What's the relevant docusaurus config or css styles like, that you implement RTL?

@weareoutman
Copy link
Member

OK, I reproduced the issue by setting:

i18n: {
  // ...
  localeConfigs: {
      en: {
        direction: "rtl",
      }
    }
}

@weareoutman weareoutman added the bug Something isn't working label Jun 20, 2024
@weareoutman
Copy link
Member

I'm not familiar with RTL languages, especially how to render a text input, is it ok to make the search bar appear the same as LTR?

image

@Orenico10
Copy link
Author

I'm not familiar with RTL languages, especially how to render a text input, is it ok to make the search bar appear the same as LTR?

image

When using RTL languages the search bar is usually mirrored (in comparison to LTR) so the magnifying glass is on the opposite side and the text is forced RTL so any css configurations will set the dir/direction to be rtl rather than ltr/auto, but since this project is for a search bar for docusaurus I suppose keeping it the same as LTR would be fine, as long as I don't get the weird behavior, for now I'm running a script on my website that forces the input's dir to be rtl when you hover over it (basically canceling whatever causes this glitch)

weareoutman added a commit that referenced this issue Jun 20, 2024
closes #423

By default, setting RTL will break the search bar style, for now, just manually  make the search bar be LTR even if setting RTL
@weareoutman
Copy link
Member

Fixed in 0.44.2

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

Successfully merging a pull request may close this issue.

2 participants