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..9f6c5d362e281b929ecfbf25dc266867cc7d7d24
--- /dev/null
+++ b/chrome/browser/resources/settings/people_page/fingerprint_list.html
@@ -0,0 +1,54 @@
+<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/paper-icon-button/paper-icon-button.html">

[stevenjb, 2016/12/07 23:25:40]

+paper-button

[sammiequon, 2016/12/08 03:50:50]

Done.

+<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"></style>
+    <style>

[stevenjb, 2016/12/07 23:25:40]

Only one style section:

<style include="settings-shared">
  page-specific-styling...
</style>

[sammiequon, 2016/12/08 03:50:50]

Done.

+      .list-item {
+        border-bottom: 1px solid black;
+        display: flex;
+      }
+
+      .list-item[index='0'] {
+        border-top: 1px solid black;
+      }
+
+      .warning-text {
+        font-style: italic;
+      }
+    </style>
+
+    <div>
+      <div>$i18n{lockScreenRegisteredFingerprints}</div>
+      <div>

[stevenjb, 2016/12/07 23:25:40]

div needed?

[sammiequon, 2016/12/08 03:50:50]

Done.

+        <template is="dom-repeat" items="{{fingerprints_}}">

[stevenjb, 2016/12/07 23:25:40]

Does this have the expected keyboard focus behavior? You may want to use
iron-list instead to get that (see other examples of iron-list and dom-repeat in
Settings).

[sammiequon, 2016/12/08 03:50:50]

Yeah iron-list works a bit better with the tabbing. Done.

+          <div class="list-item" index$="[[index]]">
+            <paper-input value="{{item.name}}"></paper-input>
+            <paper-icon-button icon="cr:delete" on-tap="onFingerprintDelete_">
+            </paper-icon-button>
+          </div>
+        </template>
+        <div class="settings-box continuation radio-indent">

[stevenjb, 2016/12/07 23:25:40]

Use "settings-box first" since this is the first settings-box. (Styling is the
same as continuation).

[sammiequon, 2016/12/08 03:50:50]

Done.

+          <paper-button is="action-link" on-tap="onAddFingerprint_"
+                        disabled="[[!canAddNewFingerprint_(fingerprints_.length)]]">

[stevenjb, 2016/12/07 23:25:40]

4 space indent

[sammiequon, 2016/12/08 03:50:50]

Done.

+            <div hidden="[[!canAddNewFingerprint_(fingerprints_.length)]]">
+              $i18n{lockScreenAddFingerprint}
+            </div>
+            <div hidden="[[canAddNewFingerprint_(fingerprints_.length)]]">
+              [[getFingerprintButtonCannotAddText_()]]
+            </div>
+          </paper-button>

[stevenjb, 2016/12/07 23:25:40]

This is a little odd, having conditional divs inside a button. Can we make the
button conditional and just show formatted text when disabled instead?

[sammiequon, 2016/12/08 03:50:50]

Done.

+        </div>
+      </div>
+      <div class="warning-text">
+        $i18n{lockScreenFingerprintWarning}
+      </div>
+    </div>
+  </template>
+  <script src="fingerprint_list.js"></script>
+</dom-module>