Heads Up! Components & docs are subject to change until official v1.0 release.
×
Introduction:
Components:
Resources:
Modals
Working with modals is super simple. Create your modal markup and then trigger the event with a button.
Modal Title
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias dolore, aliquam nesciunt praesentium nemo amet laudantium voluptatem, libero consectetur doloribus blanditiis sint asperiores provident sequi minus atque, vitae minima tenetur!
Login
<button class="btn btn-default" data-modal="#test">Modal Powers Activate!!!</button>
<div id="test" class="modal__outer">
<div class="modal">
<div class="modal__header">
<strong>Modal Title</strong>
</div>
<div class="modal__content">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias dolore, aliquam nesciunt praesentium nemo amet laudantium voluptatem, libero consectetur doloribus blanditiis sint asperiores provident sequi minus atque, vitae minima tenetur!</div>
<div class="modal__footer">
<div class="pull-right">
<button class="btn btn-default" data-modal-close="#test">Cancel</button>
<button class="btn btn-primary">Submit</button>
</div>
</div>
<div class="modal__close" data-modal-close="#test"><i class="fa fa-times" aria-hidden="true"></i></div>
</div>
</div>