diff --git a/app/assets/stylesheets/common/foundation/mixins.scss b/app/assets/stylesheets/common/foundation/mixins.scss
index a5fabaea24..3a8663e2b8 100644
--- a/app/assets/stylesheets/common/foundation/mixins.scss
+++ b/app/assets/stylesheets/common/foundation/mixins.scss
@@ -82,6 +82,13 @@
   }
 }
 
+@mixin fade-soft($time: 1s) {
+  -webkit-transition: opacity $time ease-in-out;
+      -ms-transition: opacity $time ease-in-out;
+          transition: opacity $time ease-in-out;
+
+}
+
 @mixin visible {
   opacity: 1;
   visibility: visible;
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index 00b252eb8c..7394f156c7 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -51,7 +51,7 @@ h1 .topic-statuses .topic-status i {
 div.actions, .post-actions {
     .discourse-no-touch & {
       opacity: 0.2;
-      @include transition(opacity linear 0.4s);
+      @include fade-soft(1s);
     }
     .discourse-touch & {opacity: 1;}
   }