As I wrote in my last post, I’ve been working on Mozilla input. After the first 2 weeks of my work, I ended up finishing almost all of the easy bugs on the project. On Monday, I decided to tackle one of the more challenging bugg, bug 614535. The situation in Input is interesting because we often show LTR text in RTL localized pages. This bug was about problems with that.
My solution to the problem was to use the locale that’s associated with each ‘opinion’ and mark the text and the name of the locale itself with the correct direction. I had sat down thought about this earlier and also brainstormed with a friend. Our conclusion was to have a list in the settings that would be a list of locales that are Right to Left. I discussed this solution in #webdev, and Fred Wenzel told me there already is such a list (Doh! I should have checked). With the general agreement that my solution did make sense, I started to implement it.
The above picture is a screenshot of input searches before the fix. Some of the opinions have punctuations slightly messed up. And the locale, English (US), isn’t displayed properly. Fixing the opinions was easy, I created a new class with property ‘direction: ltr’ and applied that class if the locale of the message was not it the RTL_LANGUAGES array. Fixing the locale name was slightly more challenging because its an item in <ul> list. Simply adding a class to the <li> made the bullet point to also switch. This, may be technically correct (because that’s where you’d expect the bullet point in an LTR text), but it wasn’t an elegant or good-looking solution. I tried to put a span around the locale name, that didn’t work either. Eventually, with help from #webdev, I went with the Unicode left-to-right mark.
I still can’t say nailed it, my pull request is pending review.
Leave a Reply