Merge pull request 'Add some labels to & truncate notifications' (#10181) from Freeplay/calckey:notifications into develop

Reviewed-on: https://codeberg.org/calckey/calckey/pulls/10181
This commit is contained in:
Kainoa Kanter 2023-05-23 05:33:54 +00:00
commit dae9bd43d4
4 changed files with 27 additions and 14 deletions

View File

@ -1962,6 +1962,9 @@ _notification:
youWereInvitedToGroup: "{userName} invited you to a group"
pollEnded: "Poll results have become available"
emptyPushNotificationMessage: "Push notifications have been updated"
reacted: "reacted to your post"
renoted: "boosted your post"
voted: "voted on your poll"
_types:
all: "All"
follow: "New followers"

View File

@ -5,7 +5,7 @@
v-show="!isDeleted"
ref="el"
v-hotkey="keymap"
v-size="{ max: [500, 450, 350, 300] }"
v-size="{ max: [500, 450, 350] }"
class="tkcbzcuz note-container"
:tabindex="!isDeleted ? '-1' : null"
:class="{ renote: isRenote }"

View File

@ -1,8 +1,8 @@
<template>
<div
ref="elRef"
v-size="{ max: [500, 600] }"
class="qglefbjs"
v-size="{ max: [500, 450] }"
class="qglefbjs notification"
:class="notification.type"
>
<div class="head">
@ -114,6 +114,7 @@
:to="notePage(notification.note)"
:title="getNoteSummary(notification.note)"
>
<span>{{ i18n.ts._notification.reacted }}</span>
<i class="ph-quotes ph-fill ph-lg"></i>
<Mfm
:text="getNoteSummary(notification.note)"
@ -129,6 +130,7 @@
:to="notePage(notification.note)"
:title="getNoteSummary(notification.note.renote)"
>
<span>{{ i18n.ts._notification.renoted }}</span>
<i class="ph-quotes ph-fill ph-lg"></i>
<Mfm
:text="getNoteSummary(notification.note.renote)"
@ -183,6 +185,7 @@
:to="notePage(notification.note)"
:title="getNoteSummary(notification.note)"
>
<span>{{ i18n.ts._notification.voted }}</span>
<i class="ph-quotes ph-fill ph-lg"></i>
<Mfm
:text="getNoteSummary(notification.note)"
@ -210,7 +213,7 @@
<span
v-if="notification.type === 'follow'"
class="text"
style="opacity: 0.6"
style="opacity: 0.7"
>{{ i18n.ts.youGotNewFollower }}
<div v-if="full">
<MkFollowButton
@ -221,13 +224,13 @@
<span
v-if="notification.type === 'followRequestAccepted'"
class="text"
style="opacity: 0.6"
style="opacity: 0.7"
>{{ i18n.ts.followRequestAccepted }}</span
>
<span
v-if="notification.type === 'receiveFollowRequest'"
class="text"
style="opacity: 0.6"
style="opacity: 0.7"
>{{ i18n.ts.receiveFollowRequest }}
<div v-if="full && !followRequestDone">
<button class="_textButton" @click="acceptFollowRequest()">
@ -242,7 +245,7 @@
<span
v-if="notification.type === 'groupInvited'"
class="text"
style="opacity: 0.6"
style="opacity: 0.7"
>{{ i18n.ts.groupInvited }}:
<b>{{ notification.invitation.group.name }}</b>
<div v-if="full && !groupInviteDone">
@ -389,14 +392,13 @@ useTooltip(reactionRef, (showing) => {
display: flex;
contain: content;
&.max-width_600px {
padding: 16px;
font-size: 0.9em;
}
&.max-width_500px {
padding: 12px;
font-size: 0.85em;
padding-block: 16px;
font-size: 0.9em;
}
&.max-width_450px {
padding: 12px 16px;
}
> .head {
@ -509,9 +511,17 @@ useTooltip(reactionRef, (showing) => {
> .text {
white-space: nowrap;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
> span:first-child {
opacity: .7;
&::after { content: ": " }
}
> i {
vertical-align: super;
font-size: 50%;

View File

@ -361,7 +361,7 @@ onMounted(() => {
> span {
font-size: 1em;
color: var(--accent);
:global(span) {
:deep(span) {
white-space: nowrap;
}
}