diff --git a/app/assets/javascripts/discourse/components/d-modal-body.js.es6 b/app/assets/javascripts/discourse/components/d-modal-body.js.es6 index 6eac9a34c68..a2b373400ab 100644 --- a/app/assets/javascripts/discourse/components/d-modal-body.js.es6 +++ b/app/assets/javascripts/discourse/components/d-modal-body.js.es6 @@ -4,7 +4,7 @@ export default Ember.Component.extend({ didInsertElement() { this._super(); $('#modal-alert').hide(); - $('.d-modal').modal('show'); + $('.d-modal.fixed-modal').modal('show'); Ember.run.scheduleOnce('afterRender', this, this._afterFirstRender); this.appEvents.on('modal-body:flash', msg => this._flash(msg)); }, diff --git a/app/assets/javascripts/discourse/components/hide-modal-trigger.js.es6 b/app/assets/javascripts/discourse/components/hide-modal-trigger.js.es6 index d5f9bac4aae..8cafdeb0dd8 100644 --- a/app/assets/javascripts/discourse/components/hide-modal-trigger.js.es6 +++ b/app/assets/javascripts/discourse/components/hide-modal-trigger.js.es6 @@ -1,6 +1,6 @@ export default Ember.Component.extend({ didInsertElement() { this._super(); - $('.d-modal').modal('hide').addClass('hidden'); + $('.d-modal.fixed-modal').modal('hide').addClass('hidden'); } }); diff --git a/app/assets/javascripts/discourse/routes/application.js.es6 b/app/assets/javascripts/discourse/routes/application.js.es6 index ee7c22ed80c..93598fbb9bd 100644 --- a/app/assets/javascripts/discourse/routes/application.js.es6 +++ b/app/assets/javascripts/discourse/routes/application.js.es6 @@ -121,11 +121,11 @@ const ApplicationRoute = Discourse.Route.extend(OpenComposer, { user clicks "No", reopenModal. If user clicks "Yes", be sure to call closeModal. **/ hideModal() { - $('.d-modal').modal('hide'); + $('.d-modal.fixed-modal').modal('hide'); }, reopenModal() { - $('.d-modal').modal('show'); + $('.d-modal.fixed-modal').modal('show'); }, editCategory(category) { diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss index f41175a7325..12ba90f5e87 100644 --- a/app/assets/stylesheets/common/base/modal.scss +++ b/app/assets/stylesheets/common/base/modal.scss @@ -83,7 +83,13 @@ } -.modal { +.inline-modal { + .modal-inner-container { + border: 1px solid $secondary-medium; + } +} + +.fixed-modal { position: fixed; top: 0; width: 100%;