Twenty Twelve: full RTL support

[lancewillett]

Review, test, and fix RTL stylesheets.

1. rtl.css (main)
2. editor-style-rtl.css (editor stylesheet)

First stab. Tested with Theme Unit Test.

My first ever RTL stylesheet: rtl.css

Refresh with smarter changes and editor-style-rtl.css

21441.2.diff​ adds a missing margin-left for .commentlist .children and combines a couple of similar styles in the @media block.

Adds missing margin for lists in comments

We ought not to RTL image alignment since the editor adds the class and the button is always the same

Adds the visual of comment threading back to RTL

In [21430]:

Twenty Twelve RTL: adds missing margin for lists in comments, props iandstewart. See #21441.

In [21431]:

Twenty Twelve RTL: We ought not to RTL image alignment since the editor adds the class and the button is always the same. See #21441 props iandstewart.

In [21432]:

Twenty Twelve RTL: Adds the visual of comment threading back to RTL, props iandstewart. See #21441.

In [21433]:

Twenty Twelve RTL: add editor-style-rtl stylesheet, props SergeyBiryukov and obenland. See #21441.

In [21434]:

Twenty Twelve RTL: more fixes props obenland. See #21441.

The "Post author" badge needs RTL treatment: 21441.post-author.png​.

The order is wrong, so the margins (which are correct per se) also don't look right.
http://core.trac.wordpress.org/browser/trunk/wp-content/themes/twentytwelve/rtl.css#L134

In 21441-editor-body.diff​: Per IRC Chat with @azaozz, center the editor body in RTL to stop messing with calculating height/width in js

In [21441]:

Twenty Twelve, RTL: per azaozz, center the editor body in RTL to stop messing with calculating height/width in JS. Props obenland, see #21441.

Chatted with Yoav Farhi, he's going to help do a full RTL review for us.

Replying to lancewillett:

Was thinking to center the editor body by default (in the default editor css) and then add light grey background to the html element. Makes a lot better looking editor when the body has max-width.

Also, there are more classes on the body in TinyMCE: mceContentBody content post-type-post. The first one is always there (set by MCE) the second is the editor ID and third is the post type. So .content can be used to target only the main TinyMCE instance on the Edit Post screen. DFW gets mceContentBody content post-type-post wp-fullscreen-editor.

Props SergeyBiryukov

In [21483]:

Twenty Twelve: fix bypostauthor styling, probs obenland and SergeyBiryukov (also improves the RTL layout, see #21441).

Removed the auto value form the body margin (it wasn't set in ltr), and fixed a few selectors and missing rules

rtl.css looks great, haven't found any problems so far, but I have some more testing to do :)

Replying to yoavf:

rtl.css looks great, haven't found any problems so far, but I have some more testing to do :)

Thanks much for looking and the patch.

In [21515]:

Twenty Twelve: editor RTL style fixes props yoavf, see #21441.

In [21565]:

Twenty Twelve: update RTL stylsheet based on recent layout changes, see #21441.

RTL should be up to date with latest changes. If new issues arise, please open a new Trac ticket.