Browse Source

Google theme is now material, updates fadeup/down scale transitions to not be relative to size of element. Now specified in rem

pull/1243/merge
jlukic 10 years ago
parent
commit
496eb988be
6 changed files with 17 additions and 13 deletions
  1. 8
      src/definitions/modules/popup.js
  2. 22
      src/themes/default/modules/transition.overrides
  3. 0
      src/themes/material/collections/message.overrides
  4. 0
      src/themes/material/collections/message.variables
  5. 0
      src/themes/material/elements/button.overrides
  6. 0
      src/themes/material/elements/button.variables

8
src/definitions/modules/popup.js

@ -325,16 +325,14 @@ $.fn.popup = function(parameters) {
show: function(callback) {
callback = $.isFunction(callback) ? callback : function(){};
if(settings.transition && $.fn.transition !== undefined && $module.transition('is supported')) {
$module
.addClass(className.visible)
;
$popup
.transition({
animation : settings.transition + ' in',
queue : false,
duration : settings.duration,
onStart : function() {
$module
.addClass(className.visible)
;
},
onComplete : function() {
module.bind.close();
$.proxy(callback, element)();

22
src/themes/default/modules/transition.overrides

@ -260,22 +260,22 @@
@keyframes fadeUpIn {
0% {
opacity: 0;
transform: translateY(10%);
transform: translateY(3rem);
}
100% {
opacity: 1;
transform: translateY(0%);
transform: translateY(0rem);
}
}
@keyframes fadeUpOut {
0% {
opacity: 1;
transform: translateY(0%);
transform: translateY(0rem);
}
100% {
opacity: 0;
transform: translateY(10%);
transform: translateY(3rem);
}
}
@ -283,21 +283,21 @@
@keyframes fadeDownIn {
0% {
opacity: 0;
transform: translateY(-10%);
transform: translateY(-3rem);
}
100% {
opacity: 1;
transform: translateY(0%);
transform: translateY(0rem);
}
}
@keyframes fadeDownOut {
0% {
opacity: 1;
transform: translateY(0%);
transform: translateY(0rem);
}
100% {
opacity: 0;
transform: translateY(-10%);
transform: translateY(-3rem);
}
}
@ -305,6 +305,12 @@
Scale
---------------*/
.scale.transition {
transform-origin: 50% 10rem;
-ms-transform-origin: 50% 10rem;
-webkit-transform-origin: 50% 10rem;
}
.scale.transition.in {
animation-name: scaleIn;
}

src/themes/google/collections/message.overrides → src/themes/material/collections/message.overrides

src/themes/google/collections/message.variables → src/themes/material/collections/message.variables

src/themes/google/elements/button.overrides → src/themes/material/elements/button.overrides

src/themes/google/elements/button.variables → src/themes/material/elements/button.variables

Loading…
Cancel
Save