Add option to fade domains in mention link

This commit is contained in:
Tusooa Zhu 2022-01-10 02:31:26 -05:00
parent aaf0b985ad
commit 0c60b31eee
No known key found for this signature in database
GPG key ID: 7B467EDE43A08224
6 changed files with 31 additions and 2 deletions

View file

@ -115,6 +115,9 @@ const MentionLink = {
shouldShowAvatar () {
return this.mergedConfig.mentionLinkShowAvatar
},
shouldFadeDomain () {
return this.mergedConfig.mentionLinkFadeDomain
},
...mapGetters(['mergedConfig']),
...mapState({
currentUser: state => state.users.currentUser

View file

@ -100,4 +100,12 @@
opacity: 1;
pointer-events: initial;
}
.serverName.-faded {
color: var(--faintLink, $fallback--link);
}
.full .-faded {
color: var(--faint, $fallback--faint);
}
}

View file

@ -41,6 +41,7 @@
/><span
v-if="shouldShowFullUserName"
class="serverName"
:class="{ '-faded': shouldFadeDomain }"
v-html="'@' + serverName"
/></span>
<span
@ -56,8 +57,18 @@
>
<span
class="userNameFull"
v-text="'@' + userNameFull"
/>
>
<!-- eslint-disable vue/no-v-html -->
@<span
class="userName"
v-html="userName"
/><span
class="serverName"
:class="{ '-faded': shouldFadeDomain }"
v-html="'@' + serverName"
/>
<!-- eslint-enable vue/no-v-html -->
</span>
</span>
</span>
</span>

View file

@ -176,6 +176,11 @@
{{ $t('settings.mention_link_show_avatar') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="mentionLinkFadeDomain">
{{ $t('settings.mention_link_fade_domain') }}
</BooleanSetting>
</li>
</ul>
</div>

View file

@ -75,6 +75,7 @@ export const defaultState = {
mentionLinkDisplay: undefined, // instance default
mentionLinkShowTooltip: undefined, // instance default
mentionLinkShowAvatar: undefined, // instance default
mentionLinkFadeDomain: undefined, // instance default
hidePostStats: undefined, // instance default
hideUserStats: undefined, // instance default
virtualScrolling: undefined, // instance default

View file

@ -24,6 +24,7 @@ const defaultState = {
mentionLinkDisplay: 'short',
mentionLinkShowTooltip: true,
mentionLinkShowAvatar: true,
mentionLinkFadeDomain: true,
hideFilteredStatuses: false,
// bad name: actually hides posts of muted USERS
hideMutedPosts: false,