tqt/Ghost-Admin
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost-Admin.git synced 2023-12-14 02:33:04 +01:00
Code Issues Releases Wiki Activity
Ghost-Admin/app/components/gh-modal-dialog.hbs

19 lines
1.1 KiB
Handlebars
Raw Normal View History

Refactor component styles Continues on from #4401 - Reformats the Sass to match our new style (property order, comments, & white space) - Changes the modal container to a class from an ID (and adjust tests)
2014-11-13 12:27:45 +01:00
<div class="modal-container js-modal-container" {{action "closeModal"}}>
Ember 1.11.1 - remove `bind-attr` all over the place
2015-04-01 18:01:38 +02:00
<article class="{{klass}} js-modal">
Use an explicit action name in action helper No Issue - Clicking on the body of a modal dialog causes an unhandled exception in the console. Add an explicit action name to the helper.
2014-12-26 03:26:55 +01:00
<section class="modal-content" {{action "noBubble" bubbles=false preventDefault=false}}>
Creates Ember Modal infastructure resolves #2416 This is a pretty large commit but what it's adding are pretty fundamental to the admin app. - Creates top level actions on the ApplicationRoute for opening and closing modals. This allows sending the 'openModal' action from any template to open a modal. - Every modal template lives in 'templates/modals/{{modalName}}' - Each modal can have a backing controller of the same name that can provide additional control for that modal. Those controllers reside in 'controllers/modals/{{modalName}}' - Created the ModalDialog component which is where all the logic for the component resides. It's not at 100% parity with the existing Ghost modal system but it has the foundation for further fleshing out. It currently accepts parameters for styling how the modal should appear, which previously was defined in JS files in the Backbone admin. - This creates the 'delete all posts', 'delete this post', 'markdown', and 'upload' modal. Some are in more stages of completion than others, but I wanted to just get the foundation in place as fast as possible. - This also creates the UploadModal component which is a subclass of the ModalDialog component. The reason for this subclassing is that the UploadModal component directly accesses the DOM and when that occurs in Ember it should remain in a component definition. It's ready for extending to reach parity. Note: depending on needs the base ModalDialog class may need to be modified.
2014-03-31 06:07:05 +02:00
{{#if title}}<header class="modal-header"><h1>{{title}}</h1></header>{{/if}}
Swap out ember-inline-svg for ember-svg-jar (#970) closes TryGhost/Ghost#9506
2018-03-19 10:57:31 +01:00
{{#if showClose}}<a class="close" href="" title="Close" {{action "closeModal"}}>{{svg-jar "close"}}<span class="hidden">Close</span></a>{{/if}}
Creates Ember Modal infastructure resolves #2416 This is a pretty large commit but what it's adding are pretty fundamental to the admin app. - Creates top level actions on the ApplicationRoute for opening and closing modals. This allows sending the 'openModal' action from any template to open a modal. - Every modal template lives in 'templates/modals/{{modalName}}' - Each modal can have a backing controller of the same name that can provide additional control for that modal. Those controllers reside in 'controllers/modals/{{modalName}}' - Created the ModalDialog component which is where all the logic for the component resides. It's not at 100% parity with the existing Ghost modal system but it has the foundation for further fleshing out. It currently accepts parameters for styling how the modal should appear, which previously was defined in JS files in the Backbone admin. - This creates the 'delete all posts', 'delete this post', 'markdown', and 'upload' modal. Some are in more stages of completion than others, but I wanted to just get the foundation in place as fast as possible. - This also creates the UploadModal component which is a subclass of the ModalDialog component. The reason for this subclassing is that the UploadModal component directly accesses the DOM and when that occurs in Ember it should remain in a component definition. It's ready for extending to reach parity. Note: depending on needs the base ModalDialog class may need to be modified.
2014-03-31 06:07:05 +02:00
<section class="modal-body">
{{yield}}
</section>
{{#if confirm}}
<footer class="modal-footer">
Multiple minor visual style fixes - Lighter dropdown shadow - Removed display:flex from .btn because safari can't handle it on <button> elements, where it will immediately set all text-alignment to "left" with no way to change. I haven't been able to find any regressions for this change so far. Can't remember why buttons were supposed to be flexbox anyway. Maybe for icon alignment within buttons, but I can't find any such examples within the app. - Safari thinks that user-select: all; means a single click should SELECT ALL THE THINGS. Removed/replaced with user-select: text; which makes it behave like Chrome; click and drag to select. - Increased hit area for "?" button - Removed :active style for post-edit button on content management screen, adjusted position - Increased contrast on tag description, tag count, and view blog links See #5652
2015-08-12 10:29:40 +02:00
{{! Buttons must be on one line to prevent white-space errors }}
✨ success/failure state spinner buttons (#566) refs https://github.com/TryGhost/Ghost/issues/7515 - changes to `gh-task-button`: - can take `buttonText` (default: "Save"), `runningText` ("Saving"), `successText` ("Saved"), and `failureText` ("Retry") params - positional param for `buttonText` - default button display can be overridden by passing in a block, in that scenario the component will yield a hash containing all states to be used in this fashion: ``` {{#gh-task-button task=myTask as |task|}} {{if task.isIdle "Save me"}} {{if task.isRunning "Saving"}} {{if task.isSuccess "Thank you!"}} {{if task.isFailure "Nooooooo!"}} {{/gh-task-button}} ``` - update existing uses of `gh-task-button` to match new component signature
2017-03-07 18:28:52 +01:00
<button type="button" class="{{rejectButtonClass}} btn-minor" {{action "confirm" "reject"}} data-test-modal-reject-button>{{confirm.reject.text}}</button><button type="button" class="{{acceptButtonClass}}" {{action "confirm" "accept"}} data-test-modal-accept-button>{{confirm.accept.text}}</button>
Creates Ember Modal infastructure resolves #2416 This is a pretty large commit but what it's adding are pretty fundamental to the admin app. - Creates top level actions on the ApplicationRoute for opening and closing modals. This allows sending the 'openModal' action from any template to open a modal. - Every modal template lives in 'templates/modals/{{modalName}}' - Each modal can have a backing controller of the same name that can provide additional control for that modal. Those controllers reside in 'controllers/modals/{{modalName}}' - Created the ModalDialog component which is where all the logic for the component resides. It's not at 100% parity with the existing Ghost modal system but it has the foundation for further fleshing out. It currently accepts parameters for styling how the modal should appear, which previously was defined in JS files in the Backbone admin. - This creates the 'delete all posts', 'delete this post', 'markdown', and 'upload' modal. Some are in more stages of completion than others, but I wanted to just get the foundation in place as fast as possible. - This also creates the UploadModal component which is a subclass of the ModalDialog component. The reason for this subclassing is that the UploadModal component directly accesses the DOM and when that occurs in Ember it should remain in a component definition. It's ready for extending to reach parity. Note: depending on needs the base ModalDialog class may need to be modified.
2014-03-31 06:07:05 +02:00
</footer>
{{/if}}
</section>
</article>
</div>
Ember 1.11.1 - remove `bind-attr` all over the place
2015-04-01 18:01:38 +02:00
<div class="modal-background js-modal-background"></div>
Reference in a new issue Copy permalink