Bug 1064617 - (email-rtl) [META] [RTL] Email

Generally improves the RTL situation in email. Changes were the following:

## Move to flexbox

For some pieces, they were moved to flexbox, away from floats. The attachment UI in compose and message_reader most notably. Also, the settings items where there is text on one side and a control on the other (.list-text-pair changes).

## Background position

Most of our icons use a background image, and some are edge-aligned, so those needed overrides for background-position.

## Some floats stayed

Some of the floats stayed, so they have a dir="rtl" override. These were cases where the floated piece was more ornamental, like a "selected" dot or simple icon to describe the text. The decision to go to flexbox or stay as a float with a CSS override was based on how many elements in the row were involved, and if they were actionable or more ornamental, or if it was already a more complicated setup, and I did not want to mess with it much, like bubbles in relation to text entry in the compose address envelope area.

## dir=auto additions

If the text could have come from a user, instead of application UI text, dir=auto was added to allow proper text display. For most purposes in email, this meant for single line text displays, that the ellipsis truncation would happen correctly.

## Specific uses of -left -right used

These cases were if dir="auto" text was being displayed, but it was typically smaller than the display region for it. In those cases it was more important to have the text right align, to match the rest of the right-aligned UI grid in the RTL case, than have the ltr text floating off to the left, breaking the flow.

This was done just for display areas, not text inputs.

### iframe_shims

This one will need more work, but this initial change just gets the email to show up correctly. It is messy though, and I expect this to change, tracked in bug 1099449.

**Summary**: This is just to get a baseline set up. More changes will be needed, but at least now the email app does not look like a graphics rendering glitch in rtl mode.
er, elaborating, I have a test HTML email that triggers newsletter mode.  It's an MS ad where there's basically two columns with localized hit-target buttons (AKA the <a> area is not super huge).  If I zoom to 150% or whatever and pan over to the right and tap on one of those, I don't get a link prompt with "Mirrored English" active.  If I use normal English, all is fine.

The reason I'd think we wouldn't want to do this would be that I would expect transforming from the top right to screw with our coordinate space.