Modal components, styled and mobile-first
This addon requires the following addons be installed:
ember install ember-cli-sass ember install ember-screen ember install ember-cli-ted-bootstrap ember install ember-modal-dialog
ember install ember-ted-modals
Then, import the styles into your app.scss
:
// app.scss @import 'ember-ted-modals/structure'; @import 'ember-ted-modals/styles';
{{#if isShowingModal}}
{{#ted-modal close='toggleIsShowingModal'}}
{{ted-modal-header title='Present stage' close='toggleIsShowingModal'}}
{{#ted-modal-body}}
<p>Would you like to present the stage on this device?</p>
<p>If you do, you can get back here by pressing the Back button.</p>
{{/ted-modal-body}}
{{#ted-modal-footer}}
<a href="#" {{action 'toggleIsShowingModal'}} class='btn btn-link'>Cancel</a>
<a href="#" {{action 'presentStage'}} class='btn btn-primary pull-right'>Present stage</a>
{{/ted-modal-footer}}
{{/ted-modal}}
{{/if}}