Modal
A modal is a dialog that presents users with information, messages. A modal appears on top of the web app's content and must be manually dismissed before user can resume interacting with the app.
Demo
Modal Heading!
Modal text description.
HTML
<div class="container modal" id="modal-container">
<div class="container-title">Modal Heading!</div>
<div class="container-content">Modal text description.</div>
<div class="container-footer">
<button class="btn btn-full-width" onclick="closeModal()">Dismiss</button>
</div></div>
JS
const showModal = () => document.getElementById("modal-container").style.display="unset";
const closeModal = () => document.getElementById("modal-container").style.display = "none";