3.5 RTL audit

[nacin]

Audit RTL in 3.5. Look for breakage and inconsistencies, especially with new features: media, the color picker, etc.

---

Notes on how you can help auditing:

While you can set $text_direction to 'rtl' in wp-config.php, this is largely imperfect as English strings don't necessarily flip correctly, which can be tough when an english string has HTML elements. (We saw this, for example, with page numbering above/below the list tables.)

I built a 3.5-beta3 download package for he_IL: ​http://he.wordpress.org/release-archive/he_IL/wordpress-3.5-beta3-he_IL.zip. If you download it and want to integrate into an existing test install, The key is copying over wp-content/languages/* and then setting WPLANG in wp-config.php to 'he_IL'.

If you download it and want to integrate into an existing test install, The key is copying over wp-content/languages/* and then setting WPLANG in wp-config.php to 'he_IL'.

Thanks, nacin. I'll be testing that.

@nacin, I've unpacked the attached ZIP archive and installed WordPress normally. When I first logged in, the dashboard was all flipped over as if it didn't have the RTL stylesheet included. ​http://i.imgur.com/mT2pK.png

However, when I enabled on SCRIPT_DEBUG it all got back to normal.

Other than that there are minor CSS issues. Especially with the new button styles. ​http://i.imgur.com/7FtPg.png
Also, I haven't noticed anything exceptional about the pagination area over and below list tables. This is how it looks:

In general it's looking pretty good.

Attached 22453.welcome-screen.patch​ for the Welcome Screen and [attachment:22453.media-view.patch​​] for the media modal.

In 22604:

Media: RTL styles for the media modal. props ocean90. see #22453, #21390.

Replying to maor:

... the dashboard was all flipped over as if it didn't have the RTL stylesheet included.
However, when I enabled on SCRIPT_DEBUG it all got back to normal.

I confirm that.

Adding define('SCRIPT_DEBUG', true); to wp-config.php fixed the problem.

---

Replying to Nasin:

• The the color picker looks great on RTL.
• ​http://i.imgur.com/jHoTh.png - RTL issue on Attachment Page
• ​http://i.imgur.com/nEp5O.png - RTL issue on New Post Page
• ​http://i.imgur.com/cvUag.png - RTL issue on Insert Media

---

Other RTL issuies:

• ​http://i.imgur.com/wGz7z.png - old RTL issue on theme-install.php
• ​http://i.imgur.com/iZymz.png - old RTL issue on options-permalink.php

One more on Media - ​http://i.imgur.com/dNt5w.png

And checkout this related ticket #16834. I reported this issue almost 2 years ago.

20469.add-media.diff​ fixes "Add Media" button (​http://i.imgur.com/7FtPg.png in comment:3).

padding-left: 10px (rather than 0 or auto) comes from default button styles.

Replying to ocean90:

Attached 22453.welcome-screen.patch​ for the Welcome Screen and [attachment:22453.media-view.patch​​] for the media modal.

RE the Welcome Panel patch. I noticed padding was added to the welcome panel column's wrapper, and it makes them look a little weird. ​http://i.imgur.com/yjDgL.png. Instead there should be no padding on that element, exactly the way it is in the LTR version.

Done some testings (see below) and figured it looks much better without the padding on the right ​http://i.imgur.com/9u2rR.png.

.welcome-panel .welcome-panel-column-container {
	padding: 0;
}

Attached 22453.image-editor.patch​ for the attachment editor screen. Fixes the "Edit Image" button. (​http://i.imgur.com/jHoTh.png in comment:6).

22453.image-editor.patch​ now also fixes an old RTL issue in source:/trunk/wp-admin/theme-install.php​ (​​http://i.imgur.com/wGz7z.png in comment:6).

Welcome panel stuff still going on at #21368, since it was reopened, including RTL. Hopefully we'll close that off soon to reduce confusion.

In [22638]:

Welcome screen: clean up the css, improve the html, add RTL styles, props helenyhou TobiasBg ocean90, fixes #21368, see #22453

22453.image-editor-theme-filter.patch​ extends the patch from maor. It removes unneeded lines and improves the image edit buttons.

20469.add-media.diff​ and 22453.image-editor-theme-filter.patch​ should be committed.

[attachment:22453.patch​​] combines 20469.add-media.diff and 22453.image-editor-theme-filter.patch​. The patch also fixes the spinners, the featured image button and the edit slug box.

In 22640:

RTL fixes and improvements: add-media, image-editor, the spinners, the featured image button, some css cleanup, props ocean90, maor, SergeyBiryukov, ramiy, see #22453

In 22641:

RTL: fix styling of Skip To links, see #22453

22453.admin-bar-webkit.patch​ fixes an issue in Webkit, see [18934].

In [19080] the fix was added to the RTL style with the transform to border-right. Since the bug exits only on the left side the RTL change reverts the originally fix. The lines should be removed from the RTL style again.

In 22643:

RTL: remove unneeded toolbar border-right, props ocean90, see #22453

Lots of patches and commits here. Anything left uncommitted or unpatched? If not, it'd be cool to finish off #16834 too as it is the only other RTL issue open on Trac.

22453.media-view.2.patch​​ for [22706], [22648], [22712] and [22605].

In 22720:

RTL media-views fixes. props ocean90. fixes #22453.

Media modal.

attachment:22615.3b.patch​​ is solid. +1

[attachment:22453.wp-colorpicker.patch​​] adds RTL support for the colorpicker. (And includes a small clean up.)

attachment:22615.3b.patch​, attachment:22453.wp-colorpicker.patch​ work like a charm. +1

In 22947:

RTL fixes for media and color picker.

Props ocean90
see #22453