richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

modal fixes for css animation and other stuff

pull/13/head
Jack Lukic 11 years ago
parent
e035a08cbd
commit
c9d0ba894c
11 changed files with 140 additions and 142 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 47
      build/minified/modules/modal.js
  2. 47
      build/packaged/modules/modal.js
  3. 47
      build/uncompressed/modules/modal.js
  4. 1
      build/uncompressed/modules/search.css
  5. 14
      build/uncompressed/modules/transition.css
  6. 47
      node/src/files/components/semantic/modules/modal.js
  7. 1
      node/src/files/components/semantic/modules/search.css
  8. 14
      node/src/files/components/semantic/modules/transition.css
  9. 47
      src/modules/modal.js
  10. 1
      src/modules/search.less
  11. 16
      src/modules/transition.less

47
build/minified/modules/modal.js
View File

@ -171,29 +171,20 @@
;
startPosition = finalPosition + settings.animationOffset;
// set top margin as offset
if($.fn.popIn !== undefined) {
$modal
.css({
top: topCentering,
marginTop : finalPosition + 'px'
})
;
if(settings.transition && $.fn.transition !== undefined) {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : finalPosition + 'px'
})
.popIn()
.transition(settings.transition, settings.duration)
;
}
else {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : startPosition + 'px'
})
.animate({
opacity : 1,
marginTop : finalPosition + 'px'
}, (settings.duration + 300), settings.easing)
.fadeIn(settings.duration, settings.easing)
;
}
if( $otherModals.is(':visible') ) {
@ -204,7 +195,7 @@
}
$.dimScreen({
context : settings.context,
duration : 0,
duration : 400,
dim : function() {
$(document)
.on('keyup.' + namespace, function(event) {
@ -240,12 +231,18 @@
.off('keyup.' + namespace)
;
$.unDimScreen({
duration: 0,
duration: 4000,
unDim: function() {
$modal
.popOut(200)
;
settings.unDim();
if(settings.transition && $.fn.transition !== undefined) {
$modal
.transition(settings.transition, settings.duration, settings.unDim)
;
}
else {
$modal
.fadeOut(settings.duration, settings.easing, settings.unDim)
;
}
}
});
},
@ -344,6 +341,8 @@
hide : function(){},
show : function(){},
transition : 'scale',
context : 'body',
opacity : 0.8,

47
build/packaged/modules/modal.js
View File

@ -171,29 +171,20 @@
;
startPosition = finalPosition + settings.animationOffset;
// set top margin as offset
if($.fn.popIn !== undefined) {
$modal
.css({
top: topCentering,
marginTop : finalPosition + 'px'
})
;
if(settings.transition && $.fn.transition !== undefined) {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : finalPosition + 'px'
})
.popIn()
.transition(settings.transition, settings.duration)
;
}
else {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : startPosition + 'px'
})
.animate({
opacity : 1,
marginTop : finalPosition + 'px'
}, (settings.duration + 300), settings.easing)
.fadeIn(settings.duration, settings.easing)
;
}
if( $otherModals.is(':visible') ) {
@ -204,7 +195,7 @@
}
$.dimScreen({
context : settings.context,
duration : 0,
duration : 400,
dim : function() {
$(document)
.on('keyup.' + namespace, function(event) {
@ -240,12 +231,18 @@
.off('keyup.' + namespace)
;
$.unDimScreen({
duration: 0,
duration: 4000,
unDim: function() {
$modal
.popOut(200)
;
settings.unDim();
if(settings.transition && $.fn.transition !== undefined) {
$modal
.transition(settings.transition, settings.duration, settings.unDim)
;
}
else {
$modal
.fadeOut(settings.duration, settings.easing, settings.unDim)
;
}
}
});
},
@ -344,6 +341,8 @@
hide : function(){},
show : function(){},
transition : 'scale',
context : 'body',
opacity : 0.8,

47
build/uncompressed/modules/modal.js
View File

@ -171,29 +171,20 @@
;
startPosition = finalPosition + settings.animationOffset;
// set top margin as offset
if($.fn.popIn !== undefined) {
$modal
.css({
top: topCentering,
marginTop : finalPosition + 'px'
})
;
if(settings.transition && $.fn.transition !== undefined) {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : finalPosition + 'px'
})
.popIn()
.transition(settings.transition, settings.duration)
;
}
else {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : startPosition + 'px'
})
.animate({
opacity : 1,
marginTop : finalPosition + 'px'
}, (settings.duration + 300), settings.easing)
.fadeIn(settings.duration, settings.easing)
;
}
if( $otherModals.is(':visible') ) {
@ -204,7 +195,7 @@
}
$.dimScreen({
context : settings.context,
duration : 0,
duration : 400,
dim : function() {
$(document)
.on('keyup.' + namespace, function(event) {
@ -240,12 +231,18 @@
.off('keyup.' + namespace)
;
$.unDimScreen({
duration: 0,
duration: 4000,
unDim: function() {
$modal
.popOut(200)
;
settings.unDim();
if(settings.transition && $.fn.transition !== undefined) {
$modal
.transition(settings.transition, settings.duration, settings.unDim)
;
}
else {
$modal
.fadeOut(settings.duration, settings.easing, settings.unDim)
;
}
}
});
},
@ -344,6 +341,8 @@
hide : function(){},
show : function(){},
transition : 'scale',
context : 'body',
opacity : 0.8,

1
build/uncompressed/modules/search.css
View File

@ -179,6 +179,7 @@
.ui.search.loading .input .icon {
background: url(../images/loader-mini.gif) no-repeat 50% 50%;
}
.ui.search.loading .input .icon:before,
.ui.search.loading .input .icon:after {
display: none;
}

14
build/uncompressed/modules/transition.css
View File

@ -158,23 +158,23 @@
animation-name: fadeUp;
}
.ui.fade.up.transition.out {
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
}
.ui.fade.down.transition.in {
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
}
.ui.fade.down.transition.in {
.ui.fade.down.transition.out {
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
}
.ui.fade.down.transition.out {
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
}
/*--------------
Scale
---------------*/

47
node/src/files/components/semantic/modules/modal.js
View File

@ -171,29 +171,20 @@
;
startPosition = finalPosition + settings.animationOffset;
// set top margin as offset
if($.fn.popIn !== undefined) {
$modal
.css({
top: topCentering,
marginTop : finalPosition + 'px'
})
;
if(settings.transition && $.fn.transition !== undefined) {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : finalPosition + 'px'
})
.popIn()
.transition(settings.transition, settings.duration)
;
}
else {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : startPosition + 'px'
})
.animate({
opacity : 1,
marginTop : finalPosition + 'px'
}, (settings.duration + 300), settings.easing)
.fadeIn(settings.duration, settings.easing)
;
}
if( $otherModals.is(':visible') ) {
@ -204,7 +195,7 @@
}
$.dimScreen({
context : settings.context,
duration : 0,
duration : 400,
dim : function() {
$(document)
.on('keyup.' + namespace, function(event) {
@ -240,12 +231,18 @@
.off('keyup.' + namespace)
;
$.unDimScreen({
duration: 0,
duration: 4000,
unDim: function() {
$modal
.popOut(200)
;
settings.unDim();
if(settings.transition && $.fn.transition !== undefined) {
$modal
.transition(settings.transition, settings.duration, settings.unDim)
;
}
else {
$modal
.fadeOut(settings.duration, settings.easing, settings.unDim)
;
}
}
});
},
@ -344,6 +341,8 @@
hide : function(){},
show : function(){},
transition : 'scale',
context : 'body',
opacity : 0.8,

1
node/src/files/components/semantic/modules/search.css
View File

@ -179,6 +179,7 @@
.ui.search.loading .input .icon {
background: url(../images/loader-mini.gif) no-repeat 50% 50%;
}
.ui.search.loading .input .icon:before,
.ui.search.loading .input .icon:after {
display: none;
}

14
node/src/files/components/semantic/modules/transition.css
View File

@ -158,23 +158,23 @@
animation-name: fadeUp;
}
.ui.fade.up.transition.out {
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
}
.ui.fade.down.transition.in {
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
}
.ui.fade.down.transition.in {
.ui.fade.down.transition.out {
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
}
.ui.fade.down.transition.out {
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
}
/*--------------
Scale
---------------*/

47
src/modules/modal.js
View File

@ -171,29 +171,20 @@
;
startPosition = finalPosition + settings.animationOffset;
// set top margin as offset
if($.fn.popIn !== undefined) {
$modal
.css({
top: topCentering,
marginTop : finalPosition + 'px'
})
;
if(settings.transition && $.fn.transition !== undefined) {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : finalPosition + 'px'
})
.popIn()
.transition(settings.transition, settings.duration)
;
}
else {
$modal
.css({
display : 'block',
opacity : 0,
top: topCentering,
marginTop : startPosition + 'px'
})
.animate({
opacity : 1,
marginTop : finalPosition + 'px'
}, (settings.duration + 300), settings.easing)
.fadeIn(settings.duration, settings.easing)
;
}
if( $otherModals.is(':visible') ) {
@ -204,7 +195,7 @@
}
$.dimScreen({
context : settings.context,
duration : 0,
duration : 400,
dim : function() {
$(document)
.on('keyup.' + namespace, function(event) {
@ -240,12 +231,18 @@
.off('keyup.' + namespace)
;
$.unDimScreen({
duration: 0,
duration: 4000,
unDim: function() {
$modal
.popOut(200)
;
settings.unDim();
if(settings.transition && $.fn.transition !== undefined) {
$modal
.transition(settings.transition, settings.duration, settings.unDim)
;
}
else {
$modal
.fadeOut(settings.duration, settings.easing, settings.unDim)
;
}
}
});
},
@ -344,6 +341,8 @@
hide : function(){},
show : function(){},
transition : 'scale',
context : 'body',
opacity : 0.8,

1
src/modules/search.less
View File

@ -221,6 +221,7 @@
.ui.search.loading .input .icon {
background: url(../images/loader-mini.gif) no-repeat 50% 50%;
}
.ui.search.loading .input .icon:before,
.ui.search.loading .input .icon:after {
display: none;
}

16
src/modules/transition.less
View File

@ -182,10 +182,10 @@
animation-name: fadeUp;
}
.ui.fade.up.transition.out {
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
}
.ui.fade.down.transition.in {
@ -195,10 +195,10 @@
animation-name: fadeDown;
}
.ui.fade.down.transition.out {
-webkit-animation-name: fadeUp;
-moz-animation-name: fadeUp;
-o-animation-name: fadeUp;
animation-name: fadeUp;
-webkit-animation-name: fadeDown;
-moz-animation-name: fadeDown;
-o-animation-name: fadeDown;
animation-name: fadeDown;
}
/*--------------

Write Preview
Loading…
Cancel
Save