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 8e89be634237be049e2d5253ad8bb772486b68fa..1c78479904b57c24581bcb6cf28ff6eca75764d6 100644 |
--- a/chrome/browser/resources/settings/people_page/lock_screen.html |
+++ b/chrome/browser/resources/settings/people_page/lock_screen.html |
@@ -20,13 +20,20 @@ |
<dom-module id="settings-lock-screen"> |
<template> |
<style include="settings-shared action-link"> |
- #easyUnlock .start { |
+ #easyUnlock .start, |
+ #pinPasswordDiv.start { |
/* When the easy unlock toggle is shown, the easy unlock section's |
* content becomes squashed to the top and bottom edges. Use padding to |
- * ensure the easy unlock content looks correct. */ |
+ * ensure the easy unlock content looks correct. This also applies to |
+ * the pin+password content section when the setup pin button is shown. |
+ */ |
padding: 11px 0; |
} |
+ #lockOptionsDiv { |
+ display: block; |
+ } |
+ |
paper-radio-button { |
--paper-radio-button-label: { |
display: flex; |
@@ -37,44 +44,52 @@ |
paper-radio-button > .start { |
flex: 1; |
} |
+ |
+ #setupPinButton { |
+ margin: auto; |
+ } |
</style> |
<div> |
- <div class="list-frame"> |
- <paper-radio-group id="unlockType" selected="{{selectedUnlockType}}"> |
- <paper-radio-button name="password"> |
- <div class="start"> |
- $i18n{lockScreenPasswordOnly} |
- <div class="secondary"> |
- $i18n{lockScreenHighSecurity} |
- </div> |
- </div> |
- </paper-radio-button> |
- <paper-radio-button name="pin+password"> |
- <div class="start"> |
- $i18n{lockScreenPinOrPassword} |
- <div class="secondary"> |
- $i18n{lockScreenMediumSecurity} |
- </div> |
- </div> |
- <template is="dom-if" |
- if="[[showConfigurePinButton_(selectedUnlockType)]]"> |
- <paper-button id="setupPinButton" class="secondary-button" |
- on-tap="onConfigurePin_"> |
- [[getSetupPinText_(hasPin)]] |
- </paper-button> |
- </template> |
- </paper-radio-button> |
- </paper-radio-group> |
- </div> |
- |
- <div id="screenLockDiv" class="settings-box"> |
+ <div id="screenLockDiv" class="settings-box first"> |
<settings-toggle-button class="start" |
pref="{{prefs.settings.enable_screen_lock}}" |
label="$i18n{enableScreenlock}"> |
</settings-toggle-button> |
</div> |
+ <div id="lockOptionsDiv" class="settings-box"> |
+ <h2> $i18n{lockScreenOptions} </h2> |
+ <div class="list-frame"> |
+ <paper-radio-group id="unlockType" selected="{{selectedUnlockType}}"> |
+ <paper-radio-button name="password" class="settings-box first"> |
+ <div class="start"> |
+ $i18n{lockScreenPasswordOnly} |
+ <div class="secondary"> |
+ $i18n{lockScreenHighSecurity} |
+ </div> |
+ </div> |
+ </paper-radio-button> |
+ <paper-radio-button name="pin+password" |
+ class="settings-box two-line"> |
+ <div id="pinPasswordDiv" class="start"> |
+ $i18n{lockScreenPinOrPassword} |
+ <div class="secondary"> |
+ $i18n{lockScreenMediumSecurity} |
+ </div> |
+ </div> |
+ <template is="dom-if" |
+ if="[[showConfigurePinButton_(selectedUnlockType)]]"> |
+ <paper-button id="setupPinButton" class="secondary-button" |
+ on-tap="onConfigurePin_"> |
+ [[getSetupPinText_(hasPin)]] |
+ </paper-button> |
+ </template> |
+ </paper-radio-button> |
+ </paper-radio-group> |
+ </div> |
+ </div> |
+ |
<template is="dom-if" if="[[fingerprintUnlockEnabled_]]"> |
<div id="fingerprintDiv"> |
<div class="settings-box"> |
@@ -85,17 +100,19 @@ |
</div> |
<iron-collapse |
opened="[[prefs.settings.enable_quick_unlock_fingerprint.value]]"> |
- <div class="settings-box continuation" on-tap="onEditFingerprints_" |
- actionable> |
+ <div class="settings-box continuation"> |
<div class="start"> |
$i18n{lockScreenEditFingerprints} |
<div class="secondary" id="lockScreenEditFingerprintsSecondary"> |
[[getDescriptionText_(numFingerprints_)]] |
</div> |
</div> |
- <button class="subpage-arrow" is="paper-icon-button-light" |
+ <paper-button class="secondary-button" |
+ on-tap="onEditFingerprints_" |
aria-label="$i18n{lockScreenEditFingerprints}" |
- aria-describedby="lockScreenEditFingerprintsSecondary"></button> |
+ aria-descibedby="lockScreenEditFingerprintsSecondary"> |
+ $i18n{lockScreenSetupFingerprintButton} |
+ </paper-button> |
</div> |
</iron-collapse> |
</div> |