diff --git a/build/minified/modules/dropdown.js b/build/minified/modules/dropdown.js
index 8efc564f7..2bbd22352 100644
--- a/build/minified/modules/dropdown.js
+++ b/build/minified/modules/dropdown.js
@@ -43,6 +43,8 @@ $.fn.dropdown = function(parameters) {
className = settings.className,
namespace = settings.namespace,
+ animation = settings.animation,
+
errors = settings.errors,
module
;
@@ -76,7 +78,6 @@ $.fn.dropdown = function(parameters) {
module.debug('Checking if click was inside the dropdown', event.target);
if( $(event.target).closest($module).size() == 0 ) {
module.hide();
- module.intent.unbind();
}
},
@@ -128,32 +129,70 @@ $.fn.dropdown = function(parameters) {
;
},
+ animate: {
+ show: function() {
+ if(animation.show == 'show') {
+ $menu
+ .show()
+ ;
+ }
+ else if(animation.show == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 0)
+ .delay(100)
+ .animate({
+ opacity : 1
+ }, 300, 'easeOutQuad')
+ .end()
+ .slideDown(200, 'easeOutQuad')
+ ;
+ }
+ },
+ hide: function() {
+ console.log(animation.hide);
+ if(animation.hide == 'hide') {
+ $menu
+ .hide()
+ ;
+ }
+ else if(animation.hide == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 1)
+ .animate({
+ opacity : 0
+ }, 300, 'easeOutQuad')
+ .end()
+ .delay(100)
+ .slideUp(200, 'easeOutQuad')
+ ;
+ }
+ }
+ },
+
show: function() {
- module.debug('Enabling dropdown');
+ module.debug('Showing dropdown');
$module
.addClass(className.active)
;
+ module.animate.show();
if( module.can.click() ) {
module.intent.bind();
}
- $menu
- .show()
- ;
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onShow, $menu.get())();
},
hide: function() {
- module.debug('Disabling dropdown');
+ module.debug('Hiding dropdown');
$module
.removeClass(className.active)
;
if( module.can.click() ) {
module.intent.unbind();
}
- $menu
- .hide()
- ;
+ module.animate.hide();
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onHide, $menu.get())();
},
@@ -319,6 +358,11 @@ $.fn.dropdown.settings = {
verbose : true,
debug : true,
performance : false,
+
+ animation: {
+ show: 'slide',
+ hide: 'slide'
+ },
on : 'click',
diff --git a/build/minified/modules/dropdown.min.css b/build/minified/modules/dropdown.min.css
index a64ed10ed..7e1313808 100644
--- a/build/minified/modules/dropdown.min.css
+++ b/build/minified/modules/dropdown.min.css
@@ -1 +1 @@
-.ui.dropdown{position:relative;display:inline-block;line-height:1;white-space:nowrap}.ui.dropdown .menu{position:absolute;display:none;top:100%;background-color:#FFF;min-width:100%;-webkit-box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset,0 -1px 0 0 rgba(0,0,0,.1) inset;-moz-box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset;box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset,0 -1px 0 0 rgba(0,0,0,.1) inset;-moz-border-radius:0 0 .325em .325em;-webkit-border-radius:0 0 .325em .325em;border-radius:0 0 .325em .325em;-webkit-transition:opacity .2s ease-out;-moz-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;-ms-transition:opacity .2s ease-out;transition:opacity .2s ease-out;z-index:11}.ui.dropdown .menu{left:0}.ui>.ui.dropdown:last-child .menu{left:auto;right:0}.ui.dropdown .menu .item{cursor:pointer;border:0;border-top:1px solid rgba(0,0,0,.05);font-size:.9em;display:block;color:rgba(0,0,0,.75);padding:.85em 1em;font-size:.9rem;text-transform:none;font-weight:400;text-align:left;-webkit-touch-callout:none}.ui.dropdown .menu .item .icon{margin-right:.75em}.ui.dropdown .menu .item:first-child{border-top:0}.ui.dropdown.visible{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.ui.dropdown .menu .item:hover{background-color:rgba(0,0,0,.02)}.ui.dropdown .menu .active.item{border-top:1px solid rgba(0,0,0,.05);font-weight:700}.ui.simple.dropdown .menu{overflow:hidden;height:0;width:0;position:absolute;opacity:0;-webkit-transition:opacity .2s ease-out;-moz-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;-ms-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.ui.simple.dropdown:hover .menu{display:block;overflow:visible;min-width:210px;width:100%;height:auto;opacity:1}.ui.selection.dropdown{cursor:pointer;display:inline-block;background-color:#FFF;padding:.5em 1em;line-height:1.33;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);-webkit-border-radius:.3125em;-moz-border-radius:.3125em;border-radius:.3125em}.ui.selection.dropdown>.dropdown.icon{float:right;margin:.2em 0 .2em .5em}.ui.selection.dropdown,.ui.selection.dropdown .menu{-webkit-transition:box-shadow .2s ease-out;-moz-transition:box-shadow .2s ease-out;-o-transition:box-shadow .2s ease-out;-ms-transition:box-shadow .2s ease-out;transition:box-shadow .2s ease-out}.ui.selection.dropdown .menu{-webkit-box-shadow:0 1px 0 1px #EEE;-moz-box-shadow:0 1px 0 1px #EEE;box-shadow:0 1px 0 1px #EEE}.ui.selection.dropdown:hover,.ui.selection.dropdown.hover{-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2)}.ui.selection.dropdown:hover .menu{-webkit-box-shadow:0 1px 0 1px #D3D3D3;-moz-box-shadow:0 1px 0 1px #D3D3D3;box-shadow:0 1px 0 1px #D3D3D3}
\ No newline at end of file
+.ui.dropdown{position:relative;display:inline-block;line-height:1;white-space:nowrap;-webkit-transition:border-radius .1s ease-out;-moz-transition:border-radius .1s ease-out;-o-transition:border-radius .1s ease-out;-ms-transition:border-radius .1s ease-out;transition:border-radius .1s ease-out}.ui.dropdown .menu{position:absolute;display:none;top:100%;background-color:#FFF;min-width:100%;-webkit-box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset,0 -1px 0 0 rgba(0,0,0,.1) inset;-moz-box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset;box-shadow:0 2px 0 0 rgba(0,0,0,.1),1px 0 0 0 rgba(0,0,0,.1) inset,-1px 0 0 0 rgba(0,0,0,.1) inset,0 -1px 0 0 rgba(0,0,0,.1) inset;-moz-border-radius:0 0 .325em .325em;-webkit-border-radius:0 0 .325em .325em;border-radius:0 0 .325em .325em;-webkit-transition:opacity .2s ease-out;-moz-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;-ms-transition:opacity .2s ease-out;transition:opacity .2s ease-out;z-index:11}.ui.dropdown .menu{left:0}.ui>.ui.dropdown:last-child .menu{left:auto;right:0}.ui.dropdown .menu .item{cursor:pointer;border:0;border-top:1px solid rgba(0,0,0,.05);font-size:.9em;display:block;color:rgba(0,0,0,.75);padding:.85em 1em;font-size:.9rem;text-transform:none;font-weight:400;text-align:left;-webkit-touch-callout:none}.ui.dropdown .menu .item .icon{margin-right:.75em}.ui.dropdown .menu .item:first-child{border-top:0}.ui.dropdown.visible{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.ui.dropdown .menu .item:hover{background-color:rgba(0,0,0,.02)}.ui.dropdown .menu .active.item{border-top:1px solid rgba(0,0,0,.05);font-weight:700}.ui.simple.dropdown .menu{overflow:hidden;height:0;width:0;position:absolute;opacity:0;-webkit-transition:opacity .2s ease-out;-moz-transition:opacity .2s ease-out;-o-transition:opacity .2s ease-out;-ms-transition:opacity .2s ease-out;transition:opacity .2s ease-out}.ui.simple.dropdown:hover .menu{display:block;overflow:visible;min-width:210px;width:100%;height:auto;opacity:1}.ui.selection.dropdown{cursor:pointer;display:inline-block;background-color:#FFF;padding:.5em 1em;line-height:1.33;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1);-webkit-border-radius:.3125em;-moz-border-radius:.3125em;border-radius:.3125em}.ui.selection.dropdown>.dropdown.icon{float:right;margin:.2em 0 .2em .5em}.ui.selection.dropdown,.ui.selection.dropdown .menu{-webkit-transition:box-shadow .2s ease-out;-moz-transition:box-shadow .2s ease-out;-o-transition:box-shadow .2s ease-out;-ms-transition:box-shadow .2s ease-out;transition:box-shadow .2s ease-out}.ui.selection.dropdown .menu{-webkit-box-shadow:0 1px 0 1px #EEE;-moz-box-shadow:0 1px 0 1px #EEE;box-shadow:0 1px 0 1px #EEE}.ui.selection.dropdown:hover,.ui.selection.dropdown.hover{-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.2);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.2);box-shadow:0 0 0 1px rgba(0,0,0,.2)}.ui.selection.dropdown:hover .menu{-webkit-box-shadow:0 1px 0 1px #D3D3D3;-moz-box-shadow:0 1px 0 1px #D3D3D3;box-shadow:0 1px 0 1px #D3D3D3}
\ No newline at end of file
diff --git a/build/minified/modules/dropdown.min.js b/build/minified/modules/dropdown.min.js
index 71e3c92e0..2228baba9 100644
--- a/build/minified/modules/dropdown.min.js
+++ b/build/minified/modules/dropdown.min.js
@@ -1 +1 @@
-(function(e,t,n,o){e.fn.dropdown=function(t){var a,i=e(this),s=e(n),r=e.extend(!0,{},e.fn.dropdown.settings,t),c="."+r.namespace,l="module-"+r.namespace,u=(i.selector||"",(new Date).getTime()),d=[],f=arguments[0],m="string"==typeof f,p=[].slice.call(arguments,1);return i.each(function(){var t,g=e(this),h=e(this).find(r.selector.menu),v="ontouchstart"in n.documentElement,b=g.selector||"",y=this,x=g.data("module-"+r.namespace),C=r.className,w=r.namespace,T=r.errors;t={initialize:function(){r.context&&""!==b?(t.verbose("Initializing dropdown with delegated events",g),e(y,r.context).on(b,"click"+c,t.toggle).data(l,t)):(t.verbose("Initializing dropdown with bound events",g),g.on(t.get.event()+c,t.toggle),g.data(l,t))},intent:{test:function(n){t.debug("Checking if click was inside the dropdown",n.target),0==e(n.target).closest(g).size()&&(t.hide(),t.intent.unbind())},bind:function(){t.verbose("Binding hide intent event to document"),e(n).on("click",t.intent.test)},unbind:function(){t.verbose("Removing hide intent event from document"),s.off("click")}},get:{event:function(){return v?"touchstart":"hover"==r.on?"hover":"click"==r.on?"click":o}},can:{click:function(){return v||"click"==r.on},show:function(){return!g.hasClass(C.disabled)}},destroy:function(){t.verbose("Destroying previous dropdown for",g),g.off(w)},show:function(){t.debug("Enabling dropdown"),g.addClass(C.active),t.can.click()&&t.intent.bind(),h.show(),e.proxy(r.onChange,h.get())(),e.proxy(r.onShow,h.get())()},hide:function(){t.debug("Disabling dropdown"),g.removeClass(C.active),t.can.click()&&t.intent.unbind(),h.hide(),e.proxy(r.onChange,h.get())(),e.proxy(r.onHide,h.get())()},toggle:function(){t.can.show()&&h.is(":not(:visible)")?t.show():t.hide()},setting:function(t,n){return n===o?r[t]:(e.isPlainObject(t)?e.extend(!0,r,t):r[t]=n,o)},internal:function(n,a){return a===o?t[n]:(e.isPlainObject(n)?e.extend(!0,t,n):t[n]=a,o)},debug:function(){r.debug&&(t.performance.log(arguments[0]),t.verbose=Function.prototype.bind.call(console.info,console,r.moduleName+":"))},verbose:function(){r.verbose&&r.debug&&(t.performance.log(arguments[0]),t.verbose=Function.prototype.bind.call(console.info,console,r.moduleName+":"))},error:function(){console.log!==o&&(t.error=Function.prototype.bind.call(console.log,console,r.moduleName+":"))},performance:{log:function(e){var n,o,a;r.performance&&(n=(new Date).getTime(),a=u||n,o=n-a,u=n,d.push({Element:y,Name:e,"Execution Time":o}),clearTimeout(t.performance.timer),t.performance.timer=setTimeout(t.performance.display,100))},display:function(){var t=r.moduleName,n=(r.moduleName+": "+b+"("+i.size()+" elements)",0);b&&(t+="Performance ("+b+")"),(console.group!==o||console.table!==o)&&d.length>0&&(console.groupCollapsed(t),console.table?(e.each(d,function(e,t){n+=t["Execution Time"]}),console.table(d)):e.each(d,function(e,t){n+=t["Execution Time"]}),console.log("Total Execution Time:",n+"ms"),console.groupEnd(),d=[],u=!1)}},invoke:function(n,a,i){var s,r;return a=a||p,i=y||i,"string"==typeof n&&x!==o&&(n=n.split("."),s=n.length-1,e.each(n,function(n,a){return e.isPlainObject(x[a])&&n!=s?(x=x[a],!0):x[a]!==o?(r=x[a],!0):(t.error(T.method),!1)})),e.isFunction(r)?(t.verbose("Executing invoked function",r),r.apply(i,a)):r||!1}},m?(x===o&&t.initialize(),a=t.invoke(f)):(x!==o&&t.destroy(),t.initialize())}),a?a:this},e.fn.dropdown.settings={moduleName:"Dropdown Module",namespace:"dropdown",verbose:!0,debug:!0,performance:!1,on:"click",onChange:function(){},onShow:function(){},onHide:function(){},errors:{method:"The method you called is not defined."},selector:{menu:".menu"},className:{active:"visible"}}})(jQuery,window,document);
\ No newline at end of file
+(function(e,t,n,o){e.fn.dropdown=function(t){var a,i=e(this),s=e(n),r=e.extend(!0,{},e.fn.dropdown.settings,t),c="."+r.namespace,l="module-"+r.namespace,u=(i.selector||"",(new Date).getTime()),d=[],f=arguments[0],m="string"==typeof f,p=[].slice.call(arguments,1);return i.each(function(){var t,g=e(this),h=e(this).find(r.selector.menu),v="ontouchstart"in n.documentElement,b=g.selector||"",y=this,x=g.data("module-"+r.namespace),C=r.className,w=r.namespace,T=r.animation,k=r.errors;t={initialize:function(){r.context&&""!==b?(t.verbose("Initializing dropdown with delegated events",g),e(y,r.context).on(b,"click"+c,t.toggle).data(l,t)):(t.verbose("Initializing dropdown with bound events",g),g.on(t.get.event()+c,t.toggle),g.data(l,t))},intent:{test:function(n){t.debug("Checking if click was inside the dropdown",n.target),0==e(n.target).closest(g).size()&&t.hide()},bind:function(){t.verbose("Binding hide intent event to document"),e(n).on("click",t.intent.test)},unbind:function(){t.verbose("Removing hide intent event from document"),s.off("click")}},get:{event:function(){return v?"touchstart":"hover"==r.on?"hover":"click"==r.on?"click":o}},can:{click:function(){return v||"click"==r.on},show:function(){return!g.hasClass(C.disabled)}},destroy:function(){t.verbose("Destroying previous dropdown for",g),g.off(w)},animate:{show:function(){"show"==T.show?h.show():"slide"==T.show&&h.children().css("opacity",0).delay(100).animate({opacity:1},300,"easeOutQuad").end().slideDown(200,"easeOutQuad")},hide:function(){console.log(T.hide),"hide"==T.hide?h.hide():"slide"==T.hide&&h.children().css("opacity",1).animate({opacity:0},300,"easeOutQuad").end().delay(100).slideUp(200,"easeOutQuad")}},show:function(){t.debug("Showing dropdown"),g.addClass(C.active),t.animate.show(),t.can.click()&&t.intent.bind(),e.proxy(r.onChange,h.get())(),e.proxy(r.onShow,h.get())()},hide:function(){t.debug("Hiding dropdown"),g.removeClass(C.active),t.can.click()&&t.intent.unbind(),t.animate.hide(),e.proxy(r.onChange,h.get())(),e.proxy(r.onHide,h.get())()},toggle:function(){t.can.show()&&h.is(":not(:visible)")?t.show():t.hide()},setting:function(t,n){return n===o?r[t]:(e.isPlainObject(t)?e.extend(!0,r,t):r[t]=n,o)},internal:function(n,a){return a===o?t[n]:(e.isPlainObject(n)?e.extend(!0,t,n):t[n]=a,o)},debug:function(){r.debug&&(t.performance.log(arguments[0]),t.verbose=Function.prototype.bind.call(console.info,console,r.moduleName+":"))},verbose:function(){r.verbose&&r.debug&&(t.performance.log(arguments[0]),t.verbose=Function.prototype.bind.call(console.info,console,r.moduleName+":"))},error:function(){console.log!==o&&(t.error=Function.prototype.bind.call(console.log,console,r.moduleName+":"))},performance:{log:function(e){var n,o,a;r.performance&&(n=(new Date).getTime(),a=u||n,o=n-a,u=n,d.push({Element:y,Name:e,"Execution Time":o}),clearTimeout(t.performance.timer),t.performance.timer=setTimeout(t.performance.display,100))},display:function(){var t=r.moduleName,n=(r.moduleName+": "+b+"("+i.size()+" elements)",0);b&&(t+="Performance ("+b+")"),(console.group!==o||console.table!==o)&&d.length>0&&(console.groupCollapsed(t),console.table?(e.each(d,function(e,t){n+=t["Execution Time"]}),console.table(d)):e.each(d,function(e,t){n+=t["Execution Time"]}),console.log("Total Execution Time:",n+"ms"),console.groupEnd(),d=[],u=!1)}},invoke:function(n,a,i){var s,r;return a=a||p,i=y||i,"string"==typeof n&&x!==o&&(n=n.split("."),s=n.length-1,e.each(n,function(n,a){return e.isPlainObject(x[a])&&n!=s?(x=x[a],!0):x[a]!==o?(r=x[a],!0):(t.error(k.method),!1)})),e.isFunction(r)?(t.verbose("Executing invoked function",r),r.apply(i,a)):r||!1}},m?(x===o&&t.initialize(),a=t.invoke(f)):(x!==o&&t.destroy(),t.initialize())}),a?a:this},e.fn.dropdown.settings={moduleName:"Dropdown Module",namespace:"dropdown",verbose:!0,debug:!0,performance:!1,animation:{show:"slide",hide:"slide"},on:"click",onChange:function(){},onShow:function(){},onHide:function(){},errors:{method:"The method you called is not defined."},selector:{menu:".menu"},className:{active:"visible"}}})(jQuery,window,document);
\ No newline at end of file
diff --git a/build/packaged/modules/dropdown.js b/build/packaged/modules/dropdown.js
index 8efc564f7..2bbd22352 100644
--- a/build/packaged/modules/dropdown.js
+++ b/build/packaged/modules/dropdown.js
@@ -43,6 +43,8 @@ $.fn.dropdown = function(parameters) {
className = settings.className,
namespace = settings.namespace,
+ animation = settings.animation,
+
errors = settings.errors,
module
;
@@ -76,7 +78,6 @@ $.fn.dropdown = function(parameters) {
module.debug('Checking if click was inside the dropdown', event.target);
if( $(event.target).closest($module).size() == 0 ) {
module.hide();
- module.intent.unbind();
}
},
@@ -128,32 +129,70 @@ $.fn.dropdown = function(parameters) {
;
},
+ animate: {
+ show: function() {
+ if(animation.show == 'show') {
+ $menu
+ .show()
+ ;
+ }
+ else if(animation.show == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 0)
+ .delay(100)
+ .animate({
+ opacity : 1
+ }, 300, 'easeOutQuad')
+ .end()
+ .slideDown(200, 'easeOutQuad')
+ ;
+ }
+ },
+ hide: function() {
+ console.log(animation.hide);
+ if(animation.hide == 'hide') {
+ $menu
+ .hide()
+ ;
+ }
+ else if(animation.hide == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 1)
+ .animate({
+ opacity : 0
+ }, 300, 'easeOutQuad')
+ .end()
+ .delay(100)
+ .slideUp(200, 'easeOutQuad')
+ ;
+ }
+ }
+ },
+
show: function() {
- module.debug('Enabling dropdown');
+ module.debug('Showing dropdown');
$module
.addClass(className.active)
;
+ module.animate.show();
if( module.can.click() ) {
module.intent.bind();
}
- $menu
- .show()
- ;
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onShow, $menu.get())();
},
hide: function() {
- module.debug('Disabling dropdown');
+ module.debug('Hiding dropdown');
$module
.removeClass(className.active)
;
if( module.can.click() ) {
module.intent.unbind();
}
- $menu
- .hide()
- ;
+ module.animate.hide();
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onHide, $menu.get())();
},
@@ -319,6 +358,11 @@ $.fn.dropdown.settings = {
verbose : true,
debug : true,
performance : false,
+
+ animation: {
+ show: 'slide',
+ hide: 'slide'
+ },
on : 'click',
diff --git a/build/packaged/semantic.min.css.REMOVED.git-id b/build/packaged/semantic.min.css.REMOVED.git-id
index 199f082aa..47592b2ab 100644
--- a/build/packaged/semantic.min.css.REMOVED.git-id
+++ b/build/packaged/semantic.min.css.REMOVED.git-id
@@ -1 +1 @@
-b7636b61e0eef29a12061b48a868a9e068c53e3e
\ No newline at end of file
+b0ec8166f714ced9d33f7a1951b95fabfd537e30
\ No newline at end of file
diff --git a/build/packaged/semantic.min.js.REMOVED.git-id b/build/packaged/semantic.min.js.REMOVED.git-id
index 535bbbbf0..0f2edb664 100644
--- a/build/packaged/semantic.min.js.REMOVED.git-id
+++ b/build/packaged/semantic.min.js.REMOVED.git-id
@@ -1 +1 @@
-65eb06ab5a8c5e6faeff36c10aa62407d58263b8
\ No newline at end of file
+ae771e69f8c7c57ef0ea00bb2ff842350427a102
\ No newline at end of file
diff --git a/build/uncompressed/modules/dropdown.css b/build/uncompressed/modules/dropdown.css
index ace5f836e..08d9ab37e 100644
--- a/build/uncompressed/modules/dropdown.css
+++ b/build/uncompressed/modules/dropdown.css
@@ -17,6 +17,11 @@
display: inline-block;
line-height: 1;
white-space: nowrap;
+ -webkit-transition: border-radius 0.1s ease-out;
+ -moz-transition: border-radius 0.1s ease-out;
+ -o-transition: border-radius 0.1s ease-out;
+ -ms-transition: border-radius 0.1s ease-out;
+ transition: border-radius 0.1s ease-out;
}
.ui.dropdown .menu {
position: absolute;
diff --git a/build/uncompressed/modules/dropdown.js b/build/uncompressed/modules/dropdown.js
index 8efc564f7..2bbd22352 100644
--- a/build/uncompressed/modules/dropdown.js
+++ b/build/uncompressed/modules/dropdown.js
@@ -43,6 +43,8 @@ $.fn.dropdown = function(parameters) {
className = settings.className,
namespace = settings.namespace,
+ animation = settings.animation,
+
errors = settings.errors,
module
;
@@ -76,7 +78,6 @@ $.fn.dropdown = function(parameters) {
module.debug('Checking if click was inside the dropdown', event.target);
if( $(event.target).closest($module).size() == 0 ) {
module.hide();
- module.intent.unbind();
}
},
@@ -128,32 +129,70 @@ $.fn.dropdown = function(parameters) {
;
},
+ animate: {
+ show: function() {
+ if(animation.show == 'show') {
+ $menu
+ .show()
+ ;
+ }
+ else if(animation.show == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 0)
+ .delay(100)
+ .animate({
+ opacity : 1
+ }, 300, 'easeOutQuad')
+ .end()
+ .slideDown(200, 'easeOutQuad')
+ ;
+ }
+ },
+ hide: function() {
+ console.log(animation.hide);
+ if(animation.hide == 'hide') {
+ $menu
+ .hide()
+ ;
+ }
+ else if(animation.hide == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 1)
+ .animate({
+ opacity : 0
+ }, 300, 'easeOutQuad')
+ .end()
+ .delay(100)
+ .slideUp(200, 'easeOutQuad')
+ ;
+ }
+ }
+ },
+
show: function() {
- module.debug('Enabling dropdown');
+ module.debug('Showing dropdown');
$module
.addClass(className.active)
;
+ module.animate.show();
if( module.can.click() ) {
module.intent.bind();
}
- $menu
- .show()
- ;
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onShow, $menu.get())();
},
hide: function() {
- module.debug('Disabling dropdown');
+ module.debug('Hiding dropdown');
$module
.removeClass(className.active)
;
if( module.can.click() ) {
module.intent.unbind();
}
- $menu
- .hide()
- ;
+ module.animate.hide();
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onHide, $menu.get())();
},
@@ -319,6 +358,11 @@ $.fn.dropdown.settings = {
verbose : true,
debug : true,
performance : false,
+
+ animation: {
+ show: 'slide',
+ hide: 'slide'
+ },
on : 'click',
diff --git a/node/src/files/components/semantic/modules/dropdown.css b/node/src/files/components/semantic/modules/dropdown.css
index ace5f836e..08d9ab37e 100644
--- a/node/src/files/components/semantic/modules/dropdown.css
+++ b/node/src/files/components/semantic/modules/dropdown.css
@@ -17,6 +17,11 @@
display: inline-block;
line-height: 1;
white-space: nowrap;
+ -webkit-transition: border-radius 0.1s ease-out;
+ -moz-transition: border-radius 0.1s ease-out;
+ -o-transition: border-radius 0.1s ease-out;
+ -ms-transition: border-radius 0.1s ease-out;
+ transition: border-radius 0.1s ease-out;
}
.ui.dropdown .menu {
position: absolute;
diff --git a/node/src/files/components/semantic/modules/dropdown.js b/node/src/files/components/semantic/modules/dropdown.js
index 8efc564f7..2bbd22352 100644
--- a/node/src/files/components/semantic/modules/dropdown.js
+++ b/node/src/files/components/semantic/modules/dropdown.js
@@ -43,6 +43,8 @@ $.fn.dropdown = function(parameters) {
className = settings.className,
namespace = settings.namespace,
+ animation = settings.animation,
+
errors = settings.errors,
module
;
@@ -76,7 +78,6 @@ $.fn.dropdown = function(parameters) {
module.debug('Checking if click was inside the dropdown', event.target);
if( $(event.target).closest($module).size() == 0 ) {
module.hide();
- module.intent.unbind();
}
},
@@ -128,32 +129,70 @@ $.fn.dropdown = function(parameters) {
;
},
+ animate: {
+ show: function() {
+ if(animation.show == 'show') {
+ $menu
+ .show()
+ ;
+ }
+ else if(animation.show == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 0)
+ .delay(100)
+ .animate({
+ opacity : 1
+ }, 300, 'easeOutQuad')
+ .end()
+ .slideDown(200, 'easeOutQuad')
+ ;
+ }
+ },
+ hide: function() {
+ console.log(animation.hide);
+ if(animation.hide == 'hide') {
+ $menu
+ .hide()
+ ;
+ }
+ else if(animation.hide == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 1)
+ .animate({
+ opacity : 0
+ }, 300, 'easeOutQuad')
+ .end()
+ .delay(100)
+ .slideUp(200, 'easeOutQuad')
+ ;
+ }
+ }
+ },
+
show: function() {
- module.debug('Enabling dropdown');
+ module.debug('Showing dropdown');
$module
.addClass(className.active)
;
+ module.animate.show();
if( module.can.click() ) {
module.intent.bind();
}
- $menu
- .show()
- ;
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onShow, $menu.get())();
},
hide: function() {
- module.debug('Disabling dropdown');
+ module.debug('Hiding dropdown');
$module
.removeClass(className.active)
;
if( module.can.click() ) {
module.intent.unbind();
}
- $menu
- .hide()
- ;
+ module.animate.hide();
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onHide, $menu.get())();
},
@@ -319,6 +358,11 @@ $.fn.dropdown.settings = {
verbose : true,
debug : true,
performance : false,
+
+ animation: {
+ show: 'slide',
+ hide: 'slide'
+ },
on : 'click',
diff --git a/node/src/files/javascript/semantic.js b/node/src/files/javascript/semantic.js
index af802fbce..37f9fc11d 100755
--- a/node/src/files/javascript/semantic.js
+++ b/node/src/files/javascript/semantic.js
@@ -27,6 +27,7 @@ semantic.ready = function() {
// selector cache
var
$content = $('#content'),
+ $page = $('#content').children('.page'),
$ui = $('.ui').not('.hover, .down'),
$swap = $('.theme.menu .item'),
$menu = $('.sidebar'),
@@ -205,7 +206,7 @@ semantic.ready = function() {
},
- movePeek: function() {
+ showSidebar: function() {
if( sideMenu.state().state=="left" ){
sideMenu.close();
}
@@ -358,8 +359,10 @@ semantic.ready = function() {
$waypoints
.waypoint({
continuous : false,
+ context : $page,
offset : 100,
handler : function(direction) {
+ console.log('here');
var
index = (direction == 'down')
? $waypoints.index(this)
@@ -438,10 +441,10 @@ semantic.ready = function() {
$(this).removeClass('drag');
})
;
-
+
$menu
+ .on('click', handler.showSidebar)
.filter('.button')
- .on('click', handler.movePeek)
.on('mouseenter', handler.menu.mouseenter)
.on('mouseleave', handler.menu.mouseleave)
;
@@ -449,6 +452,7 @@ semantic.ready = function() {
$peek
.waypoint('sticky', {
offset : 85,
+ context : $page,
stuckClass : 'stuck'
})
;
diff --git a/node/src/files/stylesheets/semantic.css b/node/src/files/stylesheets/semantic.css
index 8b761bda0..bdc8d391a 100755
--- a/node/src/files/stylesheets/semantic.css
+++ b/node/src/files/stylesheets/semantic.css
@@ -254,7 +254,7 @@ a:hover {
/* segment headers */
-#example > .content > .segment,
+#example > .content > .page > .segment,
#example > .segment {
margin: 0px 0px 46px;
padding-top: 65px;
diff --git a/node/src/layouts/default.html.eco b/node/src/layouts/default.html.eco
index f9da6237e..948398f71 100755
--- a/node/src/layouts/default.html.eco
+++ b/node/src/layouts/default.html.eco
@@ -14,7 +14,7 @@
-
+
<%- @getBlock('meta').toHTML() %>
diff --git a/src/modules/dropdown.js b/src/modules/dropdown.js
index 8efc564f7..2bbd22352 100644
--- a/src/modules/dropdown.js
+++ b/src/modules/dropdown.js
@@ -43,6 +43,8 @@ $.fn.dropdown = function(parameters) {
className = settings.className,
namespace = settings.namespace,
+ animation = settings.animation,
+
errors = settings.errors,
module
;
@@ -76,7 +78,6 @@ $.fn.dropdown = function(parameters) {
module.debug('Checking if click was inside the dropdown', event.target);
if( $(event.target).closest($module).size() == 0 ) {
module.hide();
- module.intent.unbind();
}
},
@@ -128,32 +129,70 @@ $.fn.dropdown = function(parameters) {
;
},
+ animate: {
+ show: function() {
+ if(animation.show == 'show') {
+ $menu
+ .show()
+ ;
+ }
+ else if(animation.show == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 0)
+ .delay(100)
+ .animate({
+ opacity : 1
+ }, 300, 'easeOutQuad')
+ .end()
+ .slideDown(200, 'easeOutQuad')
+ ;
+ }
+ },
+ hide: function() {
+ console.log(animation.hide);
+ if(animation.hide == 'hide') {
+ $menu
+ .hide()
+ ;
+ }
+ else if(animation.hide == 'slide') {
+ $menu
+ .children()
+ .css('opacity', 1)
+ .animate({
+ opacity : 0
+ }, 300, 'easeOutQuad')
+ .end()
+ .delay(100)
+ .slideUp(200, 'easeOutQuad')
+ ;
+ }
+ }
+ },
+
show: function() {
- module.debug('Enabling dropdown');
+ module.debug('Showing dropdown');
$module
.addClass(className.active)
;
+ module.animate.show();
if( module.can.click() ) {
module.intent.bind();
}
- $menu
- .show()
- ;
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onShow, $menu.get())();
},
hide: function() {
- module.debug('Disabling dropdown');
+ module.debug('Hiding dropdown');
$module
.removeClass(className.active)
;
if( module.can.click() ) {
module.intent.unbind();
}
- $menu
- .hide()
- ;
+ module.animate.hide();
$.proxy(settings.onChange, $menu.get())();
$.proxy(settings.onHide, $menu.get())();
},
@@ -319,6 +358,11 @@ $.fn.dropdown.settings = {
verbose : true,
debug : true,
performance : false,
+
+ animation: {
+ show: 'slide',
+ hide: 'slide'
+ },
on : 'click',
diff --git a/src/modules/dropdown.less b/src/modules/dropdown.less
index a6feff2e0..4daab2c7f 100644
--- a/src/modules/dropdown.less
+++ b/src/modules/dropdown.less
@@ -21,6 +21,12 @@
line-height: 1;
white-space: nowrap;
+
+ -webkit-transition: border-radius 0.1s ease-out;
+ -moz-transition: border-radius 0.1s ease-out;
+ -o-transition: border-radius 0.1s ease-out;
+ -ms-transition: border-radius 0.1s ease-out;
+ transition: border-radius 0.1s ease-out;
}
.ui.dropdown .menu {
@@ -116,6 +122,7 @@
Variations
*******************************/
+
/*--------------
Simple
---------------*/