Fix: Add variable for .on-screen-anim() mixin's transition-delay (fixes

adaptlearning#416)
redwoodperforms · Apr 17, 2023 · ca68ffd · ca68ffd
1 parent ad2a921
commit ca68ffd
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/less/_defaults/_animations.less b/less/_defaults/_animations.less
@@ -3,6 +3,7 @@
 @duration: 0.2s;
 @progress-duration: 0.5s;
 
+@animation-delay: 1s;
 @animation-duration: 2000ms;
 @animation-easing: cubic-bezier(.23,1,.32,1);
 
@@ -51,10 +52,10 @@
 // _onScreen animation mixin for 'fade-in-top', 'fade-in-bottom',
 // 'fade-in-left', and 'fade-in-right'
 // --------------------------------------------------
-.on-screen-anim(fade-in-top; 0; 1; 1s; translateY(-100px); translateY(0));
-.on-screen-anim(fade-in-bottom; 0; 1; 1s; translateY(100px); translateY(0));
-.on-screen-anim(fade-in-left; 0; 1; 1s; translateX(-100px); translateX(0));
-.on-screen-anim(fade-in-right; 0; 1; 1s; translateX(100px); translateX(0));
+.on-screen-anim(fade-in-top; 0; 1; @animation-delay; translateY(-100px); translateY(0));
+.on-screen-anim(fade-in-bottom; 0; 1; @animation-delay; translateY(100px); translateY(0));
+.on-screen-anim(fade-in-left; 0; 1; @animation-delay; translateX(-100px); translateX(0));
+.on-screen-anim(fade-in-right; 0; 1; @animation-delay; translateX(100px); translateX(0));
 
 .on-screen-anim(@selector; @opacity-before; @opacity-after; @transition-delay; @transform-before; @transform-after) {
   .@{selector}-before > div {