RE: Re: RTL Guidelines

Itiel Yossefian <itiel_yn8-MwYPzc5+820+JF/[email protected]> Sat, 08 Feb 2020 20:19:03 +0200
Newsgroups gmane.comp.mozilla.firefox.devel,gmane.comp.mozilla.localization,gmane.comp.mozilla.localization
Message-ID <^[email protected]>
--===============3954407099129431831==
Content-Type: text/html; charset=UTF-8
Content-Transfer-Encoding: quoted-printable

<div><div dir=3D"rtl"><div dir=3D"ltr">
<div dir=3D"ltr">Jared, thanks for testing!</div>
<div dir=3D"ltr">&nbsp;</div>
<div dir=3D"ltr">It seems that `intl.l10n.pseudo` is a bit buggy atm (at le=
ast, for the sake of testing RTL), and most of your mentions are a non-issu=
e on a real RTL build or when testing with `intl.<wbr>uidirection`, so I'll=
 address your valid mentions only.</div>
<div dir=3D"ltr">I'll file bugs for fixing intl.l10n.pseudo.</div>
<div dir=3D"ltr">&nbsp;</div>
<div dir=3D"ltr">5. The icon does face the "right way" when testing with `i=
ntl.<wbr>uidirection`, but either way I don't think this matters for RTL. I=
 mean, the direction in which data comes wirelessly into a device can be fr=
om either direction...</div>
<div dir=3D"ltr">6. That's <a href=3D"https://bugzilla.mozilla.org/show_bug=
=2Ecgi?id=3D1529091">bug 1529091</a>. The MDN page meant to mirror the magn=
ifying glass icon only when it is <b>originally</b> rendered as if it being=
 held by someone left-handed (see it's linked icon). Across the Firefox LTR=
 UI, there is inconsistency with this icon. Some render it as left handed a=
nd others as right handed. I'm not sure how most of world actually hold a m=
agnifying glass, but I think this should be unified across the UI.</div>
<div dir=3D"ltr">But that's a topic for different discussion, I guess :)</d=
iv>
<div dir=3D"ltr">7. I think you're looking for <a href=3D"https://bugzilla=
=2Emozilla.org/show_bug.cgi?id=3D1539633">bug 1539633</a>.</div>
<div dir=3D"ltr">8. Huh, never thought of that, thanks. Will file a bug abo=
ut that. Now that you mention it, the same can be said about the Reader Vie=
w icon...</div>
<div dir=3D"ltr">9. Can you elaborate? Tested also with `intl.l10n.pseudo` =
and it seems to look fine. Was fixed in <a href=3D"https://bugzilla.mozilla=
=2Eorg/show_bug.cgi?id=3D1279230">bug 1279230</a> and <a href=3D"https://bu=
gzilla.mozilla.org/show_bug.cgi?id=3D1594833">bug 1594833</a>.</div>
<div dir=3D"ltr">10. See #5 for the "Send tab to device"; "Pin" looks fine =
when testing with `intl.<wbr>uidirection`. I'm not sure about the "Share" i=
con... It's not like you're sharing the tab to the left or to the right :)<=
/div>
<div dir=3D"ltr">14. Good question about the protections report icon. I thi=
nk it's fine as-is because the way it looks now, all the numbers can be in =
the positive section, while if you'll mirror the icon, they'll be in the ne=
gative-positive section. I don't think you can have negative numbers of tra=
ckers :)</div>
<div dir=3D"ltr">&nbsp;</div>
<div dir=3D"ltr">Thanks again!</div>
<div dir=3D"ltr">Itiel</div>
</div></div><section id=3D"end"></section><blockquote style=3D"margin:0;mar=
gin-bottom:20px;border-top:1px solid #e0e0e0;"><br>=D7=91 =D7=A4=D7=91=D7=
=A8=D7=B3 7, 2020 18:36, Jared Wein =D7=9B=D7=AA=D7=91:<blockquote style=3D=
"margin:0;margin-bottom:20px;border-top:1px solid #e0e0e0">
<div dir=3D"ltr"><div>I have taken a quick look through the Firefox UI and =
believe the following issues are present with RTL support (tested with=20
intl.l10n.pseudo=3Dbidi in about:config, then restarting):</div><div><br></=
div><div>1. The "Show Sidebars" icon in the navigation toolbar should be fl=
ipped in RTL.</div><div>2. The arrows for submenus in the menupopup for the=
 Library button in the navigation toolbar are facing the wrong way.</div><d=
