1 files changed, 17 insertions, 3 deletions
diff --git a/web-ui/src/account_recovery/forms/user_recovery_code_form.js b/web-ui/src/account_recovery/forms/user_recovery_code_form.js
index aaefd75d..30525cdf 100644
--- a/web-ui/src/account_recovery/forms/user_recovery_code_form.js
+++ b/web-ui/src/account_recovery/forms/user_recovery_code_form.js
@@ -20,25 +20,39 @@ import { translate } from 'react-i18next';
 
 import InputField from 'src/common/input_field/input_field';
 import SubmitButton from 'src/common/submit_button/submit_button';
+import BackLink from 'src/common/back_link/back_link';
 
 import './forms.scss';
 
-export const UserRecoveryCodeForm = ({ t, next }) => (
-  <form className='user-code-form' onSubmit={next}>
+export const UserRecoveryCodeForm = ({ t, previous, 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>
-    <p>{t('account-recovery.user-form.description')}</p>
+    <div className='user-code-form-content'>
+      <img
+        className='user-codes-image'
+        src='/public/images/account-recovery/codes.svg'
+        alt=''
+      />
+      <p>{t('account-recovery.user-form.description')}</p>
+    </div>
     <InputField name='admin-code' label={t('account-recovery.user-form.input-label')} />
     <SubmitButton buttonText={t('account-recovery.user-form.button')} />
+    <BackLink
+      text={t('account-recovery.back')}
+      onClick={previous} onKeyDown={previous}
+      role='button'
+    />
   </form>
 );
 
 UserRecoveryCodeForm.propTypes = {
   t: React.PropTypes.func.isRequired,
+  previous: React.PropTypes.func.isRequired,
   next: React.PropTypes.func.isRequired
 };