From 53d5d77ca5f9c9cd0d5d51ad49c8482e8799a1b8 Mon Sep 17 00:00:00 2001
From: Andrew Cravenho <andrew@cravenho.me>
Date: Fri, 1 Feb 2019 07:31:31 -0500
Subject: [PATCH] Fix block reward styling on Mobile

---
 .../assets/css/components/_animations.scss    | 25 +++++++++++++++----
 1 file changed, 20 insertions(+), 5 deletions(-)

diff --git a/apps/block_scout_web/assets/css/components/_animations.scss b/apps/block_scout_web/assets/css/components/_animations.scss
index d673e9067a..57a20fd214 100644
--- a/apps/block_scout_web/assets/css/components/_animations.scss
+++ b/apps/block_scout_web/assets/css/components/_animations.scss
@@ -1,7 +1,17 @@
 @keyframes fade-in {
-  0% {transform: scale(0.97); opacity: 0;}
-  50% {transform: scale(1);}
-  100% {transform: scale(1); opacity: 1;}
+  0% {
+    transform: scale(0.97);
+    opacity: 0;
+  }
+
+  50% {
+    transform: scale(1);
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
 }
 
 @keyframes fade-up-blocks-chain {
@@ -11,9 +21,11 @@
     opacity: 0;
     overflow-x: hidden;
   }
+
   50% {
     opacity: 0;
   }
+
   100% {
     flex-basis: 25%;
     width: 25%;
@@ -27,10 +39,12 @@
     height: 0;
     opacity: 0;
   }
+
   25% {
     opacity: 0;
     transform: translateY(10px) scale(0.97);
   }
+
   100% {
     height: 100%;
     opacity: 1;
@@ -43,6 +57,7 @@
     transform: scale(1);
     opacity: 1;
   }
+
   100% {
     opacity: 0;
     transform: scale(0.75);
@@ -68,7 +83,7 @@
   animation: fade-up 0.6s cubic-bezier(0.455, 0.03, 0.515, 0.955);
 
   @media (max-width: 767px) {
-    max-height: 234px;
+    max-height: 300px;
     animation: fade-up--mobile 0.6s cubic-bezier(0.455, 0.03, 0.515, 0.955);
   }
 }
@@ -76,4 +91,4 @@
 .shrink-out {
   transform-origin: bottom center;
   animation: shrink-out 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19) forwards;
-}
+}
\ No newline at end of file