[MD settings] use arrow-forward to switch direction in rtl

chrome/browser/resources/settings/device_page/device_page.html

 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
 <link rel="import" href="/controls/settings_dropdown_menu.html">
 <link rel="import" href="/device_page/device_page_browser_proxy.html">
 <link rel="import" href="/device_page/display.html">
 <link rel="import" href="/device_page/keyboard.html">
@@ skipping 11 matching lines @@
     <style include="settings-shared"></style>
     <settings-animated-pages id="pages" section="device">
       <neon-animatable id="main" route-path="default">
         <div id="pointersRow" class="settings-box first"
             on-tap="onPointersTap_" actionable>
           <iron-icon icon="[[getPointersIcon_(hasMouse_, hasTouchpad_)]]">
           </iron-icon>
           <div class="middle">
             [[getPointersTitle_(hasMouse_, hasTouchpad_)]]
           </div>
-          <button class="icon-arrow-right" is="paper-icon-button-light">
+          <button class="icon-arrow-forward" is="paper-icon-button-light">
           </button>
         </div>
         <div id="keyboardRow" class="settings-box" on-tap="onKeyboardTap_"
             actionable>
           <iron-icon icon="settings:keyboard"></iron-icon>
           <div class="middle">$i18n{keyboardTitle}</div>
-          <button class="icon-arrow-right" is="paper-icon-button-light">
+          <button class="icon-arrow-forward" is="paper-icon-button-light">
           </button>
         </div>
         <template is="dom-if" if=[[stylusAllowed_]]>
           <div id="stylusRow" class="settings-box" on-tap="onStylusTap_"
               actionable>
             <iron-icon icon="settings:note"></iron-icon>
             <div class="middle">$i18n{stylusTitle}</div>
-          <button class="icon-arrow-right" is="paper-icon-button-light">
+          <button class="icon-arrow-forward" is="paper-icon-button-light">
           </button>
           </div>
         </template>
         <div id="displayRow" class="settings-box" on-tap="onDisplayTap_"
             actionable>
           <iron-icon icon="settings:desktop-windows"></iron-icon>
           <div class="middle">$i18n{displayTitle}</div>
-          <button class="icon-arrow-right" is="paper-icon-button-light">
+          <button class="icon-arrow-forward" is="paper-icon-button-light">
           </button>
         </div>
       </neon-animatable>
       <template is="dom-if" route-path="/pointer-overlay">
         <settings-subpage
             associated-control="[[$$('#pointersRow')]]"
             page-title="[[getPointersTitle_(hasMouse_, hasTouchpad_)]]">
           <settings-pointers prefs="{{prefs}}"
               has-mouse="[[hasMouse_]]" has-touchpad="[[hasTouchpad_]]">
           </settings-pointers>
@@ skipping 19 matching lines @@
         <settings-subpage
             associated-control="[[$$('#displayRow')]]"
             page-title="$i18n{displayTitle}">
           <settings-display></settings-display>
         </settings-subpage>
       </template>
     </settings-animated-pages>
   </template>
   <script src="device_page.js"></script>
 </dom-module>