Page MenuHomePhabricator

List of languages looks strange when mixes RTL and LTR languages
Closed, ResolvedPublic3 Estimated Story Points


Copying from Amir:
Items in the language list are in a mix of RTL and LTR languages.
This makes the list somewhat strangely aligned.
Centering it makes sense - that's how language lists are shown on
an iPhone, for example.

Version: unspecified
Severity: normal

Acceptance criteria

  • A dir attribute needs to be added to each language item.
  • Left align LTR languages
  • RIght align RTL languages
  • Currently the API does not support this but we can use an array to determine RTL given the number of RTL languages that exist. We'll use a frontend library and submit a patch in parallel to get this into core. See ongoing conversation in, T189036 and associated patchsets.

Languages that can be considered RTL are:

# array needs lowercasing

All other languages should be considered ltr.


Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

bingle-admin wrote:

Prioritization and scheduling of this bug is tracked on Trello card

jgonera wrote:

What are the steps or platform required to see this? A screenshot perhaps?

Created attachment 15462
Arabic a RTL language, shown 2 from bottom is written in LTR


Screen_Shot_2014-05-23_at_3.33.39_PM.png (438×1 px, 30 KB)

Let's just add a direction attribute to each individual language in the overlay? It would also allow us to categorise languages in the overlay by RTL/LTR which would be a neat feature...

Amir it seems the API doesn't return the direction of a language. Do you know if it is possible with a query like:


Jdlrobson changed the task status from Open to Stalled.Dec 11 2014, 9:12 PM

Blocked on T78334

Another imaginable possibility is to resolve it through . It also makes more sense because it's about languages and not sites.

Amire80 triaged this task as Medium priority.Jan 23 2015, 4:39 AM
Amire80 added a project: I18n.

Centering it makes sense - that's how language lists are shown on an iPhone, for example.

are we talking about center align? languages are not shown that way on iPhone. plus it doesn't make sense to center align list items. the scannability is a huge issue for center aligned lists and that's why no one uses it

here's a screen from iPhone.

IMG_0248.PNG (1×750 px, 81 KB)

there are two solutions here

  1. Use only LTR, so show RTL languages in LTR like iOS does
  1. Use the current language as base language and translate all other language names into that language. so for example. if you current project language is Hebrew, and you are switching languages, the whole language list will use Hebrew script and will be RTL. that way it's even easier for a Hebrew speaking person to read all other language names.

@Nirzar @dr0ptp4kt what is the status here? porting it over from old language switching epic: T121919 to new one: T137932

@JKatzWMF i think the amount of work needs to be done for option 2 above is a lot. We can estimate it but my feelings it's a whole project on its own. I think we should go with option 1 unless there are any strong objections. also this shouldn't be a blocker in my opinion since the title says "looks strange"

@Nirzar works for me. If @dr0ptp4kt agrees, let's remove as a blocker.

I agree - option 1 - be consistent.

OR option 0 - don't introduce extra scope. Presently, the mobile language switcher uses the directionality of the wiki, meaning: if the wiki language is LTR the list is left aligned and if it's RTL it's right aligned.

Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)
Jdlrobson added a subscriber: Nirzar.

Our estimates ranged from 2-5. It seems like more clarity on T74153 would be helpful. I'll do that.

Change 419812 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/extensions/MobileFrontend@master] Right align RTL languages in language list

It works!

Screen Shot 2018-03-15 at 11.17.05 AM.png (349×397 px, 21 KB)

I will continue working on the parent tasks to render the JS array unnecessary but we can push ahead and review this.

Change 419812 merged by jenkins-bot:
[mediawiki/extensions/MobileFrontend@master] Right align RTL languages in language list

Jdlrobson updated the task description. (Show Details)
Jdlrobson added a subscriber: ABorbaWMF.

I've updated staging to include this patch:

 ssh reading-web-staging-3.eqiad.wmflabs
sudo su mwvagrant
cd /srv/mediawiki-vagrant/mediawiki/extensions/MobileFrontend/
git fetch
git checkout origin/master

@ABorbaWMF I've added instructions for how to test!

Macro votecat: looks good

as per the screenshot.