From bfa9686b400ba09f8eec59046bc907baf7c229a6 Mon Sep 17 00:00:00 2001
From: Gislene Pereira <gislene01@gmail.com>
Date: Thu, 10 Mar 2016 14:57:12 -0300
Subject: Creating events to spin and stop spinning the logo. Logo will spin
 when user selects another tag on the left bar and stops when the list of
 mails is rendered.

Issue #238
---
 web-ui/app/scss/_mixins.scss | 52 ++++++++++++++++++++++++--------------------
 1 file changed, 28 insertions(+), 24 deletions(-)

(limited to 'web-ui/app/scss/_mixins.scss')

diff --git a/web-ui/app/scss/_mixins.scss b/web-ui/app/scss/_mixins.scss
index 4360b886..6d0bb1a3 100644
--- a/web-ui/app/scss/_mixins.scss
+++ b/web-ui/app/scss/_mixins.scss
@@ -310,33 +310,37 @@
 
 @mixin logo {
   @keyframes hideshow {
-  0% { fill: lighten($logo_color, 30); }
-  25% { opacity: 1; }
-  100% { opacity: 0; }
-} 
-
-.logo-part {
-  animation: hideshow 0.6s ease infinite;
-  opacity: 1;
-
-  &:nth-child(2) {
-    opacity: 0;
-    animation-delay: 0.1s;
-  }
+    0% { fill: lighten($logo_color, 30); }
+    25% { opacity: 1; }
+    100% { opacity: 0; }
+  } 
 
-  &:nth-child(3) {
-    animation-delay: 0.2s;
-  }
-  &:nth-child(4) {
-    animation-delay: 0.3s;
-  }
-  &:nth-child(5) {
-    animation-delay: 0.4s;
+  .logo-part-animation-off {
+      animation: none;
   }
-  &:nth-child(6) {
-    animation-delay: 0.5s;
+
+  .logo-part-animation-on {
+      animation: hideshow 0.6s ease infinite;
+      opacity: 1;
+
+      &:nth-child(2) {
+        opacity: 0;
+        animation-delay: 0.1s;
+      }
+
+      &:nth-child(3) {
+        animation-delay: 0.2s;
+      }
+      &:nth-child(4) {
+        animation-delay: 0.3s;
+      }
+      &:nth-child(5) {
+        animation-delay: 0.4s;
+      }
+      &:nth-child(6) {
+        animation-delay: 0.5s;
+      }
   }
 }
-}
 
 @include tt-hint;
-- 
cgit v1.2.3