From c12d40d0da0212d26039eaefd3c804e9511108f3 Mon Sep 17 00:00:00 2001
From: Paul Makles <paulmakles@gmail.com>
Date: Fri, 8 Jul 2022 16:58:21 +0100
Subject: [PATCH] fix: correct mention styling

---
 src/components/markdown/plugins/mentions.tsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/components/markdown/plugins/mentions.tsx b/src/components/markdown/plugins/mentions.tsx
index 917d8cda..eae6938b 100644
--- a/src/components/markdown/plugins/mentions.tsx
+++ b/src/components/markdown/plugins/mentions.tsx
@@ -7,19 +7,28 @@ import { createComponent, CustomComponentProps } from "./remarkRegexComponent";
 
 const Mention = styled.a`
     gap: 4px;
-    padding: 0 6px;
     flex-shrink: 0;
+    padding-left: 2px;
+    padding-right: 6px;
     align-items: center;
     display: inline-flex;
+    vertical-align: middle;
 
     cursor: pointer;
 
     font-weight: 600;
+    text-decoration: none !important;
     background: var(--secondary-background);
     border-radius: calc(var(--border-radius) * 2);
 
+    transition: 0.1s ease filter;
+
     &:hover {
-        text-decoration: none;
+        filter: brightness(0.75);
+    }
+
+    &:active {
+        filter: brightness(0.65);
     }
 
     svg {