Re: RTL Guidelines

Reza Habibi <[email protected]> Fri, 7 Feb 2020 11:50:55 -0500
Newsgroups gmane.comp.mozilla.firefox.devel,gmane.comp.mozilla.localization
Message-ID <CABvs4MA4Y57drDTTa9n2xFYXRwp89F4Nc_VDgWLB+N2L+HYnbQ@mail.gmail.com>
--===============6329289354173974067==
Content-Type: multipart/alternative; boundary="0000000000001cc4eb059dff326a"

--0000000000001cc4eb059dff326a
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

Hello Jared,

I=E2=80=99ll review them. We solved some of them before.  As I can remember=
 I
prepared some RTL guidelines for Firefox focus and Firefox for android
before. I think we have to prepare a new one for this case.

Bests,
Reza

On Fri, Feb 7, 2020 at 11:37 AM Jared Wein <[email protected]> wrote:

> I have taken a quick look through the Firefox UI and believe the followin=
g
> issues are present with RTL support (tested with intl.l10n.pseudo=3Dbidi =
in
> about:config, then restarting):
>
> 1. The "Show Sidebars" icon in the navigation toolbar should be flipped i=
n
> RTL.
> 2. The arrows for submenus in the menupopup for the Library button in the
> navigation toolbar are facing the wrong way.
> 3. The arrows for submenus in the Firefox menu are facing the wrong way.
> 4. The "external link" icon for Firefox Monitor and Firefox Send, found
> within the Account submenu of the Firefox menu are facing the wrong way.
> 5. The "send tab to device" icon in the Account submenu of the Firefox me=
nu
> is facing the wrong way.
> 6. The magnifying glass 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 of 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".
> 7. The background for the tracker doorhanger's expanded info section in t=
he
> location bar should have the shield on the left side in RTL.
> 8. The "Print" icon should be flipped since the paper coming out of the
> printer shows directional text.
> 9. The Pocket menu does not appear to have any RTL support.
> 10. The "Pin tab", "Send tab to device", and "share" icons in the "..."
> menu of the location bar are facing the wrong way.
> 11. The "Go" arrow in the search box that appears after the user starts
> typing is facing the wrong way in RTL.
> 12. The "Last Page", "Next Page", "Previous Page", "First Page" icons in
> Print Preview are facing the wrong way in RTL.
> 13. The submenu arrows in the Site Information popup are facing the wrong
> way.
>
> Icons I'm not sure about:
> 1. The "protections report" icon shows a graph with the Y axis on the lef=
t
> side. Should this be flipped for RTL?
>
> Many of these would make good-first-bugs for people to mentor. Can someon=
e
> look through this list and let me know if I got any of them wrong?
>
> Thanks,
> Jared
>
>
> On Thu, Feb 6, 2020 at 7:04 PM Tim Nguyen <[email protected]> wrote:
>
> > Hello folks,
> >
> > There has been a significant number of RTL bugs found in the last few
> > months in the Firefox UI. From what I can gather, they were mostly due
> lack
> > of awareness on specific situations that are more complex than just usi=
ng
> > CSS logical properties, but sometimes due to lack of testing.
> >
> > Itiel has made a great job at filing+fixing many bugs and wrote up a
> guide
> > based on his experience. This guide describes in detail what things
> should
> > be mirrored, text handling in RTL and tips on how to spot/fix/test RTL
> > issues. It includes things I personally didn't know about before, so I =
do
> > encourage giving it a read:
> >
> >
> https://developer.mozilla.org/docs/Mozilla/Developer_guide/RTL_guidelines
> >
> > When developing a new part of the UI or making significant UI changes,
> > please do make sure you manually test RTL for issues (by setting
> > intl.l10n.pseudo to bidi) to make Firefox accessible for all languages =
:)
> >
> > I hope that this guide will be helpful, and please do let me or Itiel
> know
> > if you've got any feedback on it.
> >
> > Cheers,
> > Tim,
> > Firefox Desktop Theme peer
> >
> > _______________________________________________
> > firefox-dev mailing list
> > [email protected]
> > https://mail.mozilla.org/listinfo/firefox-dev
> >
> _______________________________________________
> dev-l10n mailing list
> dev-l10n-CzyLcWPZiU5YsZ3hbOqMTti2O/[email protected]
> https://lists.mozilla.org/listinfo/dev-l10n
>

--0000000000001cc4eb059dff326a
Content-Type: text/html; charset="UTF-8"
Content-Transfer-Encoding: quoted-printable

<div><div dir=3D"auto">Hello=C2=A0Jared,</div><div dir=3D"auto"><br></div><=
div dir=3D"auto">I=E2=80=99ll review them. We solved some of them before.=
=C2=A0 As I can remember I prepared some RTL guidelines for Firefox focus a=
nd Firefox for android before. I think we have to prepare a new one for thi=
s case.</div><div dir=3D"auto"><br></div><div dir=3D"auto">Bests,</div><div=
 dir=3D"auto">Reza</div></div><div><br><div class=3D"gmail_quote"><div dir=
