Inspirado por este tópico, e pelas cores personalizadas de cargos do Discord, escrevi este código muito simples que adiciona um data-mention às menções de grupos e usuários, desta forma para poder colocar cores diferentes (e não “cor geral”) via CSS ![]()
O código no momento é JQuery, mas em algum momento o mudarei para Vanilla JavaScript ![]()
Para aplicá-lo, basta colar o código no cabeçalho do seu tema ou componente:
<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>
Depois disso, você pode aplicar o estilo que desejar através de CSS ![]()
Por exemplo:
a.mention[data-mention="Alexander"] {
color: #4527a0 !important;
}
![]()
Neste caso, foi para um nome de usuário específico, no entanto, também funciona para grupos usando a.mention-group[data-mention="nome-do-grupo"]
Vou investigar para transformar isso em um componente de tema que possa ser personalizado a partir de suas “configurações” sem modificar o CSS ![]()