unify user preferences views

This commit is contained in:
Maja Komel 2018-06-28 22:14:04 +02:00 committed by Sam
parent 55a963252d
commit 3ddfc12307
7 changed files with 91 additions and 82 deletions

View File

@ -1,4 +1,4 @@
<section class='user-right user-preferences'>
<section class='user-preferences'>
<form class="form-horizontal">
<div class="control-group">
@ -9,20 +9,22 @@
{{#if success}}
<div class="control-group">
<div class="instructions">
<p>
{{#if model.staff}}
{{i18n 'user.change_email.success_staff'}}
{{else}}
{{i18n 'user.change_email.success'}}
{{/if}}
</p>
<div class="controls">
<div class="instructions">
<p>
{{#if model.staff}}
{{i18n 'user.change_email.success_staff'}}
{{else}}
{{i18n 'user.change_email.success'}}
{{/if}}
</p>
</div>
</div>
</div>
{{else}}
{{#if error}}
<div class="control-group">
<div class="instructions">
<div class="controls">
<div class='alert alert-error'>{{errorMessage}}</div>
</div>
</div>
@ -34,12 +36,14 @@
{{text-field value=newEmail id="change-email" classNames="input-xxlarge" autofocus="autofocus"}}
{{input-tip validation=emailValidation}}
</div>
<div class='instructions'>
{{#if taken}}
{{i18n 'user.change_email.taken'}}
{{else}}
{{i18n 'user.email.instructions'}}
{{/if}}
<div class="controls">
<div class='instructions'>
{{#if taken}}
{{i18n 'user.change_email.taken'}}
{{else}}
{{i18n 'user.email.instructions'}}
{{/if}}
</div>
</div>
</div>

View File

@ -1,61 +1,74 @@
<section class="user-content user-preferences second-factor-backup-preferences">
<section class="user-preferences second-factor-backup-preferences">
<form class="form-horizontal">
<h2>{{i18n "user.second_factor_backup.title"}}</h2>
{{#if successMessage}}
<div class="alert alert-success">
{{successMessage}}
<div class="control-group">
<div class="controls">
<h3>{{i18n "user.second_factor_backup.title"}}</h3>
</div>
{{/if}}
<div class="controls">
{{#if successMessage}}
<div class="alert alert-success">
{{successMessage}}
</div>
{{/if}}
{{#if errorMessage}}
<div class="alert alert-error">
{{errorMessage}}
</div>
{{/if}}
<div class="second-factor-form">
{{second-factor-input
value=secondFactorToken
maxlength=6
inputId="second-factor-token"}}
<div class="actions">
{{d-button
action="generateSecondFactorCodes"
class="btn btn-primary"
disabled=isDisabledGenerateBackupCodeBtn
label=generateBackupCodeBtnLabel}}
{{#if backupEnabled}}
{{d-button
action="disableSecondFactorBackup"
class="btn btn-danger"
disabled=isDisabledDisableBackupCodeBtn
label="user.second_factor_backup.disable"}}
{{#if errorMessage}}
<div class="alert alert-error">
{{errorMessage}}
</div>
{{/if}}
</div>
</div>
<div class="instructions">
{{i18n "user.second_factor.disable_description"}}
<label class='control-label'>{{i18n 'user.second_factor.label'}}</label>
<div class="control-group">
<div class="controls">
{{second-factor-input
value=secondFactorToken
maxlength=6
inputId="second-factor-token"}}
<div class='instructions'>
{{i18n "user.second_factor.disable_description"}}
</div>
</div>
</div>
{{#conditional-loading-section isLoading=loading}}
{{#if backupCodes}}
<h3>{{i18n "user.second_factor_backup.codes.title"}}</h3>
<div class="control-group">
<div class="controls">
<div class="actions">
{{d-button
action="generateSecondFactorCodes"
class="btn btn-primary"
disabled=isDisabledGenerateBackupCodeBtn
label=generateBackupCodeBtnLabel}}
{{#if backupEnabled}}
{{d-button
action="disableSecondFactorBackup"
class="btn btn-danger"
disabled=isDisabledDisableBackupCodeBtn
label="user.second_factor_backup.disable"}}
{{/if}}
</div>
<p>
{{i18n "user.second_factor_backup.codes.description"}}
</p>
{{#conditional-loading-section isLoading=loading}}
{{#if backupCodes}}
<h3>{{i18n "user.second_factor_backup.codes.title"}}</h3>
{{backup-codes
copyBackupCode=(action "copyBackupCode")
backupCodes=backupCodes}}
{{/if}}
{{/conditional-loading-section}}
<p>
{{i18n "user.second_factor_backup.codes.description"}}
</p>
{{#link-to "preferences.account" model.username}}
{{i18n "go_back"}}
{{/link-to}}
{{backup-codes
copyBackupCode=(action "copyBackupCode")
backupCodes=backupCodes}}
{{#link-to "preferences.account" model.username}}
{{i18n "go_back"}}
{{/link-to}}
{{/if}}
{{/conditional-loading-section}}
</div>
</div>
</form>
</section>

View File

@ -1,5 +1,6 @@
<section class='user-content user-preferences'>
<section class='user-preferences'>
<form class="form-horizontal">
<div class="control-group">
<div class="controls">
<h3>{{i18n 'user.second_factor.title'}}</h3>
@ -8,7 +9,7 @@
{{#if errorMessage}}
<div class="control-group">
<div class="instructions">
<div class="controls">
<div class='alert alert-error'>{{errorMessage}}</div>
</div>
</div>
@ -22,7 +23,7 @@
{{second-factor-input value=secondFactorToken inputId='second-factor-token'}}
</div>
<div class='instructions'>
<div class='instructions controls'>
{{i18n 'user.second_factor.disable_description'}}
</div>
</div>
@ -97,7 +98,7 @@
autofocus="autofocus"}}
</div>
<div class='instructions'>
<div class='instructions controls'>
{{i18n 'user.second_factor.confirm_password_description'}}
</div>
</div>

View File

@ -1,4 +1,4 @@
<section class='user-content'>
<section class='user-preferences'>
<form class="form-horizontal">
<div class="control-group">
@ -14,10 +14,10 @@
</div>
<div class='instructions controls'>
<p>
{{#if taken}}
{{i18n 'user.change_username.taken'}}
{{/if}}
<span>{{errorMessage}}</span>
{{#if taken}}
{{i18n 'user.change_username.taken'}}
{{/if}}
<span>{{errorMessage}}</span>
</p>
</div>
</div>

View File

@ -563,11 +563,6 @@
margin-right: 10px;
}
.second-factor-form {
display: flex;
align-items: center;
}
.form-horizontal .instructions {
margin-left: 0;
}

View File

@ -292,10 +292,6 @@
margin-top: 0;
}
.form-horizontal .instructions {
margin-left: 8px;
}
.pref-mailing-list-mode .controls {
select {
width: 400px;

View File

@ -125,7 +125,7 @@ QUnit.test("second factor", assert => {
});
fillIn("#password", "secrets");
click(".user-content .btn-primary");
click(".user-preferences .btn-primary");
andThen(() => {
assert.ok(exists("#test-qr"), "shows qr code");
@ -156,7 +156,7 @@ QUnit.test("second factor backup", assert => {
});
fillIn("#second-factor-token", "111111");
click(".second-factor-form .btn-primary");
click(".user-preferences .btn-primary");
andThen(() => {
assert.ok(exists(".backup-codes-area"), "shows backup codes");