Modal windows display content that blocks interaction from the main window, to focus the user on a specific task.

Open Modal

Sass Configuration:

Name Type Default Description
$modal-mask-bg Color rgba(0,0,0,0.4) Set modal mask background
$modal-bg Color $root-background-color Set modal background
$modal-radius Boolean true Set modal radius

Example Code:

<div id="modalWindow" class="modal">
    <div class="modal-content">
        <span class="modal-close">x</span>
        <p>Modal content goes here</p>
    </div>
</div>