feat(app): fade in main content on launch

nano-wallet-company · Mar 27, 2018 · 6139053 · 6139053
1 parent 72116f3
commit 6139053
Showing 1 changed file with 13 additions and 2 deletions.
diff --git a/app/styles/app.scss b/app/styles/app.scss
@@ -12,8 +12,6 @@
 
 @import "history";
 
-@import "pod-styles";
-
 body {
   background-image: linear-gradient(-180deg, #000064 0%, #000034 100%);
   height: 100vh;
@@ -26,6 +24,8 @@ main {
   display: flex;
   flex-direction: column;
   justify-content: space-evenly;
+  will-change: opacity;
+  animation: fadeIn 1s ease;
 
   hr {
     border-top: 1px solid $purple;
@@ -74,6 +74,15 @@ code {
   }
 }
 
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
 @keyframes loading {
   0% {
     transform: rotate(0deg);
@@ -85,3 +94,5 @@ code {
     transform: rotate(360deg);
   }
 }
+
+@import "pod-styles";