From 7d6fc044fbcf2c6f82f759605a0fd5c1aebae55a Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 7 Jun 2021 23:42:04 +0300 Subject: new mentions look --- src/components/mention_link/mention_link.js | 28 ++++++++++++++-------------- 1 file changed, 14 insertions(+), 14 deletions(-) (limited to 'src/components/mention_link/mention_link.js') diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js index ade598d8..d26ae337 100644 --- a/src/components/mention_link/mention_link.js +++ b/src/components/mention_link/mention_link.js @@ -1,7 +1,6 @@ import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' -import { getTextColor, rgb2hex } from 'src/services/color_convert/color_convert.js' import { mapGetters, mapState } from 'vuex' -import { convert } from 'chromatism' +import { highlightClass, highlightStyle } from '../../services/user_highlighter/user_highlighter.js' const MentionLink = { name: 'MentionLink', @@ -45,21 +44,22 @@ const MentionLink = { highlight () { return this.mergedConfig.highlight[this.user.screen_name] }, - bg () { - if (this.highlight) return this.highlight.color + highlightType () { + return this.highlight && ('-' + this.highlight.type) }, - text () { - if (this.bg) { - const linkColor = this.mergedConfig.customTheme.colors.link - const color = getTextColor(convert(this.bg).rgb, convert(linkColor).rgb) - return rgb2hex(color) - } + highlightClass () { + if (this.highlight) return highlightClass(this.user) }, style () { - return [ - this.bg && `--mention-bg: ${this.bg}`, - this.text && `--mention-text: ${this.text}` - ].filter(_ => _).join('; ') + if (this.highlight) { + const { + backgroundColor, + backgroundPosition, + backgroundImage, + ...rest + } = highlightStyle(this.highlight) + return rest + } }, ...mapGetters(['mergedConfig']), ...mapState({ -- cgit v1.2.3-70-g09d2