JSFiddle - React, Tailwind, and code Playground

by dumptyd

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.1/css/bulma.min.css">
<div class="modal is-active">
  <div class="modal-background"></div>
  <div class="modal-card">
    <header class="modal-card-head">
      <p class="modal-card-title">Modal title</p>
      <button class="delete" aria-label="close"></button>
    </header>
    <section class="modal-card-body">
      <!-- Content ... -->
    </section>
    <footer class="modal-card-foot">
      <div>
        <button class="button is-success">Save changes</button>
        <button class="button flex-right">Reset changes</button>
      </div>
      <div>
        <button class="button flex-right">Cancel</button>
      </div>
    </footer>
  </div>
</div>

CSS

.modal-card-foot {
  justify-content: space-between;
}