Inspired by this topic, and the custom colors of Discord roles, I have written this very simple code that adds a data-mention to the mentions of groups and users, in this way to be able to place different colors (And not “general color”) via CSS ![]()
The code at the moment is JQuery but at some point I will change it to Vanilla JavaScript ![]()
To apply it you just have to paste the code in the head of your theme or component:
<script type="text/discourse-plugin" version="0.9">
$(document).ajaxSuccess(() =>{
$('a.mention').each(function() {
$(this).attr('data-mention', $(this).text().replace('@', ''));
});
$('a.mention-group').each(function() {
$(this).attr('data-mention', $(this).text().replace('@', ''));
});
});
</script>
After this you can apply the style you want through CSS ![]()
For example:
a.mention[data-mention="Alexander"] {
color: #4527a0 !important;
}
![]()
In this case it was for a specific username, however it also works for groups using a.mention-group[data-mention="group-name"]
I’ll look into making this a Theme component that can be customized from its “settings” without modifying the CSS ![]()