<div id="modal-container" {{action bubbles=false preventDefault=false}}> <article {{bind-attr class="klass :js-modal"}}> <section class="modal-content"> {{#if title}}<header class="modal-header"><h1>{{title}}</h1></header>{{/if}} {{#if showClose}}<a class="close" href="" title="Close" {{action "closeModal"}}><span class="hidden">Close</span></a>{{/if}} <section class="modal-body"> {{yield}} </section> {{#if confirm}} <footer class="modal-footer"> <button type="button" {{bind-attr class="acceptButtonClass :js-button-accept"}} {{action "confirm" "accept"}}> {{confirm.accept.text}} </button> <button type="button" {{bind-attr class="rejectButtonClass :js-button-reject"}} {{action "confirm" "reject"}}> {{confirm.reject.text}} </button> </footer> {{/if}} </section> </article> </div> <div class="modal-background fade" {{action "closeModal"}}></div>