adrian/contact-mailer
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Update index.js and style.css

Browse Source
This commit is contained in:
Elisa 2020-08-27 14:51:36 +02:00
parent 9a50223464
commit e6a699be6e
2 changed files with 36 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
client/index.js
View File

@ -7,9 +7,19 @@ function jeanCloudContactMailerMessage (messageContainer, theme, level, text) {
messageElement.classList.add('contact-mailer-message')
messageElement.classList.add(messageId)
messageElement.id = messageId
messageElement.title = 'Cliquer pour fermer'
/*messageElement.title = 'Cliquer pour fermer'
messageElement.onclick = () => {
messageElement.parentNode.removeChild(messageElement)
}*/
/*add close button to the alert message*/
const closeButtonElement = document.createElement('span')
messageElement.appendChild(closeButtonElement)
closeButtonElement.textContent = "×"
closeButtonElement.classList.add('contact-mailer-message-close-button')
closeButtonElement.title = 'Cliquer pour fermer'
closeButtonElement.onclick = () => {
messageElement.parentNode.removeChild(messageElement)
}
/* Jump to message */
@ -46,7 +56,7 @@ function jeanCloudContactFormIntercept (formId, theme) {
const submitButton = formElem.querySelector('[type="submit"]')
const loadingText = document.createElement('span')
loadingText.classList.add(".contact-mailer-sending");
loadingText.textContent = ' Envoi en cours…'
loadingText.textContent = 'Envoi en cours…'
submitButton.after(loadingText)
/* XHR */
fetch(formElem.action, {

26
client/style.css
View File

@ -2,11 +2,18 @@
}
.contact-mailer-message-container {
position: fixed;
right: 0;
bottom: 0;
width: 20%;
}
.contact-mailer-message {
border: 1px solid;
padding: 2px 8px;
padding: 15px 10px;
border-radius: 2px;
cursor:pointer;
position: relative;
}
.contact-mailer-plain-message-error {
@ -36,3 +43,18 @@
.contact-mailer-sending {
padding: 5px 10px;
}
.contact-mailer-message-close-button {
position: absolute;
right: 0;
top: 0;
line-height: 55px;
font-size: 60px;
height: 60px;
width: 60px;
border-left: 1px solid currentColor;
padding: 5px 10px;
text-align: center;
cursor: pointer;
}