fix: 🐛 collapse reply if type is a mention and it has a reply
This commit is contained in:
parent
d5854c2324
commit
278f42a720
2 changed files with 18 additions and 12 deletions
|
@ -16,11 +16,12 @@
|
||||||
:note="appearNote.reply"
|
:note="appearNote.reply"
|
||||||
class="reply-to"
|
class="reply-to"
|
||||||
/>
|
/>
|
||||||
<div v-if="!detailedView"
|
<div
|
||||||
|
v-if="!detailedView"
|
||||||
class="note-context"
|
class="note-context"
|
||||||
@click="noteClick"
|
@click="noteClick"
|
||||||
:class="{
|
:class="{
|
||||||
collapsedReply: collapsedReply && appearNote.reply
|
collapsedReply: collapsedReply && appearNote.reply,
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<div class="line"></div>
|
<div class="line"></div>
|
||||||
|
@ -71,7 +72,10 @@
|
||||||
</div>
|
</div>
|
||||||
<div v-if="collapsedReply && appearNote.reply" class="info">
|
<div v-if="collapsedReply && appearNote.reply" class="info">
|
||||||
<MkAvatar class="avatar" :user="appearNote.reply.user" />
|
<MkAvatar class="avatar" :user="appearNote.reply.user" />
|
||||||
<MkUserName class="username" :user="appearNote.reply.user"></MkUserName>
|
<MkUserName
|
||||||
|
class="username"
|
||||||
|
:user="appearNote.reply.user"
|
||||||
|
></MkUserName>
|
||||||
<Mfm
|
<Mfm
|
||||||
class="summary"
|
class="summary"
|
||||||
:text="getNoteSummary(appearNote.reply)"
|
:text="getNoteSummary(appearNote.reply)"
|
||||||
|
@ -92,10 +96,7 @@
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<div class="header-container">
|
<div class="header-container">
|
||||||
<MkAvatar class="avatar" :user="appearNote.user" />
|
<MkAvatar class="avatar" :user="appearNote.user" />
|
||||||
<XNoteHeader
|
<XNoteHeader class="header" :note="appearNote" />
|
||||||
class="header"
|
|
||||||
:note="appearNote"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<MkSubNoteContent
|
<MkSubNoteContent
|
||||||
|
@ -747,14 +748,14 @@ defineExpose({
|
||||||
}
|
}
|
||||||
.info {
|
.info {
|
||||||
color: var(--fgTransparentWeak);
|
color: var(--fgTransparentWeak);
|
||||||
transition: color .2s;
|
transition: color 0.2s;
|
||||||
}
|
}
|
||||||
.avatar {
|
.avatar {
|
||||||
width: 1.2em;
|
width: 1.2em;
|
||||||
height: 1.2em;
|
height: 1.2em;
|
||||||
border-radius: 2em;
|
border-radius: 2em;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-right: .4em;
|
margin-right: 0.4em;
|
||||||
background: var(--panelHighlight);
|
background: var(--panelHighlight);
|
||||||
}
|
}
|
||||||
.username {
|
.username {
|
||||||
|
@ -765,7 +766,8 @@ defineExpose({
|
||||||
content: ": ";
|
content: ": ";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&:hover, &:focus-within {
|
&:hover,
|
||||||
|
&:focus-within {
|
||||||
.info {
|
.info {
|
||||||
color: var(--fg);
|
color: var(--fg);
|
||||||
}
|
}
|
||||||
|
|
|
@ -26,7 +26,11 @@
|
||||||
"
|
"
|
||||||
:key="notification.id"
|
:key="notification.id"
|
||||||
:note="notification.note"
|
:note="notification.note"
|
||||||
:collapsedReply="notification.type === 'reply'"
|
:collapsedReply="
|
||||||
|
notification.type === 'reply' ||
|
||||||
|
(notification.type === 'mention' &&
|
||||||
|
notification.note.replyId != null)
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<XNotification
|
<XNotification
|
||||||
v-else
|
v-else
|
||||||
|
|
Loading…
Reference in a new issue