Inspirado en este tema, y los colores personalizados de los roles de Discord, he escrito este código muy simple que añade un data-mention a las menciones de grupos y usuarios, de esta manera poder poner diferentes colores (Y no un “color general”) vía CSS ![]()
El código por el momento es JQuery pero en algún momento lo cambiaré a Vanilla JavaScript ![]()
Para aplicarlo solo tienes que pegar el código en la cabecera de tu tema o 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>
Después de esto puedes aplicar el estilo que quieras a través de CSS ![]()
Por ejemplo:
a.mention[data-mention="Alexander"] {
color: #4527a0 !important;
}
![]()
En este caso fue para un nombre de usuario específico, sin embargo también funciona para grupos usando a.mention-group[data-mention="group-name"]
Miraré de hacer de esto un componente de tema que se pueda personalizar desde sus “ajustes” sin modificar el CSS ![]()