Adding pref to store the user-selected proximity threshold.

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

Index: chrome/browser/resources/settings/people_page/lock_screen.html
diff --git a/chrome/browser/resources/settings/people_page/lock_screen.html b/chrome/browser/resources/settings/people_page/lock_screen.html
index e2b8b7d6e536f2266c626f3565d31e77d3774202..db8f4c96241bdb860d8e938b006e8b385361ea77 100644
--- a/chrome/browser/resources/settings/people_page/lock_screen.html
+++ b/chrome/browser/resources/settings/people_page/lock_screen.html
@@ -6,6 +6,7 @@
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.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-radio-group/paper-radio-group.html">
+<link rel="import" href="../controls/settings_dropdown_menu.html">
 <link rel="import" href="../controls/settings_toggle_button.html">
 <link rel="import" href="easy_unlock_browser_proxy.html">
 <link rel="import" href="easy_unlock_turn_off_dialog.html">
@@ -135,14 +136,18 @@
               <a target="_blank" href="$i18n{easyUnlockLearnMoreURL}">
                 $i18n{learnMore}
               </a>
-              <template is="dom-if" if="[[getShowEasyUnlockToggle_(
-                  easyUnlockEnabled_, easyUnlockProximityDetectionAllowed_)]]">
-                <settings-toggle-button
-                    pref="{{prefs.easy_unlock.proximity_required}}"
-                    label="$i18n{easyUnlockRequireProximityLabel}">
-                </settings-toggle-button>
+              <template is="dom-if" if="[[easyUnlockEnabled_]]">
+                <div class="setting-box">

[stevenjb, 2017/07/17 16:43:36]

Instead of having a settings-box inside a settings-box like this, this should be
at the same level as #easyUnlock.

Also we generally use iron-collapse to hide the section when the setting is
disabled so that the subsection animates opened/closed when the controlling
setting is enabled/disabled.

See "Enable auto repeat" in the keyboard settings for an example.

[sacomoto, 2017/07/20 19:50:15]

Done.

+                  <div class="start">
+                    $i18n{easyUnlockProximityThresholdLabel}
+                    <settings-dropdown-menu
+                        pref="{{prefs.easy_unlock.proximity_threshold}}"
+                        menu-options="[[easyUnlockProximityThresholdMapping_]]">
+                    </settings-dropdown-menu>

[stevenjb, 2017/07/17 16:43:37]

The dropdown menu should be at the same level as the <div> so that it appears
right aligned.

[sacomoto, 2017/07/20 19:50:15]

Done.

+                  </div>
+                </div>
               </template>
-            </div>
+             </div>
           </div>
           <div class="separator"></div>
           <template is="dom-if" if="[[!easyUnlockEnabled_]]">