diff --git a/app/assets/stylesheets/application/topic-post.css.scss b/app/assets/stylesheets/application/topic-post.css.scss
index a09142206..9b95434e1 100644
--- a/app/assets/stylesheets/application/topic-post.css.scss
+++ b/app/assets/stylesheets/application/topic-post.css.scss
@@ -200,6 +200,7 @@
   section.post-menu-area {
     .discourse-no-touch & {
       opacity: 0.2;
+      @include fade-soft(1s);
     }
   }
 
diff --git a/app/assets/stylesheets/foundation/mixins.scss b/app/assets/stylesheets/foundation/mixins.scss
index b4c4193f9..149a459c3 100644
--- a/app/assets/stylesheets/foundation/mixins.scss
+++ b/app/assets/stylesheets/foundation/mixins.scss
@@ -160,6 +160,14 @@
   }
 }
 
+@mixin fade-soft($time: 1s) {
+  transition: opacity $time ease-in-out;
+  -moz-transition: opacity $time ease-in-out;
+  -webkit-transition: opacity $time ease-in-out;
+  -ms-transition: opacity $time ease-in-out;
+  -o-transition: opacity $time ease-in-out;
+}
+
 @mixin visible {
   opacity: 1;
   visibility: visible;