Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(2788)

Unified Diff: chrome/browser/resources/settings/people_page/lock_screen.html

Issue 2841313002: md settings: Update lock screen to match new mocks. (Closed)
Patch Set: Rebased. Created 3 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
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 6d7baf4e4e6a573f430703a6c108e364ad689c6c..daca74236f0379607b92ce9e73911f51e9e742ba 100644
--- a/chrome/browser/resources/settings/people_page/lock_screen.html
+++ b/chrome/browser/resources/settings/people_page/lock_screen.html
@@ -21,67 +21,86 @@
<dom-module id="settings-lock-screen">
<template>
- <style include="settings-shared action-link">
+ <style include="settings-shared">
#easyUnlock .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.
+ */
padding: 11px 0;
}
+ #lockOptionsDiv {
+ display: block;
+ }
+
paper-radio-button {
--paper-radio-button-label: {
display: flex;
+ line-height: 154%; /* Apply 20px line-height to paper radio button
+ text to match rest of settings line-heights. */
width: 100%;
};
}
- paper-radio-button > .start {
- flex: 1;
+ #pinPasswordDiv,
+ #pinPasswordSecondaryActionDiv {
+ margin: auto;
}
</style>
<div>
- <template is="dom-if" if="[[quickUnlockEnabled_]]">
- <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>
- </template>
-
- <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>
+ <template is="dom-if" if="[[quickUnlockEnabled_]]">
+ <div id="lockOptionsDiv">
+ <div class="settings-box">
+ <h2>$i18n{lockScreenOptions}</h2>
+ </div>
+ <div class="list-frame">
+ <paper-radio-group id="unlockType"
+ selected="{{selectedUnlockType}}">
+ <paper-radio-button name="password" class="list-item underbar">
+ <div class="start">
+ $i18n{lockScreenPasswordOnly}
+ <div class="secondary">
+ $i18n{lockScreenHighSecurity}
+ </div>
+ </div>
+ </paper-radio-button>
+ <paper-radio-button name="pin+password"
+ class="list-item underbar">
+ <div id="pinPasswordDiv" class="start">
+ $i18n{lockScreenPinOrPassword}
+ <div class="secondary">
+ $i18n{lockScreenMediumSecurity}
+ </div>
+ </div>
+ <template is="dom-if"
+ if="[[showConfigurePinButton_(selectedUnlockType)]]">
+ <div class="separator"></div>
+ <div id="pinPasswordSecondaryActionDiv"
+ class="secondary-action">
+ <paper-button id="setupPinButton" class="secondary-button"
+ on-tap="onConfigurePin_">
+ [[getSetupPinText_(hasPin)]]
+ </paper-button>
+ </div>
+ </template>
+ </paper-radio-button>
+ </paper-radio-group>
+ </div>
+ </div>
+ </template>
+
<template is="dom-if" if="[[fingerprintUnlockEnabled_]]">
<div id="fingerprintDiv">
- <div class="settings-box">
+ <div class="settings-box continuation">
<settings-toggle-button class="start"
pref="{{prefs.settings.enable_quick_unlock_fingerprint}}"
label="$i18n{lockScreenFingerprintEnable}">
@@ -89,24 +108,29 @@
</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"
- aria-label="$i18n{lockScreenEditFingerprints}"
- aria-describedby="lockScreenEditFingerprintsSecondary"></button>
+ <div class="separator"></div>
+ <div class="secondary-action">
+ <paper-button class="secondary-button"
+ on-tap="onEditFingerprints_"
+ aria-label="$i18n{lockScreenEditFingerprints}"
+ aria-descibedby="lockScreenEditFingerprintsSecondary">
+ $i18n{lockScreenSetupFingerprintButton}
+ </paper-button>
+ </div>
</div>
</iron-collapse>
</div>
</template>
<template is="dom-if" if="[[easyUnlockAllowed_]]">
- <div id="easyUnlock" class="settings-box two-line">
+ <div id="easyUnlock" class="settings-box two-line continuation">
<div class="start">
<div>$i18n{easyUnlockSectionTitle}</div>
<div class="secondary">

Powered by Google App Engine
This is Rietveld 408576698