iv>3. The arrows for submenus in the Firefox menu are facing the wrong way=
=2E</div><div>4. The "external link" icon for Firefox Monitor and Firefox S=
end, found within the Account submenu of the Firefox menu are facing the wr=
ong way.</div><div>5. The "send tab to device" icon in the Account submenu =
of the Firefox menu is facing the wrong way.</div><div>6. The magnifying gl=
ass in about:config is flipped when we normally wouldn't flip an icon that =
represents something from the physical world that is held by the majority o=
f people in their right hand. In the linked MDN page has this topic in the =
"what to mirror" section, though the sub-referenced "material design" page =
mentions this as something to "not to mirror".<br></div><div>7. The backgro=
und for the tracker doorhanger's expanded info section in the location bar =
should have the shield on the left side in RTL.</div><div>8. The "Print" ic=
on should be flipped since the paper coming out of the printer shows direct=
ional text.</div><div>9. The Pocket menu does not appear to have any RTL su=
pport.</div><div>10. The "Pin tab", "Send tab to device", and "share" icons=
 in the "..." menu of the location bar are facing the wrong way.</div><div>=
11. The "Go" arrow in the search box that appears after the user starts typ=
ing is facing the wrong way in RTL.</div><div></div><div>12. The "Last Page=
", "Next Page", "Previous Page", "First Page" icons in Print Preview are fa=
cing the wrong way in RTL.</div><div>13. The submenu arrows in the Site Inf=
ormation popup are facing the wrong way.<br></div><div><br></div><div>Icons=
 I'm not sure about:</div><div>1. The "protections report" icon shows a gra=
ph with the Y axis on the left side. Should this be flipped for RTL?</div><=
div><br></div><div>Many of these would make good-first-bugs for people to m=
entor. Can someone look through this list and let me know if I got any of t=
hem wrong?</div><div><br></div><div>Thanks,</div><div>Jared<br></div><div><=
br></div></div><br><div><div dir=3D"ltr">On Thu, Feb 6, 2020 at 7:04 PM Tim=
 Nguyen &lt;<a href=3D"mailto:[email protected]">[email protected]</a>&=
gt; wrote:<br></div><blockquote style=3D"margin:0px 0px 0px 0.8ex;border-le=
ft:1px solid rgb(204,204,204);padding-left:1ex"><div dir=3D"ltr"><div>Hello=
 folks,</div><div><br></div><div>There has been a significant number of RTL=
 bugs found in the last few months in the Firefox UI. From what I can gathe=
r, they were mostly due lack of awareness on specific situations that are m=
ore complex than just using CSS logical properties, but sometimes due to la=
ck of testing.<br></div><div><br></div><div>Itiel has made a great job at f=
iling+fixing many bugs and wrote up a guide based on his experience. This g=
uide describes in detail what things should be mirrored, text handling in R=
TL and tips on how to spot/fix/test RTL issues. It includes things I person=
ally didn't know about before, so I do encourage giving it a read:</div><di=
v><br></div><div><a href=3D"https://developer.mozilla.org/docs/Mozilla/Deve=
loper_guide/RTL_guidelines" target=3D"_blank">https://developer.mozilla.org=
/docs/Mozilla/Developer_guide/RTL_guidelines</a></div><div><br></div><div>W=
hen developing a new part of the UI or making significant UI changes, pleas=
e do make sure you manually test RTL for issues (by setting
 <span dir=3D"auto"><code><span>intl.l10n.pseudo<span style=3D"font-family:=
arial,sans-serif"> to </span>bidi<span style=3D"font-family:arial,sans-seri=
f">) to make Firefox accessible for all languages :)<br></span></span></cod=
e></span></div><div><br><span dir=3D"auto"><code><span><span style=3D"font-=
family:arial,sans-serif"></span></span></code></span></div><div>I hope that=
 this guide will be helpful, and please do let me or Itiel know if you've g=
ot any feedback on it.<br><span dir=3D"auto"><code><span><span style=3D"fon=
t-family:arial,sans-serif"></span></span></code></span><span dir=3D"auto"><=
code><span></span></code></span></div><div><div><div><br></div><div>Cheers,=
<br></div><div>Tim,</div><div>Firefox Desktop Theme peer<br></div><div><br>=
</div></div></div></div>
_______________________________________________<br>
firefox-dev mailing list<br>
<a href=3D"mailto:[email protected]" target=3D"_blank">firefox-dev@mo=
zilla.org</a><br>

<a href=3D"https://mail.mozilla.org/listinfo/firefox-dev" rel=3D"noreferrer=
" target=3D"_blank">https://mail.mozilla.org/listinfo/firefox-dev</a><br>
</blockquote></div>

<br></blockquote></blockquote><br></div>

--===============3954407099129431831==
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Content-Disposition: inline

_______________________________________________
firefox-dev mailing list
[email protected]
https://mail.mozilla.org/listinfo/firefox-dev

--===============3954407099129431831==--