diff --git a/webroot/js/message.js b/webroot/js/message.js index 91406c7ef..e000c992c 100644 --- a/webroot/js/message.js +++ b/webroot/js/message.js @@ -35,11 +35,18 @@ class Message { target: '_blank' } }); - return addNewlines(linked); + const highlighted = this.highlightUsername(linked); + return addNewlines(highlighted); } userColor() { return messageBubbleColorForString(this.author); } + + highlightUsername(message) { + const username = document.getElementById('self-message-author').value; + const pattern = new RegExp('@?' + username.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'gi'); + return message.replace(pattern, '$&'); + } } diff --git a/webroot/styles/layout.css b/webroot/styles/layout.css index 0339d38de..81de24302 100644 --- a/webroot/styles/layout.css +++ b/webroot/styles/layout.css @@ -624,6 +624,11 @@ h2 { border-radius: 15px; } +.message-text .highlighted { + color: orange; + font-weight: bold; +} + .message-text code { background-color:darkslategrey; padding: 3px;