MD Settings: convert paper-icon-button to paper-icon-button-light.

chrome/browser/resources/settings/people_page/fingerprint_list.html

 <link rel="import" href="chrome://resources/cr_elements/icons.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/iron-list/iron-list.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-ripple/paper-ripple.html">
 <link rel="import" href="fingerprint_browser_proxy.html">
 <link rel="import" href="setup_fingerprint_dialog.html">
 <link rel="import" href="../i18n_setup.html">
 <link rel="import" href="../settings_shared_css.html">
 
 <dom-module id="settings-fingerprint-list">
   <template>
     <style include="settings-shared">
       .add-link {
         background-color: transparent;
         color: var(--google-blue-500);
-        padding: 0;
+      }
+
+      .add-link[focused] {

[Dan Beam, 2017/05/23 16:36:22]

what's going on here?

[scottchen, 2017/05/27 00:18:03]

There was a really weird visual where when the button is focused, the ripple is
gray and the text is also gray, so it was reaaaally hard to read the text.

+        color: white;
       }
 
       .add-link[disabled] {
         color: var(--google-grey-500);
       }
 
       .body {
         @apply(--settings-list-frame-padding);
       }
 
@@ skipping 12 matching lines @@
 
     <h2 class="settings-box">$i18n{lockScreenRegisteredFingerprints}</h2>
     <div class="body layout vertical">
       <iron-list id="fingerprintsList" items="[[fingerprints_]]">
         <template>
           <div class="list-item">
             <paper-ripple noink></paper-ripple>
             <paper-input value="{{item}}"
                 on-change="onFingerprintLabelChanged_">
             </paper-input>
-            <button is="paper-icon-button-light"
+            <button is="paper-icon-button-light" class="icon-delete"
                 on-tap="onFingerprintDeleteTapped_">
-              <iron-icon icon="cr:delete"></iron-icon>
             </button>
           </div>
         </template>
       </iron-list>
       <div class="continuation">
         <paper-button id="addFingerprint" class="add-link action-button"
             on-tap="openAddFingerprintDialog_">
           $i18n{lockScreenAddFingerprint}
         </paper-button>
       </div>
     </div>
     <i class="settings-box continuation">$i18n{lockScreenFingerprintWarning}</i>
 
     <settings-setup-fingerprint-dialog id="setupFingerprint"
         on-add-fingerprint="updateFingerprintsList_"
         on-close="onSetupFingerprintDialogClose_">
     </settings-setup-fingerprint-dialog>
   </template>
   <script src="fingerprint_list.js"></script>
 </dom-module>