diff --git a/RELEASE NOTES.md b/RELEASE NOTES.md index 2c70dba65..a19c8b5aa 100755 --- a/RELEASE NOTES.md +++ b/RELEASE NOTES.md @@ -3,6 +3,7 @@ ### Version 0.2.2 - Sep 28, 2013 **Updates** + - Fixes invoke returning found function instead of results of found function in dropdown, modal ### Version 0.2.1 - Sep 28, 2013 diff --git a/build/less/elements/image.less b/build/less/elements/image.less index 608b41876..b3a4671dc 100644 --- a/build/less/elements/image.less +++ b/build/less/elements/image.less @@ -73,9 +73,21 @@ img.ui.image { } /*-------------- - Avatar + Fluid ---------------*/ +.ui.fluid.images, +.ui.fluid.image, +.ui.fluid.images img, +.ui.fluid.image img { + display: block; + width: 100%; +} + + +/*-------------- + Avatar +---------------*/ .ui.avatar.images .image, .ui.avatar.images img, diff --git a/build/less/modules/dimmer.less b/build/less/modules/dimmer.less index 870b86c3d..8bc8d3d82 100644 --- a/build/less/modules/dimmer.less +++ b/build/less/modules/dimmer.less @@ -175,6 +175,9 @@ -ms-transform-origin: center center; transform-origin: center center; } +.ui.scrolling.page.dimmer { + position: absolute; +} /* body.ui.dimmed.dimmable > :not(.dimmer){ -webkit-filter: ~"blur(15px) grayscale(0.7)"; diff --git a/build/less/modules/modal.js b/build/less/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/build/less/modules/modal.js +++ b/build/less/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/build/less/modules/modal.less b/build/less/modules/modal.less index 1b14098b1..c0f348870 100644 --- a/build/less/modules/modal.less +++ b/build/less/modules/modal.less @@ -93,11 +93,13 @@ .ui.modal > .content > .left { display: table-cell; padding-right: 5%; + min-width: 25%; } .ui.modal > .content > .right { display: table-cell; padding-left: 5%; vertical-align: top; + min-width: 25%; } .ui.modal > .content > .left > .icon { font-size: 8em; @@ -201,7 +203,7 @@ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; - margin-top: 100px; + margin-top: 10px; } diff --git a/build/minified/modules/modal.js b/build/minified/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/build/minified/modules/modal.js +++ b/build/minified/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/build/uncompressed/elements/image.css b/build/uncompressed/elements/image.css index 9766d140a..6f18049c1 100644 --- a/build/uncompressed/elements/image.css +++ b/build/uncompressed/elements/image.css @@ -59,6 +59,16 @@ img.ui.image { -moz-border-radius: 500rem; border-radius: 500rem; } +/*-------------- + Fluid +---------------*/ +.ui.fluid.images, +.ui.fluid.image, +.ui.fluid.images img, +.ui.fluid.image img { + display: block; + width: 100%; +} /*-------------- Avatar ---------------*/ diff --git a/build/uncompressed/modules/dimmer.css b/build/uncompressed/modules/dimmer.css index 80196c9a1..27fb6c446 100644 --- a/build/uncompressed/modules/dimmer.css +++ b/build/uncompressed/modules/dimmer.css @@ -137,6 +137,9 @@ -ms-transform-origin: center center; transform-origin: center center; } +.ui.scrolling.page.dimmer { + position: absolute; +} /* body.ui.dimmed.dimmable > :not(.dimmer){ -webkit-filter: ~"blur(15px) grayscale(0.7)"; diff --git a/build/uncompressed/modules/modal.css b/build/uncompressed/modules/modal.css index 182f0275c..86deb9943 100644 --- a/build/uncompressed/modules/modal.css +++ b/build/uncompressed/modules/modal.css @@ -73,11 +73,13 @@ .ui.modal > .content > .left { display: table-cell; padding-right: 5%; + min-width: 25%; } .ui.modal > .content > .right { display: table-cell; padding-left: 5%; vertical-align: top; + min-width: 25%; } .ui.modal > .content > .left > .icon { font-size: 8em; @@ -171,7 +173,7 @@ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; - margin-top: 100px; + margin-top: 10px; } /******************************* States diff --git a/build/uncompressed/modules/modal.js b/build/uncompressed/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/build/uncompressed/modules/modal.js +++ b/build/uncompressed/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/node/src/documents/index.html.eco b/node/src/documents/index.html.eco index 629a80f8a..1023c1040 100755 --- a/node/src/documents/index.html.eco +++ b/node/src/documents/index.html.eco @@ -14,7 +14,7 @@ type : 'Semantic'
-

Semantic UI 0.2.0

+

Semantic UI 0.2.2

UI is the vocabulary of the web.

Semantic empowers designers and developers by creating a language for sharing UI.

