Thu 10 Mar 2011 06:32:27 PM UTC, original submission:
The interface looks awful with languages that are written from right to left and the website had enabled RTL with CSS or HTML tag attribute.
The main problem is caused by CSS rule:
text-indent: -3000px !important;
or similar.
One way to fix this issue, is to force the direction to LTR of the main div element of Linterna Mágica. Either trough HTML tag or CSS.
.linterna-magica {
direction: ltr !important;
}
This will break future translations for languages written in RTL.
A better fix is to set a direction property for each JavaScript language object with translated strings in src/lm_localisation.js. Then every parent HTML tag of translatable string, should have direction attribute/style. This will require a rewrite of all the calls to the _() function.
Third possible fix would be to set the direction CSS rule for every language. This requires rewrite of the localisation code. It needs to be split anyway. Languages should be exported as separate userscripts depending on Linterna Mágica.
The test in YouTube with RTL language showed that the time-line slider is moving from right to left as well with RTL. The calculations in JavaScript are made from left to right, so with RTL the knob moves not as expected.
A test with Totem and RTL locale showed that the movement for the time-line should be from right to left.
|