hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

improve styles for user_panel

Browse source
This commit is contained in:
Henry Jameson 2025-08-07 17:25:04 +03:00
commit a4de299c58
2 changed files with 69 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

126
src/components/user_card/user_card.vue
View file

@ -227,74 +227,72 @@
</div> </div>
</div> </div>
<div <div
v-if="loggedIn" v-if="loggedIn && isOtherUser"
class="user-interactions" class="user-interactions"
> >
<template v-if="isOtherUser"> <div class="btn-group">
<div class="btn-group"> <FollowButton
<FollowButton :relationship="relationship"
:relationship="relationship"
:user="user"
/>
<template v-if="relationship.following">
<ProgressButton
v-if="!relationship.notifying"
class="btn button-default"
:click="subscribeUser"
:title="$t('user_card.subscribe')"
>
<FAIcon icon="bell" />
</ProgressButton>
<ProgressButton
v-else
class="btn button-default toggled"
:click="unsubscribeUser"
:title="$t('user_card.unsubscribe')"
>
<FALayers>
<FAIcon
icon="rss"
transform="left-5 shrink-6 up-3 rotate-20"
flip="horizontal"
/>
<FAIcon
icon="rss"
transform="right-5 shrink-6 up-3 rotate-20"
/>
<FAIcon icon="bell" />
</FALayers>
</ProgressButton>
</template>
</div>
<button
v-if="relationship.muting"
class="btn button-default btn-mute toggled"
:disabled="user.deactivated"
@click="unmuteUser"
>
{{ $t('user_card.muted') }}
</button>
<button
v-else
class="btn button-default btn-mute"
:disabled="user.deactivated"
@click="muteUser"
>
{{ $t('user_card.mute') }}
</button>
<button
class="btn button-default btn-mention"
:disabled="user.deactivated"
@click="mentionUser"
>
{{ $t('user_card.mention') }}
</button>
<ModerationTools
v-if="showModerationMenu"
class="moderation-menu"
:user="user" :user="user"
/> />
</template> <template v-if="relationship.following">
<ProgressButton
v-if="!relationship.notifying"
class="btn button-default"
:click="subscribeUser"
:title="$t('user_card.subscribe')"
>
<FAIcon icon="bell" />
</ProgressButton>
<ProgressButton
v-else
class="btn button-default toggled"
:click="unsubscribeUser"
:title="$t('user_card.unsubscribe')"
>
<FALayers>
<FAIcon
icon="rss"
transform="left-5 shrink-6 up-3 rotate-20"
flip="horizontal"
/>
<FAIcon
icon="rss"
transform="right-5 shrink-6 up-3 rotate-20"
/>
<FAIcon icon="bell" />
</FALayers>
</ProgressButton>
</template>
</div>
<button
v-if="relationship.muting"
class="btn button-default btn-mute toggled"
:disabled="user.deactivated"
@click="unmuteUser"
>
{{ $t('user_card.muted') }}
</button>
<button
v-else
class="btn button-default btn-mute"
:disabled="user.deactivated"
@click="muteUser"
>
{{ $t('user_card.mute') }}
</button>
<button
class="btn button-default btn-mention"
:disabled="user.deactivated"
@click="mentionUser"
>
{{ $t('user_card.mention') }}
</button>
<ModerationTools
v-if="showModerationMenu"
class="moderation-menu"
:user="user"
/>
</div> </div>
<div <div
v-if="!loggedIn && user.is_local" v-if="!loggedIn && user.is_local"

8
src/components/user_panel/user_panel.vue
View file

@ -28,7 +28,7 @@
} }
.user-info { .user-info {
margin: 0.6em; margin: 0.6em 0.6em 0;
.Avatar { .Avatar {
width: 5em; width: 5em;
@ -38,6 +38,12 @@
} }
} }
.post-status-form {
form {
margin-top: 0;
}
}
.signed-in { .signed-in {
z-index: 10; z-index: 10;
} }