diff options
author | ThibG <thib@sitedethib.com> | 2020-08-11 23:09:13 +0200 |
---|---|---|
committer | Starfall <us@starfall.systems> | 2020-08-25 13:37:11 -0500 |
commit | 77df7aa6d6ddd638f539e6a48f7196d59a809e74 (patch) | |
tree | 0f5ffdade2b80b8c1596119669fe852fd6220c64 /app/javascript/flavours | |
parent | 1bf109bc7c722114b7db27c1a0bc1ad322f30c2d (diff) |
[Glitch] Add HTML form validation for the registration form
Port d70c3ab4c39e642d41138ab693af77dd6c258e8c to glitch-soc Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours')
-rw-r--r-- | app/javascript/flavours/glitch/packs/public.js | 10 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/forms.scss | 3 |
2 files changed, 12 insertions, 1 deletions
diff --git a/app/javascript/flavours/glitch/packs/public.js b/app/javascript/flavours/glitch/packs/public.js index 58febcf5b..8168e87da 100644 --- a/app/javascript/flavours/glitch/packs/public.js +++ b/app/javascript/flavours/glitch/packs/public.js @@ -95,6 +95,16 @@ function main() { new Rellax('.parallax', { speed: -1 }); } + delegate(document, '#registration_user_password_confirmation,#registration_user_password', 'input', () => { + const password = document.getElementById('registration_user_password'); + const confirmation = document.getElementById('registration_user_password_confirmation'); + if (password.value && password.value !== confirmation.value) { + confirmation.setCustomValidity((new IntlMessageFormat(messages['password_confirmation.mismatching'] || 'Password confirmation does not match', locale)).format()); + } else { + confirmation.setCustomValidity(''); + } + }); + delegate(document, '.custom-emoji', 'mouseover', getEmojiAnimationHandler('data-original')); delegate(document, '.custom-emoji', 'mouseout', getEmojiAnimationHandler('data-static')); diff --git a/app/javascript/flavours/glitch/styles/forms.scss b/app/javascript/flavours/glitch/styles/forms.scss index 726da1da7..917b5c873 100644 --- a/app/javascript/flavours/glitch/styles/forms.scss +++ b/app/javascript/flavours/glitch/styles/forms.scss @@ -349,7 +349,8 @@ code { box-shadow: none; } - &:focus:invalid:not(:placeholder-shown) { + &:focus:invalid:not(:placeholder-shown), + &:required:invalid:not(:placeholder-shown) { border-color: lighten($error-red, 12%); } |