note-improvements (#9721)
boop Co-authored-by: Freeplay <Freeplay@duck.com> Reviewed-on: https://codeberg.org/calckey/calckey/pulls/9721 Co-authored-by: Free <freeplay@duck.com> Co-committed-by: Free <freeplay@duck.com>
This commit is contained in:
parent
681cefcda5
commit
b2bc51a4ee
|
@ -10,13 +10,17 @@
|
|||
<XNoteHeader class="header" :note="note" :mini="true"/>
|
||||
<div class="body">
|
||||
<p v-if="note.cw != null" class="cw">
|
||||
<i v-if="note.replyId" class="ph-arrow-bend-up-left ph-bold ph-lg reply-icon"></i>
|
||||
<i v-if="note.renoteId != parentId" class="ph-quotes ph-bold ph-lg reply-icon"></i>
|
||||
<MkA v-if="note.replyId" :to="`/notes/${note.replyId}`" class="reply-icon" @click.stop>
|
||||
<i class="ph-arrow-bend-left-up ph-bold ph-lg"></i>
|
||||
</MkA>
|
||||
<MkA v-if="conversation && note.renoteId && note.renoteId != parentId" :to="`/notes/${note.renoteId}`" class="reply-icon" @click.stop>
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
</MkA>
|
||||
<Mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
|
||||
<XCwButton v-model="showContent" :note="note"/>
|
||||
</p>
|
||||
<div v-show="note.cw == null || showContent" class="content" @click="router.push(notePage(note))">
|
||||
<MkSubNoteContent class="text" :note="note" :detailed="true" :parentId="note.parentId"/>
|
||||
<MkSubNoteContent class="text" :note="note" :detailed="true" :parentId="note.parentId" :conversation="conversation"/>
|
||||
</div>
|
||||
</div>
|
||||
<MkNoteFooter :note="note" :directReplies="replies.length"></MkNoteFooter>
|
||||
|
@ -112,16 +116,24 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
|
|||
}
|
||||
|
||||
> .body {
|
||||
:deep(.reply-icon) {
|
||||
display: inline-block;
|
||||
border-radius: 6px;
|
||||
padding: .2em .2em;
|
||||
margin-right: .2em;
|
||||
color: var(--accent);
|
||||
transition: background .2s;
|
||||
&:hover, &:focus {
|
||||
background: var(--buttonHoverBg);
|
||||
}
|
||||
}
|
||||
> .cw {
|
||||
cursor: default;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow-wrap: break-word;
|
||||
> .reply-icon {
|
||||
margin-right: 6px;
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
> .text {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
|
|
@ -3,8 +3,12 @@
|
|||
<div class="body">
|
||||
<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
|
||||
<template v-if="!note.cw">
|
||||
<i v-if="note.replyId" class="ph-arrow-bend-up-left ph-bold ph-lg reply-icon"></i>
|
||||
<i v-if="note.renoteId != parentId" class="ph-quotes ph-bold ph-lg reply-icon"></i>
|
||||
<MkA v-if="note.replyId" :to="`/notes/${note.replyId}`" class="reply-icon" @click.stop>
|
||||
<i class="ph-arrow-bend-left-up ph-bold ph-lg"></i>
|
||||
</MkA>
|
||||
<MkA v-if="conversation && note.renoteId && note.renoteId != parentId" :to="`/notes/${note.renoteId}`" class="reply-icon" @click.stop>
|
||||
<i class="ph-quotes ph-bold ph-lg"></i>
|
||||
</MkA>
|
||||
</template>
|
||||
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
|
||||
<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">{{ i18n.ts.quoteAttached }}: ...</MkA>
|
||||
|
@ -45,6 +49,7 @@ import { i18n } from '@/i18n';
|
|||
const props = defineProps<{
|
||||
note: misskey.entities.Note;
|
||||
parentId?;
|
||||
conversation?;
|
||||
detailed?: boolean;
|
||||
}>();
|
||||
|
||||
|
@ -64,10 +69,6 @@ const urls = props.note.text ? extractUrlFromMfm(mfm.parse(props.note.text)) : n
|
|||
overflow-wrap: break-word;
|
||||
|
||||
> .body {
|
||||
> .reply-icon {
|
||||
margin-right: 6px;
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
> .rp {
|
||||
margin-left: 4px;
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :content-max="800">
|
||||
<div class="fcuexfpr" v-size="{ max: [500, 350] }">
|
||||
<MkSpacer :content-max="800" :marginMin="0">
|
||||
<div class="fcuexfpr">
|
||||
<transition :name="$store.state.animation ? 'fade' : ''" mode="out-in">
|
||||
<div v-if="note" class="note">
|
||||
<div v-if="showNext" class="_gap">
|
||||
|
@ -202,13 +202,5 @@ definePageMetadata(computed(() => note ? {
|
|||
}
|
||||
}
|
||||
}
|
||||
#calckey_app > :not(.mk-deck) {
|
||||
&.max-width_500px > .note {
|
||||
margin-inline: -24px;
|
||||
}
|
||||
&.max-width_350px > .note {
|
||||
margin-inline: -12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue