Browse Source

Fix legacy modals to support top aligned, fix bug in ie11 for swapping between top/middle aligned

pull/6579/merge
Jack 6 years ago
parent
commit
e35ce81e27
2 changed files with 28 additions and 4 deletions
  1. 9
      src/definitions/modules/modal.js
  2. 23
      src/definitions/modules/modal.less

9
src/definitions/modules/modal.js

@ -110,8 +110,7 @@ $.fn.modal = function(parameters) {
debug : settings.debug, debug : settings.debug,
variation : settings.centered variation : settings.centered
? false ? false
: 'top aligned'
,
: 'top aligned',
dimmerName : 'modals' dimmerName : 'modals'
}, },
dimmerSettings = $.extend(true, defaultSettings, settings.dimmerSettings) dimmerSettings = $.extend(true, defaultSettings, settings.dimmerSettings)
@ -305,6 +304,7 @@ $.fn.modal = function(parameters) {
? callback ? callback
: function(){} : function(){}
; ;
console.log('test');
module.refreshModals(); module.refreshModals();
module.set.dimmerSettings(); module.set.dimmerSettings();
module.showModal(callback); module.showModal(callback);
@ -690,9 +690,12 @@ $.fn.modal = function(parameters) {
width = module.cache.width, width = module.cache.width,
height = module.cache.height height = module.cache.height
; ;
console.log(module.can.fit());
$module $module
.css({ .css({
marginTop: -(height / 2),
marginTop: (settings.centered && module.can.fit())
? -(height / 2)
: 0,
marginLeft: -(width / 2) marginLeft: -(width / 2)
}) })
; ;

23
src/definitions/modules/modal.less

@ -317,6 +317,13 @@
left: 50%; left: 50%;
} }
.ui.legacy.page.dimmer > .ui.scrolling.modal,
.ui.page.dimmer > .ui.scrolling.legacy.modal,
.ui.top.aligned.legacy.page.dimmer > .ui.modal,
.ui.top.aligned.dimmer > .ui.legacy.modal {
top: auto;
}
/* Tablet and Mobile */ /* Tablet and Mobile */
@media only screen and (max-width : @largestTabletScreen) { @media only screen and (max-width : @largestTabletScreen) {
.ui.basic.modal > .close { .ui.basic.modal > .close {
@ -351,6 +358,20 @@
.modals.dimmer[class*="top aligned"] .modal { .modals.dimmer[class*="top aligned"] .modal {
margin: @topAlignedMargin auto; margin: @topAlignedMargin auto;
} }
@media only screen and (max-width : @largestMobileScreen) {
.modals.dimmer[class*="top aligned"] .modal {
margin: @mobileTopAlignedMargin auto;
}
}
/* Legacy Top Aligned */
.legacy.modals.dimmer[class*="top aligned"] {
padding-top: @topAlignedMargin;
}
@media only screen and (max-width : @largestMobileScreen) {
.legacy.modals.dimmer[class*="top aligned"] {
padding-top: @mobileTopAlignedMargin;
}
}
/*-------------- /*--------------
Scrolling Scrolling
@ -371,7 +392,7 @@
position: fixed; position: fixed;
} }
.modals.dimmer .ui.scrolling.modal { .modals.dimmer .ui.scrolling.modal {
margin: @scrollingMargin auto !important;
margin: @scrollingMargin auto;
} }
/* Undetached Scrolling */ /* Undetached Scrolling */

Loading…
Cancel
Save