forked from FoundKeyGang/FoundKey
Revert "Revert option to collapse long notes (Misskey PR 8561)"
This reverts commit 71150f21cd
and reinstates
the option to collapse long notes again after they were expanded.
It is unclear why this commit was reverted in the first place, syuilo
claimed there to be issues with URL previews and attached images. These
problems could not be reproduced when testing.
This commit is contained in:
parent
10970f2d52
commit
d0b5981a0b
2 changed files with 25 additions and 3 deletions
|
@ -52,6 +52,7 @@ searchUser: "ユーザーを検索"
|
|||
reply: "返信"
|
||||
loadMore: "もっと見る"
|
||||
showMore: "もっと見る"
|
||||
showLess: "閉じる"
|
||||
youGotNewFollower: "フォローされました"
|
||||
receiveFollowRequest: "フォローリクエストされました"
|
||||
followRequestAccepted: "フォローが承認されました"
|
||||
|
|
|
@ -46,7 +46,7 @@
|
|||
<Mfm v-if="appearNote.cw != ''" class="text" :text="appearNote.cw" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
|
||||
<XCwButton v-model="showContent" :note="appearNote"/>
|
||||
</p>
|
||||
<div v-show="appearNote.cw == null || showContent" class="content" :class="{ collapsed }">
|
||||
<div v-show="appearNote.cw == null || showContent" class="content" :class="{ collapsed, isLong }">
|
||||
<div class="text">
|
||||
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
|
||||
<MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
|
||||
|
@ -66,9 +66,12 @@
|
|||
<XPoll v-if="appearNote.poll" ref="pollViewer" :note="appearNote" class="poll"/>
|
||||
<MkUrlPreview v-for="url in urls" :key="url" :url="url" :compact="true" :detail="false" class="url-preview"/>
|
||||
<div v-if="appearNote.renote" class="renote"><XNoteSimple :note="appearNote.renote"/></div>
|
||||
<button v-if="collapsed" class="fade _button" @click="collapsed = false">
|
||||
<button v-if="isLong && collapsed" class="fade _button" @click="collapsed = false">
|
||||
<span>{{ i18n.ts.showMore }}</span>
|
||||
</button>
|
||||
<button v-else-if="isLong && !collapsed" class="showLess _button" @click="collapsed = true">
|
||||
<span>{{ i18n.ts.showLess }}</span>
|
||||
</button>
|
||||
</div>
|
||||
<MkA v-if="appearNote.channel && !inChannel" class="channel" :to="`/channels/${appearNote.channel.id}`"><i class="fas fa-satellite-dish"></i> {{ appearNote.channel.name }}</MkA>
|
||||
</div>
|
||||
|
@ -166,7 +169,8 @@ const reactButton = ref<HTMLElement>();
|
|||
let appearNote = $computed(() => isRenote ? note.renote as misskey.entities.Note : note);
|
||||
const isMyRenote = $i && ($i.id === note.userId);
|
||||
const showContent = ref(false);
|
||||
const collapsed = ref(appearNote.cw == null && appearNote.text != null && (
|
||||
const collapsed = ref(appearNote.cw == null);
|
||||
const isLong = ref(appearNote.cw == null && appearNote.text != null && (
|
||||
(appearNote.text.split('\n').length > 9) ||
|
||||
(appearNote.text.length > 500)
|
||||
));
|
||||
|
@ -454,6 +458,23 @@ function readPromo() {
|
|||
}
|
||||
|
||||
> .content {
|
||||
&.isLong {
|
||||
> .showLess {
|
||||
width: 100%;
|
||||
margin-top: 1em;
|
||||
position: sticky;
|
||||
bottom: 1em;
|
||||
|
||||
> span {
|
||||
display: inline-block;
|
||||
background: var(--panel);
|
||||
padding: 6px 10px;
|
||||
font-size: 0.8em;
|
||||
border-radius: 999px;
|
||||
box-shadow: 0 0 7px 7px var(--bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
&.collapsed {
|
||||
position: relative;
|
||||
max-height: 9em;
|
||||
|
|
Loading…
Reference in a new issue