Merge branch 'ui-fixes' into 'master'

UI fixes

Closes #753 et #754

See merge request framasoft/mobilizon!975
This commit is contained in:
Thomas Citharel 2021-07-02 08:57:44 +00:00
commit 17e2fc616c
3 changed files with 21 additions and 7 deletions

View file

@ -1,14 +1,20 @@
<template>
<article class="comment">
<div class="avatar">
<figure class="image is-48x48" v-if="comment.actor.avatar">
<figure
class="image is-48x48"
v-if="comment.actor && comment.actor.avatar"
>
<img class="is-rounded" :src="comment.actor.avatar.url" alt="" />
</figure>
<b-icon v-else size="is-large" icon="account-circle" />
</div>
<div class="body">
<div class="meta">
<span class="first-line name" v-if="!comment.deletedAt">
<span
class="first-line name"
v-if="comment.actor && !comment.deletedAt"
>
<strong>{{ comment.actor.name }}</strong>
<small>@{{ usernameWithDomain(comment.actor) }}</small>
</span>
@ -17,7 +23,11 @@
</span>
<span
class="icons"
v-if="!comment.deletedAt && comment.actor.id === currentActor.id"
v-if="
comment.actor &&
!comment.deletedAt &&
comment.actor.id === currentActor.id
"
>
<b-dropdown aria-role="list">
<b-icon slot="trigger" role="button" icon="dots-horizontal" />

View file

@ -24,7 +24,10 @@
<div class="title-info-wrapper">
<div class="title-and-date">
<p class="discussion-minimalist-title">{{ discussion.title }}</p>
<span :title="actualDate | formatDateTimeString">
<span
class="has-text-grey-dark"
:title="actualDate | formatDateTimeString"
>
{{
formatDistanceToNowStrict(new Date(actualDate), {
locale: $dateFnsLocale,
@ -102,8 +105,8 @@ export default class DiscussionListItem extends Vue {
.discussion-minimalist-title {
color: #3c376e;
font-family: Roboto, Helvetica, Arial, serif;
font-size: 16px;
font-weight: 500;
font-size: 19px;
font-weight: 600;
flex: 1;
}
}
@ -113,6 +116,7 @@ export default class DiscussionListItem extends Vue {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
font-size: 15px;
}
}
}

View file

@ -49,7 +49,7 @@ section {
.main-slot {
min-height: 5rem;
padding: 5px;
padding: 2px 5px;
flex: 1;
}
}