=3D"ltr" class=3D"gmail_attr">On Fri, Feb 7, 2020 at 11:37 AM Jared Wein &l=
t;<a href=3D"mailto:[email protected]">[email protected]</a>&gt; wrote:<br></=
div><blockquote class=3D"gmail_quote" style=3D"margin:0px 0px 0px 0.8ex;bor=
der-left-width:1px;border-left-style:solid;padding-left:1ex;border-left-col=
or:rgb(204,204,204)">I have taken a quick look through the Firefox UI and b=
elieve the following<br>
issues are present with RTL support (tested with intl.l10n.pseudo=3Dbidi in=
<br>
about:config, then restarting):<br>
<br>
1. The &quot;Show Sidebars&quot; icon in the navigation toolbar should be f=
lipped in<br>
RTL.<br>
2. The arrows for submenus in the menupopup for the Library button in the<b=
r>
navigation toolbar are facing the wrong way.<br>
3. The arrows for submenus in the Firefox menu are facing the wrong way.<br=
>
4. The &quot;external link&quot; icon for Firefox Monitor and Firefox Send,=
 found<br>
within the Account submenu of the Firefox menu are facing the wrong way.<br=
>
5. The &quot;send tab to device&quot; icon in the Account submenu of the Fi=
refox menu<br>
is facing the wrong way.<br>
6. The magnifying glass in about:config is flipped when we normally<br>
wouldn&#39;t flip an icon that represents something from the physical world=
<br>
that is held by the majority of people in their right hand. In the linked<b=
r>
MDN page has this topic in the &quot;what to mirror&quot; section, though t=
he<br>
sub-referenced &quot;material design&quot; page mentions this as something =
to &quot;not to<br>
mirror&quot;.<br>
7. The background for the tracker doorhanger&#39;s expanded info section in=
 the<br>
location bar should have the shield on the left side in RTL.<br>
8. The &quot;Print&quot; icon should be flipped since the paper coming out =
of the<br>
printer shows directional text.<br>
9. The Pocket menu does not appear to have any RTL support.<br>
10. The &quot;Pin tab&quot;, &quot;Send tab to device&quot;, and &quot;shar=
e&quot; icons in the &quot;...&quot;<br>
menu of the location bar are facing the wrong way.<br>
11. The &quot;Go&quot; arrow in the search box that appears after the user =
starts<br>
typing is facing the wrong way in RTL.<br>
12. The &quot;Last Page&quot;, &quot;Next Page&quot;, &quot;Previous Page&q=
uot;, &quot;First Page&quot; icons in<br>
Print Preview are facing the wrong way in RTL.<br>
13. The submenu arrows in the Site Information popup are facing the wrong<b=
r>
way.<br>
<br>
Icons I&#39;m not sure about:<br>
1. The &quot;protections report&quot; icon shows a graph with the Y axis on=
 the left<br>
side. Should this be flipped for RTL?<br>
<br>
Many of these would make good-first-bugs for people to mentor. Can someone<=
br>
look through this list and let me know if I got any of them wrong?<br>
<br>
Thanks,<br>
Jared<br>
<br>
<br>
On Thu, Feb 6, 2020 at 7:04 PM Tim Nguyen &lt;<a href=3D"mailto:ntim.bugs@g=
mail.com" target=3D"_blank">[email protected]</a>&gt; wrote:<br>
<br>
&gt; Hello folks,<br>
&gt;<br>
&gt; There has been a significant number of RTL bugs found in the last few<=
br>
&gt; months in the Firefox UI. From what I can gather, they were mostly due=
 lack<br>
&gt; of awareness on specific situations that are more complex than just us=
ing<br>
&gt; CSS logical properties, but sometimes due to lack of testing.<br>
&gt;<br>
&gt; Itiel has made a great job at filing+fixing many bugs and wrote up a g=
uide<br>
&gt; based on his experience. This guide describes in detail what things sh=
ould<br>
&gt; be mirrored, text handling in RTL and tips on how to spot/fix/test RTL=
<br>
&gt; issues. It includes things I personally didn&#39;t know about before, =
so I do<br>
&gt; encourage giving it a read:<br>
&gt;<br>
&gt; <a href=3D"https://developer.mozilla.org/docs/Mozilla/Developer_guide/=
RTL_guidelines" rel=3D"noreferrer" target=3D"_blank">https://developer.mozi=
lla.org/docs/Mozilla/Developer_guide/RTL_guidelines</a><br>
&gt;<br>
&gt; When developing a new part of the UI or making significant UI changes,=
<br>
&gt; please do make sure you manually test RTL for issues (by setting<br>
&gt; intl.l10n.pseudo to bidi) to make Firefox accessible for all languages=
 :)<br>
&gt;<br>
&gt; I hope that this guide will be helpful, and please do let me or Itiel =
know<br>
&gt; if you&#39;ve got any feedback on it.<br>
&gt;<br>
&gt; Cheers,<br>
&gt; Tim,<br>
&gt; Firefox Desktop Theme peer<br>
&gt;<br>
&gt; _______________________________________________<br>
&gt; firefox-dev mailing list<br>
&gt; <a href=3D"mailto:[email protected]" target=3D"_blank">firefox-d=
[email protected]</a><br>
&gt; <a href=3D"https://mail.mozilla.org/listinfo/firefox-dev" rel=3D"noref=
errer" target=3D"_blank">https://mail.mozilla.org/listinfo/firefox-dev</a><=
br>
&gt;<br>
_______________________________________________<br>
dev-l10n mailing list<br>
<a href=3D"mailto:dev-l10n-CzyLcWPZiU5YsZ3hbOqMTti2O/[email protected]" target=3D"_blank">dev-l10n@li=
sts.mozilla.org</a><br>
<a href=3D"https://lists.mozilla.org/listinfo/dev-l10n" rel=3D"noreferrer" =
target=3D"_blank">https://lists.mozilla.org/listinfo/dev-l10n</a><br>
</blockquote></div></div>

--0000000000001cc4eb059dff326a--

--===============6329289354173974067==
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

--===============6329289354173974067==--