natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

note-improvements (#9799) 

Boop!

Co-authored-by: Freeplay <Freeplay@duck.com>
Reviewed-on: https://codeberg.org/calckey/calckey/pulls/9799
Co-authored-by: Free <freeplay@duck.com>
Co-committed-by: Free <freeplay@duck.com>
This commit is contained in:
Free 2023-04-02 21:39:25 +00:00 committed by Kainoa Kanter
parent 84debac6db
commit 8bd64c89a4
6 changed files with 53 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
locales/en-US.yml
View File

@ -1230,13 +1230,13 @@ _sfx:
_ago:
future: "Future"
justNow: "Just now"
secondsAgo: "{n} second(s) ago"
minutesAgo: "{n} minute(s) ago"
hoursAgo: "{n} hour(s) ago"
daysAgo: "{n} day(s) ago"
weeksAgo: "{n} week(s) ago"
monthsAgo: "{n} month(s) ago"
yearsAgo: "{n} year(s) ago"
secondsAgo: "{n}s ago"
minutesAgo: "{n}m ago"
hoursAgo: "{n}h ago"
daysAgo: "{n}d ago"
weeksAgo: "{n}w ago"
monthsAgo: "{n}mo ago"
yearsAgo: "{n}y ago"
_time:
second: "Second(s)"
minute: "Minute(s)"

14
packages/client/src/components/MkNote.vue
View File

@ -10,16 +10,16 @@
:class="{ renote: isRenote }"
>
<MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" class="reply-to"/>
<div class="note-context">
<div class="note-context" @click="noteClick">
<div class="line"></div>
<div v-if="appearNote._prId_" class="info"><i class="ph-megaphone-simple-bold ph-lg"></i> {{ i18n.ts.promotion }}<button class="_textButton hide" @click="readPromo()">{{ i18n.ts.hideThisNote }} <i class="ph-x ph-bold ph-lg"></i></button></div>
<div v-if="appearNote._prId_" class="info"><i class="ph-megaphone-simple-bold ph-lg"></i> {{ i18n.ts.promotion }}<button class="_textButton hide" @click.stop="readPromo()">{{ i18n.ts.hideThisNote }} <i class="ph-x ph-bold ph-lg"></i></button></div>
<div v-if="appearNote._featuredId_" class="info"><i class="ph-lightning ph-bold ph-lg"></i> {{ i18n.ts.featured }}</div>
<div v-if="pinned" class="info"><i class="ph-push-pin ph-bold ph-lg"></i>{{ i18n.ts.pinnedNote }}</div>
<div v-if="isRenote" class="renote">
<i class="ph-repeat ph-bold ph-lg"></i>
<I18n :src="i18n.ts.renotedBy" tag="span">
<template #user>
<MkA v-user-preview="note.userId" class="name" :to="userPage(note.user)">
<MkA v-user-preview="note.userId" class="name" :to="userPage(note.user)" @click.stop>
<MkUserName :user="note.user"/>
</MkA>
</template>
@ -93,7 +93,6 @@
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
</button>
</footer>
<!-- <MkNoteFooter :note="appearNote"></MkNoteFooter> -->
</div>
</article>
</div>
@ -418,7 +417,7 @@ function readPromo() {
align-items: center;
white-space: pre;
color: var(--renote);
cursor: pointer;
> i {
margin-right: 4px;
@ -504,7 +503,7 @@ function readPromo() {
width: 100%;
margin-top: 1em;
position: sticky;
bottom: 1em;
bottom: var(--stickyBottom);
> span {
display: inline-block;
@ -663,6 +662,9 @@ function readPromo() {
}
> .line {
margin-right: 10px;
&::before {
margin-top: 8px;
}
}
}
> .article {

3
packages/client/src/components/MkNoteDetailed.vue
View File

@ -352,6 +352,7 @@ onUnmounted(() => {
<style lang="scss" scoped>
.lxwezrsl {
font-size: 1.05em;
position: relative;
transition: box-shadow 0.1s ease;
contain: content;
@ -451,7 +452,7 @@ onUnmounted(() => {
&:last-child {
padding-bottom: 24px;
}
font-size: 1.2em;
font-size: 1.1em;
overflow: clip;
outline: none;
scroll-margin-top: calc(var(--stickyTop) + 20vh);

39
packages/client/src/components/MkNoteSub.vue
View File

@ -7,25 +7,25 @@
<div v-if="conversation && depth > 1" class="line"></div>
<div class="main" @click="noteClick">
<div class="avatar-container">
<MkAvatar class="avatar" :user="note.user"/>
<MkAvatar class="avatar" :user="appearNote.user"/>
<div v-if="(!conversation) || replies.length > 0" class="line"></div>
</div>
<div class="body">
<XNoteHeader class="header" :note="note" :mini="true"/>
<div class="body">
<p v-if="note.cw != null" class="cw">
<MkA v-if="note.replyId" :to="`/notes/${note.replyId}`" class="reply-icon" @click.stop>
<p v-if="appearNote.cw != null" class="cw">
<MkA v-if="appearNote.replyId" :to="`/notes/${appearNote.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 && !note.replyId" :to="`/notes/${note.renoteId}`" class="reply-icon" @click.stop>
<MkA v-if="conversation && appearNote.renoteId && appearNote.renoteId != parentId && !appearNote.replyId" :to="`/notes/${appearNote.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"/>
<Mfm v-if="appearNote.cw != ''" class="text" :text="appearNote.cw" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
<br/>
<XCwButton v-model="showContent" :note="note"/>
</p>
<div v-show="note.cw == null || showContent" class="content">
<MkSubNoteContent class="text" :note="note" :detailed="true" :parentId="note.parentId" :conversation="conversation"/>
<div v-show="appearNote.cw == null || showContent" class="content">
<MkSubNoteContent class="text" :note="note" :detailed="true" :parentId="appearNote.parentId" :conversation="conversation"/>
</div>
<div v-if="translating || translation" class="translation">
<MkLoading v-if="translating" mini/>
@ -56,15 +56,14 @@
<i class="ph-dots-three-outline ph-bold ph-lg"></i>
</button>
</footer>
<!-- <MkNoteFooter :note="note" :directReplies="replies.length"></MkNoteFooter> -->
</div>
</div>
<template v-if="conversation">
<template v-if="replies.length == 1">
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply single" :conversation="conversation" :depth="depth" :parentId="note.replyId"/>
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply single" :conversation="conversation" :depth="depth" :parentId="appearNote.replyId"/>
</template>
<template v-else-if="depth < 5">
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :conversation="conversation" :depth="depth + 1" :parentId="note.replyId"/>
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :conversation="conversation" :depth="depth + 1" :parentId="appearNote.replyId"/>
</template>
<div v-else-if="replies.length > 0" class="more">
<div class="line"></div>
@ -457,6 +456,26 @@ function noteClick(e) {
-webkit-mask: linear-gradient(to right, transparent 2px, black 2px);
}
}
// End Reply Divider
.children > .main:last-child {
padding-bottom: 1em;
&::before {
bottom: 1em;
}
// &::after {
// content: "";
// border-top: 1px solid var(--X13);
// position: absolute;
// bottom: 0;
// margin-left: calc(var(--avatarSize) + 12px);
// inset-inline: 0;
// }
}
&.firstColumn > .children:last-child > .main {
padding-bottom: 0 !important;
&::before { bottom: 0 !important }
// &::after { content: unset }
}
&.max-width_500px {
:not(.reply) > & {

2
packages/client/src/components/MkSubNoteContent.vue
View File

@ -130,7 +130,7 @@ const urls = props.note.text ? extractUrlFromMfm(mfm.parse(props.note.text)) : n
width: 100%;
margin-top: 1em;
position: sticky;
bottom: 1em;
bottom: var(--stickyBottom);
> span {
display: inline-block;

8
packages/client/src/ui/universal.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="dkgtipfy" :class="{ wallpaper }">
<div class="dkgtipfy" :class="{ wallpaper, isMobile }">
<XSidebar v-if="!isMobile" class="sidebar"/>
<MkStickyContainer class="contents">
@ -319,6 +319,10 @@ console.log(mainRouter.currentRoute.value.name);
box-sizing: border-box;
display: flex;
--stickyBottom: 1em;
&.isMobile {
--stickyBottom: 6rem;
}
&.wallpaper {
background: var(--wallpaperOverlay);
//backdrop-filter: var(--blur, blur(4px));
@ -363,7 +367,7 @@ console.log(mainRouter.currentRoute.value.name);
}
> .postButton, .widgetButton {
bottom: 6rem;
bottom: var(--stickyBottom);
right: 1.5rem;
height: 4rem;
width: 4rem;