メンションのカラーをカスタマイズ

このトピックとDiscordのロールのカスタムカラーに着想を得て、グループやユーザーのメンションにdata-mentionを追加する非常にシンプルなコードを作成しました。これにより、CSSで(「一般的な色」ではなく)異なる色を設定できます :smile:

現在のコードはJQueryですが、いずれVanilla JavaScriptに変更する予定です :sweat_smile:

適用するには、テーマまたはコンポーネントのheadにコードを貼り付けるだけです。

<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>

その後、CSSで好きなスタイルを適用できます :partying_face:
例:

a.mention[data-mention="Alexander"] {
  color: #4527a0 !important;
}

CapturaMentionUser

この例は特定のユーザー名用でしたが、グループでもa.mention-group[data-mention="group-name"]を使用して機能します。

これを、CSSを変更せずに「設定」からカスタマイズできるテーマコンポーネントにすることを検討します :thinking:

「いいね!」 10

ここに提示しておきます。このトピックによく合うと思います。特にこれです。

「いいね!」 4

グループに属する全員のメンションに色を付けるように調整することは可能ですか?

+1

ユーザーメンションのリストを含むトピックで、グループに属していない(またはグループに属している)ユーザーを特定する方法を探しています。