Request
Support RTL on Wikipedia Preview
Description
Description
Related Objects
Related Objects
- Mentioned In
- T255429: Wikipedia Preview demo site
- Mentioned Here
- T252827: Support RTL for UI language
Event Timeline
Comment Actions
I looked at https://wikimedia.github.io/wikipedia-preview/articles/hebrew.html
Mostly it's OK.
The main problem I see is the footer, which is not RTL. The content is correctly RTL: <div class="container" dir="rtl">. But the footer doesn't have RTL direction. Add dir="rtl" to <div class="footer">, <html>, or <body>.
Some other comments:
- I'd love to see it in English and compare the placement of elements.
- The title is not localized, but written in English: "Wikipedia". It's OK for the early testing stage, but should be localized before releasing and tested again.
- It's probably not so much about RTL, but about localization in general: the ⓘ icon after the links is OK in Hebrew, but may be problematic in some other languages that treat spaces differently. In particular, I recommend testing these:
- German and Dutch: It's quite frequent in these two languages, and perhaps in others, that the link ends in the middle of the word. For example, in the German Wikipedia article Vereinigte Staaten, there is this sentence: "Ein besonderer Aspekt bei manchen kleineren Städten, der selten und überwiegend in den Neuenglandstaaten vorkommt...". Only the string "Neuengland" is linked in the long word Neuenglandstaaten. In MediaWiki's wiki syntax, it is achieved by using <nowiki /> (I couldn't find how to do the same in Phabricator markup, but it's not that important). I suspect that the ⓘ icon will be inserted in the middle of the word, and this may look not so nice.
- Japanese, Chinese, Burmese, Thai, Khmer, Lao: These languages use punctuation and spaces completely different from European languages, and this may affect how links are used, too. Each of these languages does it differently, so it would be great if someone could check each of them (and also languages that use the same writing systems: Cantonese, Shan, Mon, etc.). It's possible that it's fine to use the ⓘ icon there like that, but it should be checked.
Comment Actions
The task referenced above is for the KaiOS app...
Bringing back to dev to address
- alignment of the loading gif
Comment Actions
The footer content is in English with a little bit of Hebrew where it links to the article that was used. Wouldn't dir="rtl" break it?
Some other comments:
- I'd love to see it in English and compare the placement of elements.
The first article in the demo site is in English: https://wikimedia.github.io/wikipedia-preview/articles/english.html
- The title is not localized, but written in English: "Wikipedia". It's OK for the early testing stage, but should be localized before releasing and tested again.
There's another PR for the localization of the wordmark: https://github.com/wikimedia/wikipedia-preview/pull/36
It should be merged soon so you'll be able to see it on the demo site.
- It's probably not so much about RTL, but about localization in general: the ⓘ icon after the links is OK in Hebrew, but may be problematic in some other languages that treat spaces differently.
The (i) icon is not inserted by software but by content editors. Not Wikipedia editors but editors of the third party websites integrating with the Wikipedia Preview component. They decide what word(s) have the preview enabled, which article it links to, and they can use the provided style with the (i) but they don't have to.
How could we proceed to check if this is flexible enough for all the languages you mentioned?
Comment Actions
the loading gif appears on the right side instead of being centered
It looks centered to me now on master. Let me know if that's what you see as well.
The animation itself goes from left to right so it probably needs to be flipped but I'll wait for the "loading state follow-up PR" (https://github.com/wikimedia/wikipedia-preview/pull/41) to be finished to avoid code conflicts.