[MD settings] icons for clickable rows

chrome/browser/resources/settings/passwords_and_forms_page/passwords_and_forms_page.html

 <link rel="import" href="chrome://resources/html/assert.html">
 <link rel="import" href="chrome://resources/html/cr.html">
 <link rel="import" href="chrome://resources/html/polymer.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="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="/passwords_and_forms_page/autofill_section.html">
 <link rel="import" href="/passwords_and_forms_page/passwords_section.html">
 <link rel="import" href="/prefs/prefs.html">
 <link rel="import" href="/prefs/prefs_behavior.html">
 <link rel="import" href="/route.html">
 <link rel="import" href="/settings_page/settings_animated_pages.html">
 <link rel="import" href="/settings_page/settings_subpage.html">
 <link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="settings-passwords-and-forms-page">
   <template>
     <style include="settings-shared"></style>
     <settings-animated-pages id="pages" section="passwordsAndForms">
       <neon-animatable route-path="default">
-        <div class="settings-box first two-line" on-tap="onAutofillTap_"
-            id="autofillManagerButton"
-            actionable$="[[prefs.autofill.enabled.value]]">
-          <div class="start">
-            <div>$i18n{autofill}</div>
-            <div class="secondary">$i18n{autofillDetail}</div>
+        <div class="settings-box first two-line">
+          <div class="middle two-line" on-tap="onAutofillTap_"
+              id="autofillManagerButton"
+              actionable$="[[prefs.autofill.enabled.value]]">
+            <div class="flex">
+              <div>$i18n{autofill}</div>
+              <div class="secondary">$i18n{autofillDetail}</div>
+            </div>
+            <button class="icon-arrow-right" is="paper-icon-button-light">
+            </button>

[dschuyler, 2016/09/23 17:29:18]

This is another example where the arrow is pointing right
at some other control. It's a toggle button in this case.
Alan plans to have the toggle controls moved into a the
subpages. For this CL, we are using the vertical grey bar
to visually separate the row button from the other control.
(This is an Alan-approved solution while he works on 
getting UI approval for moving the controls).

           </div>
-          <paper-toggle-button id="autofillToggle"
-              checked="{{prefs.autofill.enabled.value}}">
-          </paper-toggle-button>
+          <div class="secondary-action">
+            <paper-toggle-button id="autofillToggle"
+                checked="{{prefs.autofill.enabled.value}}">
+            </paper-toggle-button>
+          </div>
         </div>
-        <div class="settings-box two-line" on-tap="onPasswordsTap_"
-            id="passwordManagerButton"
-            actionable$="[[prefs.profile.password_manager_enabled.value]]">
-          <div class="start">
-            <div>$i18n{passwords}</div>
-            <div class="secondary">$i18n{passwordsDetail}</div>
+        <div class="settings-box two-line">
+          <div class="middle two-line" on-tap="onPasswordsTap_"
+              id="passwordManagerButton"
+              actionable$="[[prefs.profile.password_manager_enabled.value]]">
+            <div class="flex">
+              <div>$i18n{passwords}</div>
+              <div class="secondary">$i18n{passwordsDetail}</div>
+            </div>
+            <button class="icon-arrow-right" is="paper-icon-button-light">
+            </button>
           </div>
-          <paper-toggle-button id="passwordToggle"
-              checked="{{prefs.profile.password_manager_enabled.value}}">
-          </paper-toggle-button>
+          <div class="secondary-action">
+            <paper-toggle-button id="passwordToggle"
+                checked="{{prefs.profile.password_manager_enabled.value}}">
+            </paper-toggle-button>
+          </div>
         </div>
       </neon-animatable>
       <template is="dom-if" route-path="/autofill">
         <settings-subpage
             associated-control="[[$$('#autofillManagerButton')]]"
             page-title="$i18n{autofill}">
           <settings-autofill-section id="autofillSection"
               addresses="[[addresses]]" credit-cards="[[creditCards]]">
           </settings-autofill-section>
         </settings-subpage>
       </template>
       <template is="dom-if" route-path="/managePasswords">
         <settings-subpage
             associated-control="[[$$('#passwordManagerButton')]]"
             page-title="$i18n{passwords}"
             search-label="$i18n{searchPasswords}"
             search-term="{{passwordFilter_}}">
           <passwords-section saved-passwords="[[savedPasswords]]"
               id="passwordSection" password-exceptions="[[passwordExceptions]]"
               filter="[[passwordFilter_]]" prefs="{{prefs}}">
           </passwords-section>
         </settings-subpage>
       </template>
     </settings-animated-pages>
   </template>
   <script src="passwords_and_forms_page.js"></script>
 </dom-module>