setPassword.pug 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. extends ../layout-marketing
  2. block content
  3. main.content.content-alt#main-content
  4. .container-custom-sm.mx-auto
  5. .card
  6. form(
  7. data-ol-async-form,
  8. name="passwordResetForm",
  9. action="/user/password/set",
  10. method="POST",
  11. data-ol-hide-on-error="token-expired"
  12. )
  13. div(
  14. hidden
  15. data-ol-sent
  16. )
  17. h3.mt-0.mb-2 #{translate("password_updated")}
  18. p.mb-4 #{translate("your_password_has_been_successfully_changed")}.
  19. a(href='/login') #{translate("log_in_now")}
  20. div(data-ol-not-sent)
  21. h3.mt-0.mb-2 #{translate("reset_your_password")}
  22. p(data-ol-hide-on-error-message="token-expired") #{translate("create_a_new_password_for_your_account")}.
  23. +formMessages()
  24. +customFormMessage('token-expired', 'danger')
  25. | #{translate('password_reset_token_expired')}
  26. br
  27. a(href="/user/password/reset")
  28. | #{translate('request_new_password_reset_email')}
  29. input(type="hidden", name="_csrf", value=csrfToken)
  30. input(type="hidden", name="email", value=email)
  31. .form-group
  32. label(for='passwordField', data-ol-hide-on-error-message="token-expired") #{translate("new_password")}
  33. input.form-control#passwordField(
  34. type='password',
  35. name='password',
  36. placeholder=translate("enter_your_new_password"),
  37. autocomplete="new-password",
  38. autofocus,
  39. required,
  40. minlength=settings.passwordStrengthOptions.length.min
  41. )
  42. +customValidationMessage('invalid-password')
  43. | #{translate('invalid_password')}
  44. +customValidationMessage('password-must-be-different')
  45. | #{translate('password_cant_be_the_same_as_current_one')}.
  46. +customValidationMessage('password-must-be-strong')
  47. | !{translate('password_was_detected_on_a_public_list_of_known_compromised_passwords', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com', rel: 'noopener noreferrer', target: '_blank'}}])}.
  48. | #{translate('use_a_different_password')}.
  49. input(
  50. type="hidden",
  51. name="passwordResetToken",
  52. value=passwordResetToken
  53. )
  54. div(data-ol-hide-on-error-message="token-expired")
  55. div #{translate('in_order_to_have_a_secure_account_make_sure_your_password')}
  56. ul.mb-4.ps-4
  57. li #{translate('is_longer_than_n_characters', {n: settings.passwordStrengthOptions.length.min})}
  58. li #{translate('does_not_contain_or_significantly_match_your_email')}
  59. li #{translate('is_not_used_on_any_other_website')}
  60. .actions
  61. button.btn.btn-primary.w-100(
  62. type='submit',
  63. data-ol-disabled-inflight
  64. aria-label=translate('set_new_password')
  65. )
  66. span(data-ol-inflight="idle")
  67. | #{translate('set_new_password')}
  68. span(hidden data-ol-inflight="pending")
  69. | #{translate('set_new_password')}…