View UI diff --git a/node/src/documents/modules/modal.html.eco b/node/src/documents/modules/modal.html.eco index 3b85c13bd..77040e9a0 100755 --- a/node/src/documents/modules/modal.html.eco +++ b/node/src/documents/modules/modal.html.eco @@ -45,7 +45,7 @@ type : 'UI Module'
- +
Are you sure you want to upload that?
diff --git a/node/src/files/build/less/elements/image.less b/node/src/files/build/less/elements/image.less index 608b41876..b3a4671dc 100644 --- a/node/src/files/build/less/elements/image.less +++ b/node/src/files/build/less/elements/image.less @@ -73,9 +73,21 @@ img.ui.image { } /*-------------- - Avatar + Fluid ---------------*/ +.ui.fluid.images, +.ui.fluid.image, +.ui.fluid.images img, +.ui.fluid.image img { + display: block; + width: 100%; +} + + +/*-------------- + Avatar +---------------*/ .ui.avatar.images .image, .ui.avatar.images img, diff --git a/node/src/files/build/less/modules/dimmer.less b/node/src/files/build/less/modules/dimmer.less index 870b86c3d..8bc8d3d82 100644 --- a/node/src/files/build/less/modules/dimmer.less +++ b/node/src/files/build/less/modules/dimmer.less @@ -175,6 +175,9 @@ -ms-transform-origin: center center; transform-origin: center center; } +.ui.scrolling.page.dimmer { + position: absolute; +} /* body.ui.dimmed.dimmable > :not(.dimmer){ -webkit-filter: ~"blur(15px) grayscale(0.7)"; diff --git a/node/src/files/build/less/modules/modal.js b/node/src/files/build/less/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/node/src/files/build/less/modules/modal.js +++ b/node/src/files/build/less/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/node/src/files/build/less/modules/modal.less b/node/src/files/build/less/modules/modal.less index 1b14098b1..c0f348870 100644 --- a/node/src/files/build/less/modules/modal.less +++ b/node/src/files/build/less/modules/modal.less @@ -93,11 +93,13 @@ .ui.modal > .content > .left { display: table-cell; padding-right: 5%; + min-width: 25%; } .ui.modal > .content > .right { display: table-cell; padding-left: 5%; vertical-align: top; + min-width: 25%; } .ui.modal > .content > .left > .icon { font-size: 8em; @@ -201,7 +203,7 @@ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; - margin-top: 100px; + margin-top: 10px; } diff --git a/node/src/files/build/minified/modules/modal.js b/node/src/files/build/minified/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/node/src/files/build/minified/modules/modal.js +++ b/node/src/files/build/minified/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/node/src/files/build/uncompressed/elements/image.css b/node/src/files/build/uncompressed/elements/image.css index 9766d140a..6f18049c1 100644 --- a/node/src/files/build/uncompressed/elements/image.css +++ b/node/src/files/build/uncompressed/elements/image.css @@ -59,6 +59,16 @@ img.ui.image { -moz-border-radius: 500rem; border-radius: 500rem; } +/*-------------- + Fluid +---------------*/ +.ui.fluid.images, +.ui.fluid.image, +.ui.fluid.images img, +.ui.fluid.image img { + display: block; + width: 100%; +} /*-------------- Avatar ---------------*/ diff --git a/node/src/files/build/uncompressed/modules/dimmer.css b/node/src/files/build/uncompressed/modules/dimmer.css index 80196c9a1..27fb6c446 100644 --- a/node/src/files/build/uncompressed/modules/dimmer.css +++ b/node/src/files/build/uncompressed/modules/dimmer.css @@ -137,6 +137,9 @@ -ms-transform-origin: center center; transform-origin: center center; } +.ui.scrolling.page.dimmer { + position: absolute; +} /* body.ui.dimmed.dimmable > :not(.dimmer){ -webkit-filter: ~"blur(15px) grayscale(0.7)"; diff --git a/node/src/files/build/uncompressed/modules/modal.css b/node/src/files/build/uncompressed/modules/modal.css index 182f0275c..86deb9943 100644 --- a/node/src/files/build/uncompressed/modules/modal.css +++ b/node/src/files/build/uncompressed/modules/modal.css @@ -73,11 +73,13 @@ .ui.modal > .content > .left { display: table-cell; padding-right: 5%; + min-width: 25%; } .ui.modal > .content > .right { display: table-cell; padding-left: 5%; vertical-align: top; + min-width: 25%; } .ui.modal > .content > .left > .icon { font-size: 8em; @@ -171,7 +173,7 @@ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; - margin-top: 100px; + margin-top: 10px; } /******************************* States diff --git a/node/src/files/build/uncompressed/modules/modal.js b/node/src/files/build/uncompressed/modules/modal.js index 5d50b6d77..4a4b1cac4 100644 --- a/node/src/files/build/uncompressed/modules/modal.js +++ b/node/src/files/build/uncompressed/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/src/elements/image.less b/src/elements/image.less index 608b41876..b3a4671dc 100755 --- a/src/elements/image.less +++ b/src/elements/image.less @@ -73,9 +73,21 @@ img.ui.image { } /*-------------- - Avatar + Fluid ---------------*/ +.ui.fluid.images, +.ui.fluid.image, +.ui.fluid.images img, +.ui.fluid.image img { + display: block; + width: 100%; +} + + +/*-------------- + Avatar +---------------*/ .ui.avatar.images .image, .ui.avatar.images img, diff --git a/src/modules/dimmer.less b/src/modules/dimmer.less index 870b86c3d..8bc8d3d82 100755 --- a/src/modules/dimmer.less +++ b/src/modules/dimmer.less @@ -175,6 +175,9 @@ -ms-transform-origin: center center; transform-origin: center center; } +.ui.scrolling.page.dimmer { + position: absolute; +} /* body.ui.dimmed.dimmable > :not(.dimmer){ -webkit-filter: ~"blur(15px) grayscale(0.7)"; diff --git a/src/modules/modal.js b/src/modules/modal.js index 5d50b6d77..4a4b1cac4 100755 --- a/src/modules/modal.js +++ b/src/modules/modal.js @@ -48,6 +48,7 @@ $.fn.modal = function(parameters) { $context = $(settings.context), $otherModals = $allModules.not($module), $close = $module.find(selector.close), + $dimmer, element = this, instance = $module.data(moduleNamespace), @@ -58,10 +59,14 @@ $.fn.modal = function(parameters) { initialize: function() { module.verbose('Initializing dimmer', $context); - $context + + $dimmer = $context .dimmer('add content', $module) + .dimmer('get dimmer') ; + console.log($dimmer); + module.verbose('Attaching close events', $close); $close .on('click' + eventNamespace, module.event.close) @@ -91,6 +96,7 @@ $.fn.modal = function(parameters) { }, refresh: function() { + module.remove.scrolling(); module.cacheSizes(); module.set.type(); module.set.position(); @@ -135,12 +141,14 @@ $.fn.modal = function(parameters) { show: function() { module.showDimmer(); module.cacheSizes(); - module.set.type(); module.set.position(); module.hideAll(); if(settings.transition && $.fn.transition !== undefined) { $module - .transition(settings.transition + ' in', settings.duration, module.set.active) + .transition(settings.transition + ' in', settings.duration, function() { + module.set.active(); + module.set.type(); + }) ; } else { @@ -207,6 +215,10 @@ $.fn.modal = function(parameters) { $document .off('keyup' + eventNamespace) ; + }, + scrolling: function() { + $dimmer.removeClass(className.scrolling); + $module.removeClass(className.scrolling); } }, @@ -250,14 +262,19 @@ $.fn.modal = function(parameters) { .dimmer('initialize') ; }, + scrolling: function() { + console.log($dimmer, 'set scrolling'); + $dimmer.addClass(className.scrolling); + $module.addClass(className.scrolling); + }, type: function() { if(module.can.fit()) { module.verbose('Modal fits on screen'); - $module.removeClass(className.scrolling); + module.remove.scrolling(); } else { module.verbose('Modal cannot fit on screen setting to scrolling'); - $module.addClass(className.scrolling); + module.set.scrolling(); } }, position: function() { @@ -265,6 +282,7 @@ $.fn.modal = function(parameters) { if(module.can.fit()) { $module .css({ + top: '50%', marginTop: -(module.cache.height / 2) }) ; @@ -272,7 +290,8 @@ $.fn.modal = function(parameters) { else { $module .css({ - top: $context.prop('scrollTop') + marginTop : '1em', + top : $document.scrollTop() }) ; } @@ -466,13 +485,12 @@ $.fn.modal.settings = { debug : true, performance : true, - offset : 0, - transition : 'scale', - duration : 500, - easing : 'easeOutExpo', - closable : true, context : 'body', + duration : 500, + easing : 'easeOutExpo', + offset : 0, + transition : 'scale', onShow : function(){}, onHide : function(){}, diff --git a/src/modules/modal.less b/src/modules/modal.less index 1b14098b1..c0f348870 100755 --- a/src/modules/modal.less +++ b/src/modules/modal.less @@ -93,11 +93,13 @@ .ui.modal > .content > .left { display: table-cell; padding-right: 5%; + min-width: 25%; } .ui.modal > .content > .right { display: table-cell; padding-left: 5%; vertical-align: top; + min-width: 25%; } .ui.modal > .content > .left > .icon { font-size: 8em; @@ -201,7 +203,7 @@ /* A modal that cannot fit on the page */ .ui.modal.scrolling { position: absolute; - margin-top: 100px; + margin-top: 10px; }