styling for alert

This commit is contained in:
imohkay 2021-10-28 16:58:52 +05:30
parent 2362fd74d8
commit 0795cd3b95
3 changed files with 13 additions and 2 deletions

View file

@ -103,8 +103,18 @@
display: block; display: block;
} }
} }
.alert {
@media screen and (min-width: 800px) {
width: 50%;
}
}
} }
.accordion-checkbox:checked + .accordion-content { .accordion-checkbox:checked + .accordion-content {
display: block; display: block;
} }
.alert {
padding: var(--spacing) 0;
}

View file

@ -48,6 +48,7 @@
display: block; display: block;
background-size: 400% 100%; background-size: 400% 100%;
animation: background_animation 60s ease-in-out infinite, text_animation 60s ease-in-out infinite; animation: background_animation 60s ease-in-out infinite, text_animation 60s ease-in-out infinite;
cursor: pointer;
} }
} }

View file

@ -53,5 +53,5 @@ document.getElementById('contact-form').addEventListener('submit', async functio
success = false success = false
} }
const thanksMsg = success ? 'Thanks for your message 謝謝您的訊息' : 'Failed to send message. Try again later.' const thanksMsg = success ? 'Thanks for your message 謝謝您的訊息' : 'Failed to send message. Try again later.'
document.getElementById('contact-container').innerHTML = thanksMsg document.getElementById('contact-container').innerHTML = `<div class="alert">${thanksMsg}</div>`
}) })