Files
overleaf-cep/services/web/app/views/user/setPassword.pug
T
Antoine Clausse 6eefe6dda4 [web] Create CIAM versions of the password reset screens (#30087)
* Make CIAM copies of Pug files

passwordResetCiam.pug
setPasswordCiam.pug

* Update controller with split test assignment

* Use CIAM layout in passwordResetCiam.pug

* Style passwordResetCiam according to designs

* Use CIAM layout in setPasswordCiam.pug

* Style setPasswordCiam according to designs

* Use settings value in registration screen for must_be_at_least_n_characters

* Retrieve email input with a script

* Replace mb-4 by --ds-spacing-800

* Add eye icon to toggle password visibility

* Avoid double dots after some translated strings

* Use `ciamCustomFormDangerMessage`

* Use `ciamErrorNotification`

* Use `ciamButtonContentLoading`

* Replace remaining "mb" classes

* Move new password errors to the top of the form

* Fix CIAM mixins path after rebase

* Use `ciamCustomFormDangerMessage`

* Add `data-ol-spinner-inflight` to buttons

* Replace classname ciam-notification by notification-ds

Remove borders from CIAM notifications
Fix font size

* Revert "Use settings value in registration screen for must_be_at_least_n_characters"

This reverts commit a0af95c11e171097750ad7ee871f6baf89d5c0cb.

(It's Friday afternoon so I don't want to update unrelated stuff :D)

* Update: check_your_inbox

* Remove `.ciam-card` min-height.

Unnecessary thanks to `.confirm-email-success-form`'s min-height: 400px;

* Use phosphor icons

* Style `formMessagesNewStyle` with DS notifications within CIAM pages

Alternatively, we could extend/duplicate `showMessagesNewStyle` with a CIAM variant

* Revert "Style `formMessagesNewStyle` with DS notifications within CIAM pages"

This reverts commit ed382dc1e8cdf5b916c1527f4da0a825167e9675.

* Fix styling of dynamically-created DS notifications

* Set password length info to secondary color

* Move `ciamSamlErrorNotLoggedIn` to saas-authentication module

Prevents errors in CE:

Error: ENOENT: no such file or directory, open '/overleaf/services/web/modules/saas-authentication/app/views/_mixins.pug'
    at /overleaf/services/web/app/views/_mixins/ciam_mixins.pug line 3

---------

Co-authored-by: Tim Down <158919+timdown@users.noreply.github.com>
GitOrigin-RevId: afe58f18ecee92460ab628a285b6edb48a5c678d
2025-12-09 09:05:31 +00:00

88 lines
3.3 KiB
Plaintext

extends ../layout-website-redesign
block vars
- var suppressNavbar = true
- var suppressFooter = true
- isWebsiteRedesign = true
block content
main#main-content
a.auth-aux-logo(href='/')
img(src=buildImgPath('ol-brand/overleaf-o-dark.svg') alt=settings.appName)
.auth-aux-container
form(
name='passwordResetForm'
data-ol-async-form
action='/user/password/set'
method='POST'
data-ol-hide-on-error='token-expired'
)
div(hidden data-ol-sent)
h1.h3.mb-3.mt-0 #{translate("password_updated")}
p.mb-4 #{translate("your_password_has_been_successfully_changed")}.
a.btn.btn-primary.w-100(href='/login') #{translate("log_in_now")}
div(data-ol-not-sent)
h1.h3.mb-3.mt-0 #{translate("reset_your_password")}
p(data-ol-hide-on-error-message='token-expired') #{translate("create_a_new_password_for_your_account")}.
+formMessagesNewStyle
+customFormMessageNewStyle('password-contains-email', 'danger')
| #{translate('invalid_password_contains_email')}
| #{translate('use_a_different_password')}.
+customFormMessageNewStyle('password-too-similar', 'danger')
| #{translate('invalid_password_too_similar')}
| #{translate('use_a_different_password')}.
+customFormMessageNewStyle('token-expired', 'danger')
| #{translate('password_reset_token_expired')}
br
a(href='/user/password/reset')
| #{translate('request_new_password_reset_email')}
input(name='_csrf' type='hidden' value=csrfToken)
input(name='email' type='text' hidden autocomplete='username' value=email)
.form-group.mb-3
label.form-label(
for='passwordField'
data-ol-hide-on-error-message='token-expired'
) #{translate("new_password")}
input#passwordField.form-control.auth-aux-new-password(
name='password'
type='password'
autocomplete='new-password'
autofocus
required
minlength=settings.passwordStrengthOptions.length.min
)
+customValidationMessageNewStyle('invalid-password')
| #{translate('invalid_password')}.
+customValidationMessageNewStyle('password-must-be-different')
| #{translate('password_cant_be_the_same_as_current_one')}.
+customValidationMessageNewStyle('password-must-be-strong')
| !{translate('password_was_detected_on_a_public_list_of_known_compromised_passwords', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}])}
| #{translate('use_a_different_password')}.
input(name='passwordResetToken' type='hidden' value=passwordResetToken)
div(data-ol-hide-on-error-message='token-expired')
div #{translate('in_order_to_have_a_secure_account_make_sure_your_password')}
ul.mb-3.ps-4
li #{translate('is_longer_than_n_characters', {n: settings.passwordStrengthOptions.length.min})}
li #{translate('does_not_contain_or_significantly_match_your_email')}
li #{translate('is_not_used_on_any_other_website')}
.actions
button.btn.btn-primary.w-100(
type='submit'
data-ol-disabled-inflight
aria-label=translate('set_new_password')
)
span(data-ol-inflight='idle')
| #{translate('set_new_password')}
span(hidden data-ol-inflight='pending')
| #{translate('set_new_password')}…