Skip to content

3.8.0

Compare
Choose a tag to compare
@danielmatthew danielmatthew released this 06 Oct 11:21
· 21 commits to master since this release

The Confirmation Dialog[ue] Release

image

The modal is dead; long live the modal!

Until we phase out the old-style modals, apply .o-confirmation-modal to your .modal. Don't forget to add a whizzy .modal-image to the top of the display. If you can reference those supplied with Bootstrap, more power to you.

<div class="modal o-confirmation-modal fade" id="confirmation-modal" tabindex="-1" role="dialog" aria-labelledby="confirmation-label" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <img src="assets/img/discard.svg" class="modal-image" alt="" width="149" height="158" />
      <div class="modal-header">
        <h2 class="modal-title" id="confirmation-label">Are you sure?</h2>
      </div>
      <div class="modal-body">
        <p>
          You will lose your unsaved data.
        </p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-lg btn-danger" data-bs-dismiss="modal">
          Yes
        </button>
        <button type="button" class="btn btn-lg btn-default">
          Cancel
        </button>
      </div>
    </div>
    <!-- /.modal-content -->
  </div>
  <!-- /.modal-dialog -->
</div>