From b0f380c4c7185795a3f8707002b9d1a237a4c88c Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Tue, 22 Nov 2022 18:17:03 -0500
Subject: [PATCH] UX: improve mention styling (#19156)

This updates mention styling. This reduces bold, increases contrast, and makes inactive mentions look more inactive.
---
 .../stylesheets/common/base/topic-post.scss   | 19 +++++++++----------
 .../common/components/hashtag.scss            |  6 ++++--
 .../stylesheets/common/foundation/mixins.scss |  3 +--
 3 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/app/assets/stylesheets/common/base/topic-post.scss b/app/assets/stylesheets/common/base/topic-post.scss
index 16970b72ab1..d9546f24b03 100644
--- a/app/assets/stylesheets/common/base/topic-post.scss
+++ b/app/assets/stylesheets/common/base/topic-post.scss
@@ -1249,27 +1249,26 @@ blockquote > *:last-child {
 }
 
 a.mention {
+  // linked
   @include mention;
 }
 
 span.mention {
-  font-weight: bold;
-  font-size: 0.93em;
-  color: var(--primary);
+  // unlinked
+  color: var(--primary-high);
 }
 
 a.mention-group {
+  // unlinked
   display: inline-block;
-  font-weight: bold;
-  font-size: 0.93em;
-  color: var(--primary);
+  color: var(--primary-high);
+  cursor: default;
 
   &.notify,
   .small-action-desc & {
-    color: var(--primary-high-or-secondary-low);
-    padding: 2px 4px;
-    background: var(--primary-low);
-    border-radius: 8px;
+    // linked
+    cursor: pointer;
+    @include mention;
   }
 }
 
diff --git a/app/assets/stylesheets/common/components/hashtag.scss b/app/assets/stylesheets/common/components/hashtag.scss
index a4f57a230f3..2c706901b9f 100644
--- a/app/assets/stylesheets/common/components/hashtag.scss
+++ b/app/assets/stylesheets/common/components/hashtag.scss
@@ -19,11 +19,13 @@ a.hashtag-cooked {
 
   &:visited,
   &:hover {
-    color: var(--primary-high-or-secondary-low);
+    color: var(--primary);
   }
 
   .d-icon {
-    margin-right: 3px;
+    color: var(--primary-high);
+    font-size: var(--font-down-1);
+    margin: 0 0.2em 0 0.1em;
   }
 }
 
diff --git a/app/assets/stylesheets/common/foundation/mixins.scss b/app/assets/stylesheets/common/foundation/mixins.scss
index 8f1227ba71a..8eff1f25a90 100644
--- a/app/assets/stylesheets/common/foundation/mixins.scss
+++ b/app/assets/stylesheets/common/foundation/mixins.scss
@@ -238,9 +238,8 @@ $hpad: 0.65em;
 
 @mixin mention() {
   display: inline-block; // https://bugzilla.mozilla.org/show_bug.cgi?id=1656119
-  font-weight: bold;
   font-size: 0.93em;
-  color: var(--primary-high-or-secondary-low);
+  color: var(--primary);
   padding: 0 4px 1px;
   background: var(--primary-low);
   border-radius: 8px;