diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 9cd1d1eed..57be9bfcb 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -52,6 +52,7 @@ searchUser: "ユーザーを検索"
reply: "返信"
loadMore: "もっと見る"
showMore: "もっと見る"
+showLess: "閉じる"
youGotNewFollower: "フォローされました"
receiveFollowRequest: "フォローリクエストされました"
followRequestAccepted: "フォローが承認されました"
diff --git a/packages/client/src/components/note.vue b/packages/client/src/components/note.vue
index bc8a0dd19..4840b0dc2 100644
--- a/packages/client/src/components/note.vue
+++ b/packages/client/src/components/note.vue
@@ -46,7 +46,7 @@
-
+
({{ i18n.ts.private }})
@@ -66,9 +66,12 @@
-
{{ appearNote.channel.name }}
@@ -166,7 +169,8 @@ const reactButton = ref
();
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)
));
@@ -452,6 +456,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;