From 5a83e2c11cc9a91da65b6b33bd1ae88d326b911b Mon Sep 17 00:00:00 2001
From: srgooglo <srgooglo@ragestudio.net>
Date: Wed, 2 Mar 2022 21:05:53 +0100
Subject: [PATCH] mix opacity with actions bar when hover the card

---
 .../app/src/components/PostCard/index.less    | 32 +++++++++++--------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/packages/app/src/components/PostCard/index.less b/packages/app/src/components/PostCard/index.less
index 9cddaf3b..84c89b47 100644
--- a/packages/app/src/components/PostCard/index.less
+++ b/packages/app/src/components/PostCard/index.less
@@ -21,19 +21,6 @@
         outline-color: var(--primaryColor);
     }
 
-    .actionsIndicator {
-        display        : flex;
-        flex-direction : row;
-        align-items    : center;
-        justify-content: center;
-
-        width        : 100%;
-        margin-bottom: 5px;
-
-        font-size: 18px;
-        color    : var(--background-color-contrast);
-    }
-
     .wrapper {
         display       : inline-flex;
         flex-direction: column;
@@ -128,6 +115,21 @@
         }
     }
 
+    .actionsIndicator {
+        display        : flex;
+        flex-direction : row;
+        align-items    : center;
+        justify-content: center;
+
+        width        : 100%;
+        margin-bottom: 5px;
+
+        font-size: 18px;
+        color    : var(--background-color-contrast);
+        
+        transition   : all 0.2s ease-in-out;
+    }
+
     .actionsWrapper {
         display        : flex;
         flex-direction : row;
@@ -232,6 +234,10 @@
     .actionsWrapper {
         animation: fadeActionsIn 0.2s 0.2s linear forwards;
     }
+
+    .actionsIndicator {
+        opacity: 0;
+    }
 }
 
 @keyframes fadeActionsIn {