Modal component

            <button class="modal primary" data-toggle="#modal">Demo modal</button>
 
            <div class="col-2 modal" id="modal">
                <div class="content">
                    <h2 class="header">
                        <button class="close" data-toggle="close">×</button>
                        Modal header
                    </h2>
                    <div class="body">Content</div>
                    <div class="footer">Footer content</div>
                </div>
            </div>
 

Usage

the modal component required the content CSS class to be set on the modal content. header CSS class for designing the modal header. body CSS class for designing the modal body. footer CSS class for designing the modal footer.

The button with close CSS class, is used to display the cross for close modal, but click in outside modal close the modal.