RTL Support
See original GitHub issueHello,
I needed to add RTL support for this plugin in a project where I use it.
I would like to send a PR that enables RTL support for it.
This works like this:
You either set a new config option rtl: true
or set a class on any ancestor. The option does that as well, sets a class.
The result is the flag is displayed on the right and phone number is right-aligned.
Let me know.
Issue Analytics
- State:
- Created 8 years ago
- Comments:7 (3 by maintainers)
Top Results From Across the Web
RTL Support in Web Applications - Scott Logic Blog
Typically in web applications supporting one of these languages, everything is reversed, meaning scroll bars, progress indicators, buttons etc.
Read more >RTL Support | Quasar Framework
RTL is tightly coupled to Quasar Language Packs. When Quasar is set to use an RTL language (language pack has “rtl” prop set...
Read more >RTL Support on Android. Here is all you need to know - Medium
To handle them, Android supports RTL layouts from API 17+ i.e., Android 4.2 (Jelly Bean) . Getting Started. In order to support RTL...
Read more >RTL Support - Chakra UI
Chakra UI provides built-in support right-to-left (RTL) languages like arabic and hebrew, out of the box.
Read more >RTL · Bootstrap v5.0
Learn how to enable support for right-to-left text in Bootstrap across our layout, components, and utilities.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I actually found a simpler, and arguably better solution.
Since a) the dropdown list is always in English (+ localized name), and b) phone numbers should be written Left to Right in all languages, then it actually makes sense to simply wrap the input control with
<div dir='ltr'>
. When this is done, all is good with the world again.I think if you just mention this in the README somewhere, most users who require RTL will be satisfied.
My slim code (on Rails), for reference:
And on that note, I want to say this plugin works flawlessly. I was worried it will mess up my CSS style, or look weird in most situations, but it looks very natural. Well done.
Thanks! Theoretically it would be good if the div that is created to wrap the input would have dir=‘ltr’