React-md: [Internationalization] - Assorted RTL fixes

[roderik]

I'm working on a multilingual app in Englisch and Arabic. The Arabic part is an RTL language; the English part is LTR. Almost everything works great by just setting the dir attribute on the HTML tag, but there are some small tweaks.

While I do not speak Arabic, nor am acutely aware of "how things are done" in RTL languages, from an esthetic standpoint I will just reverse the margins, etc. to make it look the same as LTR.

These changes are stopgap measures and are not nicely integrated with react-md, but might serve as a first step in integrating RTL support into react-md. I'll update this post with all mods I need for my app, for future reference if someone else needs them.

// Fixes the margin between icon and label in a button
html[dir="rtl"] .md-icon-text {
    &:first-child {
      padding-right: 0;
      padding-left: $md-font-icon-separator-padding;
    }
    &:last-child {
      padding-left: 0;
      padding-right: $md-font-icon-separator-padding;
    }
}
// Fixes extra margin in drop down from MenuList
html[dir="rtl"] .md-list {
  padding-right: 0;
}

More soon!

[mlaursen]

See also #250

Feel free to continue posting in this one or the other issue. I'll keep both open until support has been directly added into react-md