Style properly usernames without tooltips

This commit is contained in:
Tusooa Zhu 2022-01-10 01:37:20 -05:00
parent 1d4b1b296e
commit 95007059d1
No known key found for this signature in database
GPG key ID: 7B467EDE43A08224
2 changed files with 9 additions and 8 deletions

View file

@ -27,7 +27,7 @@
user-select: all; user-select: all;
} }
.short { .short.-with-tooltip {
user-select: none; user-select: none;
} }
@ -56,7 +56,7 @@
} }
&.-striped { &.-striped {
& .userName, & .shortName,
& .full { & .full {
background-image: background-image:
repeating-linear-gradient( repeating-linear-gradient(
@ -70,14 +70,14 @@
} }
&.-solid { &.-solid {
& .userName, & .shortName,
& .full { & .full {
background-image: linear-gradient(var(--____highlight-tintColor2), var(--____highlight-tintColor2)); background-image: linear-gradient(var(--____highlight-tintColor2), var(--____highlight-tintColor2));
} }
} }
&.-side { &.-side {
& .userName, & .shortName,
& .userNameFull { & .userNameFull {
box-shadow: 0 -5px 3px -4px inset var(--____highlight-solidColor); box-shadow: 0 -5px 3px -4px inset var(--____highlight-solidColor);
} }

View file

@ -19,18 +19,19 @@
> >
<a <a
class="short button-unstyled" class="short button-unstyled"
:class="{ '-with-tooltip': shouldShowTooltip }"
:href="url" :href="url"
@click.prevent="onClick" @click.prevent="onClick"
> >
<!-- eslint-disable vue/no-v-html --> <!-- eslint-disable vue/no-v-html -->
<FAIcon <span
class="shortName"
><FAIcon
v-if="useAtIcon" v-if="useAtIcon"
size="sm" size="sm"
icon="at" icon="at"
class="at" class="at"
/><span />{{ !useAtIcon ? '@' : '' }}<span
class="shortName"
>{{ !useAtIcon ? '@' : '' }}<span
class="userName" class="userName"
v-html="userName" v-html="userName"
/><span /><span