From 3d4ea2a52cb5c5de019bf5aedc94d182fbf7dfc8 Mon Sep 17 00:00:00 2001
From: "ala'n (Alexey Stsefanovich)" <astsefanovich@exadel.com>
Date: Sat, 1 Jul 2023 05:00:18 +0200
Subject: [PATCH] fix(esl-animate): default print styles for esl-animate ootb
 animation

---
 .../core/esl-animate-animations.less          | 72 ++++++++++---------
 1 file changed, 40 insertions(+), 32 deletions(-)

diff --git a/src/modules/esl-animate/core/esl-animate-animations.less b/src/modules/esl-animate/core/esl-animate-animations.less
index 24c6786a4..cf49b67f7 100644
--- a/src/modules/esl-animate/core/esl-animate-animations.less
+++ b/src/modules/esl-animate/core/esl-animate-animations.less
@@ -1,39 +1,47 @@
-.esl-animate-fade {
-  opacity: 0;
-  &.in {
-    opacity: 1;
-    transition: opacity 1.5s;
+@media screen {
+  .esl-animate-fade {
+    opacity: 0;
+
+    &.in {
+      opacity: 1;
+      transition: opacity 1.5s;
+    }
   }
-}
 
-.esl-animate-slide {
-  --esl-animation-offset-x: 0;
-  --esl-animation-offset-y: 0;
+  .esl-animate-slide {
+    --esl-animation-offset-x: 0;
+    --esl-animation-offset-y: 0;
 
-  opacity: 0;
-  transform: translate3d(var(--esl-animation-offset-x), var(--esl-animation-offset-y), 0);
 
-  &.in {
-    opacity: 1;
-    transform: translate3d(0, 0, 0);
-    transition: transform 1s, opacity 1s;
-  }
-  &:not(.in) {
-    position: relative;
-    top: calc(~'-1 * var(--esl-animation-offset-y)');
-    left: calc(~'-1 * var(--esl-animation-offset-x)');
-  }
+    opacity: 0;
+    transform: translate3d(var(--esl-animation-offset-x), var(--esl-animation-offset-y), 0);
 
-  &.up {
-    --esl-animation-offset-y: 30px;
-  }
-  &.down {
-    --esl-animation-offset-y: -30px;
-  }
-  &.left {
-    --esl-animation-offset-x: 30px;
-  }
-  &.right {
-    --esl-animation-offset-x: -30px;
+    &.in {
+      opacity: 1;
+      transform: translate3d(0, 0, 0);
+      transition: transform 1s, opacity 1s;
+    }
+
+    &:not(.in) {
+      position: relative;
+      top: calc(~'-1 * var(--esl-animation-offset-y)');
+      left: calc(~'-1 * var(--esl-animation-offset-x)');
+    }
+
+    &.up {
+      --esl-animation-offset-y: 30px;
+    }
+
+    &.down {
+      --esl-animation-offset-y: -30px;
+    }
+
+    &.left {
+      --esl-animation-offset-x: 30px;
+    }
+
+    &.right {
+      --esl-animation-offset-x: -30px;
+    }
   }
 }