md-settings: Added settings for fingerprint unlock.

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

Index: chrome/browser/resources/settings/people_page/fingerprint_list.html
diff --git a/chrome/browser/resources/settings/people_page/fingerprint_list.html b/chrome/browser/resources/settings/people_page/fingerprint_list.html
new file mode 100644
index 0000000000000000000000000000000000000000..492d86f5a3675f2ad2fa9597d0a21e1b05fe633f
--- /dev/null
+++ b/chrome/browser/resources/settings/people_page/fingerprint_list.html
@@ -0,0 +1,50 @@
+<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/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-icon-button/paper-icon-button.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
+<link rel="import" href="/settings_shared_css.html">
+
+<dom-module id="settings-fingerprint-list">
+  <template>
+    <style include="settings-shared">
+      .list-item {
+        border-bottom: 1px solid black;
+        display: flex;
+      }
+
+      .list-item[index='0'] {
+        border-top: 1px solid black;
+      }

[Dan Beam, 2016/12/13 19:53:23]

this is not the right color.  we have a CSS variable for this (like
--settings-border or something)

if you control this DOM and it'll never be weird on you, just do something like:

.list-item:not([index=0]) {
  @apply(--settings-border-var-name-or-whatever);
}

you also shouldn't be putting borders on top and bottom in settings, afaik

[sammiequon, 2016/12/13 23:33:33]

The updated (but I don't think final) mocks have no border. I keep these tips in
mind though for futures. :)

+
+      .warning-text {
+        font-style: italic;
+      }
+    </style>
+
+    <div>
+      <div>$i18n{lockScreenRegisteredFingerprints}</div>
+        <iron-list id="fingerprintsList" items="[[fingerprints_]]">
+          <template>
+            <div class="list-item" index$="[[index]]">
+              <paper-input value="{{item.name}}"></paper-input>

[Dan Beam, 2016/12/13 19:53:23]

why can't we just drop the {name:} stuff and just bind directly to
value="{{item}}" here and just make fingerprints_ an !Array<string>?

[sammiequon, 2016/12/13 23:33:33]

I was expecting the list to have more than just a 'name' value later, but we can
change that if it ever happens later. Done.

+              <paper-icon-button icon="cr:delete" on-tap="onFingerprintDelete_">

[Dan Beam, 2016/12/13 19:53:23]

could this be <button is="paper-icon-button-light"> instead?

[sammiequon, 2016/12/13 23:33:33]

Done.

+              </paper-icon-button>
+            </div>
+          </template>
+        </iron-list>
+        <div class="settings-box first radio-indent">
+          <paper-button is="action-link" on-tap="onAddFingerprint_"

[Dan Beam, 2016/12/13 19:53:23]

what is this is="action-link" doing here?

[sammiequon, 2016/12/13 23:33:33]

Done.

+              disabled="[[!canAddNewFingerprint_(fingerprints_.length)]]">
+            [[getFingerprintButtonText_(fingerprints_.length)]]
+          </paper-button>
+        </div>
+      <div class="warning-text">
+        $i18n{lockScreenFingerprintWarning}
+      </div>
+    </div>
+  </template>
+  <script src="fingerprint_list.js"></script>
+</dom-module>