Skip to content

Commit

Permalink
fix: manually make the search bar be LTR even if in RTL
Browse files Browse the repository at this point in the history
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
  • Loading branch information
weareoutman committed Jun 20, 2024
1 parent 7f58aa2 commit a5c7184
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -250,6 +250,26 @@ html[data-theme="dark"] .noResultsIcon {
}
}

/* Manually make the search bar be LTR even if in RTL */
html[dir="rtl"] .searchHintContainer {
right: auto;
left: 10px;
}

html[dir="rtl"] .searchBarContainer .searchClearButton {
right: auto;
left: 0.8rem;
}

html[dir="rtl"] .searchBarContainer .searchBarLoadingRing {
left: auto;
right: 10px;
}

html[dir="rtl"] :global(.navbar__search-input) {
padding: 0 2.25em 0 0.5em;
}

/* For autocomplete.js only. */
.input {
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -425,6 +425,8 @@ export default function SearchBar({
[styles.focused]: focused,
})}
hidden={hidden}
// Manually make the search bar be LTR even if in RTL
dir="ltr"
>
<input
placeholder={translate({
Expand Down

0 comments on commit a5c7184

Please sign in to comment.