fix: 🐛 display punishments on desktop

This commit is contained in:
ThatOneCalculator 2023-06-16 10:16:19 -07:00
parent 837a45bd98
commit 3aab4c05e7
No known key found for this signature in database
GPG Key ID: 8703CACD01000000
1 changed files with 36 additions and 27 deletions

View File

@ -28,12 +28,38 @@
></div>
<div class="fade"></div>
<div class="title">
<div class="nameCollumn">
<div class="nameColumn">
<MkUserName
class="name"
:user="user"
:nowrap="true"
/>
<div v-if="$i?.isModerator || $i?.isAdmin">
<span
v-if="user.isSilenced"
style="
color: var(--warn);
padding: 5px;
"
>
<i
class="ph-warning ph-bold ph-lg"
></i>
{{ i18n.ts.silenced }}
</span>
<span
v-if="user.isSuspended"
style="
color: var(--error);
padding: 5px;
"
>
<i
class="ph-warning ph-bold ph-lg"
></i>
{{ i18n.ts.suspended }}
</span>
</div>
<span
v-if="
$i &&
@ -98,7 +124,7 @@
:show-indicator="true"
/>
<div class="title">
<div class="nameCollumn">
<div class="nameColumn">
<MkUserName
class="name"
:user="user"
@ -113,20 +139,20 @@
class="followed"
>{{ i18n.ts.followsYou }}</span
>
<div
v-if="$i?.isModerator || $i?.isAdmin"
class="punishments"
>
<div v-if="$i?.isModerator || $i?.isAdmin">
<span
class="punished"
v-if="user.isSilenced"
style="color: var(--warn); padding: 5px"
>
<i class="ph-warning ph-bold ph-lg"></i>
{{ i18n.ts.silenced }}
</span>
<span
class="punished"
v-if="user.isSuspended"
style="
color: var(--error);
padding: 5px;
"
>
<i class="ph-warning ph-bold ph-lg"></i>
{{ i18n.ts.suspended }}
@ -516,23 +542,6 @@ onUnmounted(() => {
border-radius: 6px;
}
> .punishments {
display: flex;
gap: 1rem;
margin-top: 0.5rem;
> .punished {
padding: 10px;
color: var(--infoWarnBg);
background-color: var(--infoWarnFg);
border-radius: 10px;
> i {
margin-right: 4px;
}
}
}
> .title {
position: absolute;
bottom: 0;
@ -542,7 +551,7 @@ onUnmounted(() => {
box-sizing: border-box;
color: #fff;
> .nameCollumn {
> .nameColumn {
display: block;
> .name {
margin: 0;
@ -650,7 +659,7 @@ onUnmounted(() => {
font-weight: bold;
border-bottom: solid 0.5px var(--divider);
> .nameCollumn {
> .nameColumn {
display: block;
> .name {
margin: 0;