fix: add mention hover

Fixes: #2388

Adds a specific background color to hovered mentions.
This commit is contained in:
Eric Mastro 2021-05-07 09:40:23 +10:00 committed by Iuri Matias
parent 590192ad9e
commit 46caa67d49
5 changed files with 7 additions and 2 deletions

View File

@ -79,7 +79,7 @@ Item {
if(isEmoji) {
return Emoji.parse(msg, Emoji.size.middle);
} else {
return Utils.getMessageWithStyle(Emoji.parse(msg), appSettings.useCompactMode, isCurrentUser)
return Utils.getMessageWithStyle(Emoji.parse(msg), appSettings.useCompactMode, isCurrentUser, hoveredLink)
}
}
}

View File

@ -68,6 +68,7 @@ Theme {
property color emojiReactionActiveBackgroundHovered: "#cbd5f1"
property color mentionColor: "#7BE5FF"
property color mentionBgColor: "#1a0da4c9"
property color mentionBgHoverColor: "#4d0da4c9"
property color mentionMessageColor: "#1a0da4c9"
property color mentionMessageHoverColor: "#330da4c9"
property color replyBackground: "#484848"

View File

@ -68,6 +68,7 @@ Theme {
property color emojiReactionActiveBackgroundHovered: "#cbd5f1"
property color mentionColor: "#0DA4C9"
property color mentionBgColor: "#1a07bce9"
property color mentionBgHoverColor: "#4d07bce9"
property color mentionMessageColor: "#1a07bce9"
property color mentionMessageHoverColor: "#3307bce9"
property color replyBackground: "#d7dadd"

View File

@ -52,6 +52,7 @@ QtObject {
property color emojiReactionActiveBackgroundHovered
property color mentionColor
property color mentionBgColor
property color mentionBgHoverColor
property color mentionMessageColor
property color mentionMessageHoverColor
property color mainMenuBackground

View File

@ -49,7 +49,7 @@ QtObject {
return Style.current.accountColors[colorIndex]
}
function getMessageWithStyle(msg, useCompactMode, isCurrentUser) {
function getMessageWithStyle(msg, useCompactMode, isCurrentUser, hoveredLink = "") {
return `<style type="text/css">` +
`p, img, a, del, code, blockquote { margin: 0; padding: 0; }` +
`code {` +
@ -67,7 +67,9 @@ QtObject {
`color: ${Style.current.mentionColor};` +
`background-color: ${Style.current.mentionBgColor};` +
`text-decoration: none;` +
`padding: 0px 2px;` +
`}` +
(hoveredLink !== "" ? `a.mention[href="${hoveredLink}"] { background-color: ${Style.current.mentionBgHoverColor}; }` : ``) +
`del {` +
`text-decoration: line-through;` +
`}` +