Twenty Seventeen: RTL improvements

[adamsilverstein]

I did some testing of Twenty Seventeen in a local RTL setup (Hebrew) and found a few minor issues:

The menu-scroll-down down arrow is right aligned, but should be left aligned.

Also, in the customizer, the new edit icons are mis-aligned, sitting on top of instead of beside the elements they are attached to.

In both cases this is because an absolute positioned element is used with a fixed right or left margin. To correct the issue, we need to override the rtl class and swap the positioning left/right.

[adamsilverstein]

38706.diff​

• Adjust some styles for RTL: customizer edit buttons and twenty seventeen scroll down arrow

Screenshot after:

[sirbrillig]

The RTL fix for the shortcut icons looks great to me. Thanks!

[lukecavanagh]

@adamsilverstein

Does the patch need to be updated for customize-preview-rtl.css as well?

[adamsilverstein]

I'm looking into this a bit more. I think my assumption about why these styles weren't working may be wrong. reviewing the build process, i actually see the correct customizer reverse style being created, but its not being applied correctly and I'm not sure why yet. For the twenty seventeen fix, thinking we may need to add twenty seventeen paths to the rtlcss build process then this style should also get the auto-reversal.

[adamsilverstein]

@lukecavanagh great question! so it turns out the customizer was not loading the rtlcss built customize-preview-rtl.css file at all, my updated patch corrects that

In 38706.2.diff​

• Add 'customize-preview' style to our $rtl_styles array, resulting in the correct rtl stylesheet being loaded into the customizer preview
• leaves the twenty seventeen specific fix in place, will look into including it into rtl build

[lukecavanagh]

@adamsilverstein

Good catch.

[adamsilverstein]

I think for the twenty seventeen fix it makes the most sense to leave the rtl.css in place as that is the approach for the rss support overall in the theme and serves a good example.

38706.2.diff​ should be good to go, would appreciate confirmation/testing

[helen]

In 39197:

Customize: Ensure RTL version of customize-preview.css is loaded.

props adamsilverstein.
see #27403, #38706.

[helen]

In 39198:

Twenty Seventeen: Better RTL positioning for scroll down arrow.

props adamsilverstein.
fixes #38706.