* feat: add a first version of the confirmation page - still a wip * feat: style the modal properly * chore: update the text * chore: update from master * fix: add the correct text and layout for the feature flagged confirmation email * feat: use the view_class functionality to assign some css styling to the confirmations class * feat: add the Forem background * feat: add some styling to "Click Here" * feat: polish styles * feat: the padding will be used for mobile * chore: some blank lines * feat: add some more styles * feat; use media queries * feat: add a callback to the modal * feat: handle all javascript on the confirmation form * feat: change back to a button * feat; change from button to span for accessibility * feat: add the callback in an if condition * feat: add a main-content * feat: update the confirmation page html * feat: add Cypress test * minimal seeded flows * fix: rename the file * feat: update confirm email spec * fix: remove mistake * refactor: rename the files appropriately * feat: change some text * fix: typo * fix: update as per suggestions
35 lines
1 KiB
JavaScript
35 lines
1 KiB
JavaScript
function showConfirmationEmailModal() {
|
|
window.Forem.showModal({
|
|
title: "Didn't get the email?",
|
|
contentSelector: '#confirm-email-modal',
|
|
overlay: true,
|
|
onOpen: attachHandlers,
|
|
});
|
|
}
|
|
|
|
function attachHandlers() {
|
|
const dismissModalButtons =
|
|
document.getElementsByClassName('js-dismiss-button');
|
|
|
|
// With the nature of how the modals are implemented,
|
|
// it duplicates the content of #confirm-email-modal and
|
|
// adds it to the window within #window-modal. This means
|
|
// that there are two of the same elements in the DOM,
|
|
// hence we use the last one that is added to the DOM.
|
|
if (dismissModalButtons.length > 1) {
|
|
dismissModalButtons[1].addEventListener(
|
|
'click',
|
|
hideConfirmationEmailModal,
|
|
);
|
|
}
|
|
}
|
|
|
|
function hideConfirmationEmailModal(event) {
|
|
event.preventDefault();
|
|
window.Forem.closeModal();
|
|
}
|
|
|
|
const confirmationButton = document.getElementsByClassName(
|
|
'js-confirmation-button',
|
|
)[0];
|
|
confirmationButton.addEventListener('click', showConfirmationEmailModal);
|