fix(demos): Fix drawer menu icon position in RTL (#1931)

Steps to repro:

1. View the [Persistent Drawer](https://material-components-web.appspot.com/drawer/persistent-drawer.html) and [Temporary Drawer](https://material-components-web.appspot.com/drawer/temporary-drawer.html) demo pages in Edge
2. Open the F12 dev tools
3. Run this snippet in the console to toggle RTL:
    ```js
    var el = document.documentElement; el.dir = el.dir === 'rtl' ? '' : 'rtl';
    ```
4. Observe that the horizontal alignment of the toolbar menu icon is incorrect in RTL mode

Below is a screenshot of the bug this PR is fixing.

- Left side: IE 11 (correct behavior)
- Right side: MS Edge (buggy positioning)

![Screenshot of RTL drawer demo in IE 11 and Edge](https://user-images.githubusercontent.com/409245/34791933-50e44d48-f5fb-11e7-936b-ae3c3a016d85.png)

demos/drawer/persistent-drawer.html

@@ -98,7 +98,7 @@
       <header class="mdc-toolbar mdc-elevation--z4">
         <div class="mdc-toolbar__row">
           <section class="mdc-toolbar__section mdc-toolbar__section--align-start">
-            <span>
+            <span class="catalog-back">
               <a href="/" class="mdc-toolbar__menu-icon"><i class="material-icons">&#xE5C4;</i></a>
             </span>
             <button class="demo-menu material-icons mdc-toolbar__menu-icon">menu</button>

demos/drawer/temporary-drawer.html

@@ -44,7 +44,7 @@
     <div class="mdc-toolbar mdc-toolbar--fixed">
       <div class="mdc-toolbar__row">
         <section class="mdc-toolbar__section mdc-toolbar__section--align-start">
-          <span>
+          <span class="catalog-back">
             <a href="/" class="mdc-toolbar__menu-icon"><i class="material-icons">&#xE5C4;</i></a>
           </span>
           <button class="demo-menu material-icons mdc-toolbar__menu-icon">menu</button>