From db1d9104ada0187b65016a222d32d68f5288ea1f Mon Sep 17 00:00:00 2001
From: Matthew Harrison-Jones <matthojo@gmail.com>
Date: Mon, 22 Jul 2013 10:59:16 +0100
Subject: [PATCH] Success notifications now fade out after 3 seconds

---
 ghost/admin/admin-ui-temp.js                |  4 ++++
 ghost/admin/assets/sass/modules/global.scss |  5 +++++
 ghost/admin/assets/sass/modules/mixins.scss | 15 ++++++++++++++-
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/ghost/admin/admin-ui-temp.js b/ghost/admin/admin-ui-temp.js
index bf90f9e170..f8ab33f338 100644
--- a/ghost/admin/admin-ui-temp.js
+++ b/ghost/admin/admin-ui-temp.js
@@ -56,6 +56,10 @@
         });
     });
 
+    $(document).on('animationend', '.js-notification', function () {
+        $(this).hide();
+    });
+
 
     /**
      * Example of how to add a persistent notification.
diff --git a/ghost/admin/assets/sass/modules/global.scss b/ghost/admin/assets/sass/modules/global.scss
index 2a2122df58..e1302e87be 100644
--- a/ghost/admin/assets/sass/modules/global.scss
+++ b/ghost/admin/assets/sass/modules/global.scss
@@ -870,6 +870,11 @@ nav {
     @extend %notification;
     @include icon($i-success);
     background: $green;
+
+    @include animation(fade-out 1s linear);
+    @include animation-delay(3s);
+    @include animation-iteration-count(1);
+    @include animation-fill-mode(forwards);
 }
 
 .notification-error {
diff --git a/ghost/admin/assets/sass/modules/mixins.scss b/ghost/admin/assets/sass/modules/mixins.scss
index fa270eaac9..68ca02f080 100644
--- a/ghost/admin/assets/sass/modules/mixins.scss
+++ b/ghost/admin/assets/sass/modules/mixins.scss
@@ -178,4 +178,17 @@ $green: #9FBB58;
       text-decoration: none;
     }
   }
-}
\ No newline at end of file
+}
+
+/* =============================================================================
+   Animations
+   ============================================================================= */
+
+@include keyframes(fade-out) {
+    from {
+        opacity: 1;
+    }
+    to {
+        opacity: 0;
+    }
+}