Skip to content
This repository has been archived by the owner on Jan 2, 2020. It is now read-only.

Commit

Permalink
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[#932] Adds images in account recovery flow
Browse files Browse the repository at this point in the history
Anike Arni authored and tayanefernandes committed Mar 29, 2017
1 parent 7f2e4f9 commit 2e54d52
Showing 7 changed files with 110 additions and 6 deletions.
39 changes: 39 additions & 0 deletions web-ui/app/images/account-recovery/admins_contact.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
37 changes: 37 additions & 0 deletions web-ui/app/images/account-recovery/codes.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -24,13 +24,17 @@ import SubmitButton from 'src/common/submit_button/submit_button';
import './forms.scss';

export const AdminRecoveryCodeForm = ({ t, next }) => (
<form className='admin-code-form' onSubmit={next}>
<form className='account-recovery-form admin-code' onSubmit={next}>
<img
className='account-recovery-progress'
src='/public/images/account-recovery/step_1.svg'
alt={t('account-recovery.admin-form.image-description')}
/>
<h1>{t('account-recovery.admin-form.title')}</h1>
<img
src='/public/images/account-recovery/admins_contact.svg'
alt=''
/>
<ul>
<li>{t('account-recovery.admin-form.tip1')}</li>
<li>{t('account-recovery.admin-form.tip2')}</li>
20 changes: 20 additions & 0 deletions web-ui/src/account_recovery/forms/forms.scss
Original file line number Diff line number Diff line change
@@ -18,3 +18,23 @@
.account-recovery-progress {
width: 100%;
}

.account-recovery-form {
display: flex;
flex-direction: column;

img {
margin: 7px 0;
align-self: center;
}

.input-field-group {
margin-top: 0;
}
}

.new-password {
.input-field-group:first-of-type {
margin-bottom: 0;
}
}
2 changes: 1 addition & 1 deletion web-ui/src/account_recovery/forms/new_password_form.js
Original file line number Diff line number Diff line change
@@ -23,7 +23,7 @@ import SubmitButton from 'src/common/submit_button/submit_button';
import BackLink from 'src/common/back_link/back_link';

export const NewPasswordForm = ({ t, previous }) => (
<form>
<form className='account-recovery-form new-password'>
<img
className='account-recovery-progress'
src='/public/images/account-recovery/step_3.svg'
6 changes: 5 additions & 1 deletion web-ui/src/account_recovery/forms/user_recovery_code_form.js
Original file line number Diff line number Diff line change
@@ -25,13 +25,17 @@ import BackLink from 'src/common/back_link/back_link';
import './forms.scss';

export const UserRecoveryCodeForm = ({ t, previous, next }) => (
<form className='user-code-form' onSubmit={next}>
<form className='account-recovery-form user-code' onSubmit={next}>
<img
className='account-recovery-progress'
src='/public/images/account-recovery/step_2.svg'
alt={t('account-recovery.user-form.image-description')}
/>
<h1>{t('account-recovery.user-form.title')}</h1>
<img
src='/public/images/account-recovery/codes.svg'
alt=''
/>
<p>{t('account-recovery.user-form.description')}</p>
<InputField name='admin-code' label={t('account-recovery.user-form.input-label')} />
<SubmitButton buttonText={t('account-recovery.user-form.button')} />
6 changes: 3 additions & 3 deletions web-ui/test/integration/translations.spec.js
Original file line number Diff line number Diff line change
@@ -16,15 +16,15 @@ describe('Translations', () => {

it('translates all keys on second step', () => {
const app = mount(<App i18n={testI18n} child={<AccountRecoveryPage />} />);
app.find('form.admin-code-form').simulate('submit');
app.find('form.admin-code').simulate('submit');

expect(app.text()).toNotContain('untranslated', 'Unstranslated message found in the text: ' + app.text());
});

it('translates all keys on third step', () => {
const app = mount(<App i18n={testI18n} child={<AccountRecoveryPage />} />);
app.find('form.admin-code-form').simulate('submit');
app.find('form.user-code-form').simulate('submit');
app.find('form.admin-code').simulate('submit');
app.find('form.user-code').simulate('submit');

expect(app.text()).toNotContain('untranslated', 'Unstranslated message found in the text: ' + app.text());
});

0 comments on commit 2e54d52

Please sign in to comment.