question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Hello,

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:closed
  • Created 8 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

4reactions
DannyBencommented, Jun 5, 2018

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:

.field.col.span-6
  = f.label :phone
  div dir='ltr'
    = f.telephone_field :phone, dir: 'ltr', class: 'align-left'

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.

0reactions
yehudahkaycommented, Sep 9, 2019

Thanks! Theoretically it would be good if the div that is created to wrap the input would have dir=‘ltr’

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found