forked from potsda.mn/mobilizon
Fix embed of actor card
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
e7ce24966b
commit
9d3cd05e33
|
@ -1,33 +1,38 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="w-80 bg-white rounded-lg shadow-md p-4 sm:p-8 flex items-center space-x-4 flex-col items-center pb-10"
|
class="w-80 bg-white rounded-lg shadow-md flex space-x-4 items-center"
|
||||||
|
:class="{ 'flex-col p-4 sm:p-8 pb-10': !inline }"
|
||||||
>
|
>
|
||||||
<figure class="w-12 h-12" v-if="actor.avatar">
|
<div>
|
||||||
<img
|
<figure class="w-12 h-12" v-if="actor.avatar">
|
||||||
class="rounded-lg"
|
<img
|
||||||
:src="actor.avatar.url"
|
class="rounded-lg"
|
||||||
alt=""
|
:src="actor.avatar.url"
|
||||||
width="48"
|
alt=""
|
||||||
height="48"
|
width="48"
|
||||||
|
height="48"
|
||||||
|
/>
|
||||||
|
</figure>
|
||||||
|
<b-icon
|
||||||
|
v-else
|
||||||
|
:size="inline ? 'is-medium' : 'is-large'"
|
||||||
|
icon="account-circle"
|
||||||
|
class="ltr:-mr-0.5 rtl:-ml-0.5"
|
||||||
/>
|
/>
|
||||||
</figure>
|
</div>
|
||||||
<b-icon
|
<div :class="{ 'text-center': !inline }">
|
||||||
v-else
|
<h5 class="text-xl font-medium violet-title tracking-tight text-gray-900">
|
||||||
size="is-large"
|
{{ displayName(actor) }}
|
||||||
icon="account-circle"
|
</h5>
|
||||||
class="ltr:-mr-0.5 rtl:-ml-0.5"
|
<p class="text-gray-500 truncate" v-if="actor.name">
|
||||||
/>
|
<span dir="ltr">@{{ usernameWithDomain(actor) }}</span>
|
||||||
<h5 class="text-xl font-medium violet-title tracking-tight text-gray-900">
|
</p>
|
||||||
{{ displayName(actor) }}
|
<div
|
||||||
</h5>
|
v-if="full"
|
||||||
<p class="text-gray-500 truncate" v-if="actor.name">
|
:class="{ 'line-clamp-3': limit }"
|
||||||
<span dir="ltr">@{{ usernameWithDomain(actor) }}</span>
|
v-html="actor.summary"
|
||||||
</p>
|
/>
|
||||||
<div
|
</div>
|
||||||
v-if="full"
|
|
||||||
:class="{ 'line-clamp-3': limit }"
|
|
||||||
v-html="actor.summary"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<!-- <div
|
<!-- <div
|
||||||
class="p-4 bg-white rounded-lg shadow-md sm:p-8 flex items-center space-x-4"
|
class="p-4 bg-white rounded-lg shadow-md sm:p-8 flex items-center space-x-4"
|
||||||
|
@ -77,6 +82,8 @@ export default class ActorCard extends Vue {
|
||||||
|
|
||||||
@Prop({ required: false, type: Boolean, default: false }) full!: boolean;
|
@Prop({ required: false, type: Boolean, default: false }) full!: boolean;
|
||||||
|
|
||||||
|
@Prop({ required: false, type: Boolean, default: false }) inline!: boolean;
|
||||||
|
|
||||||
@Prop({ required: false, type: Boolean, default: false }) popover!: boolean;
|
@Prop({ required: false, type: Boolean, default: false }) popover!: boolean;
|
||||||
|
|
||||||
@Prop({ required: false, type: Boolean, default: true }) limit!: boolean;
|
@Prop({ required: false, type: Boolean, default: true }) limit!: boolean;
|
||||||
|
|
|
@ -48,9 +48,10 @@
|
||||||
!event.attributedTo || !event.options.hideOrganizerWhenGroupEvent
|
!event.attributedTo || !event.options.hideOrganizerWhenGroupEvent
|
||||||
"
|
"
|
||||||
:actor="event.attributedTo"
|
:actor="event.attributedTo"
|
||||||
|
:inline="true"
|
||||||
/>
|
/>
|
||||||
<actor-card v-else :actor="event.organizerActor" />
|
|
||||||
</router-link>
|
</router-link>
|
||||||
|
<actor-card v-else :actor="event.organizerActor" :inline="true" />
|
||||||
<actor-card
|
<actor-card
|
||||||
:actor="contact"
|
:actor="contact"
|
||||||
v-for="contact in event.contacts"
|
v-for="contact in event.contacts"
|
||||||
|
|
Loading…
Reference in a new issue