diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 0dbe3521617f5285e8cc3d185287d89ea85da0cf..9877248eb3e0b791ef054355f4ee2a156a503cdf 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -806,6 +806,7 @@ muteThread: "スレッドをミュート" unmuteThread: "スレッドã®ãƒŸãƒ¥ãƒ¼ãƒˆã‚’解除" ffVisibility: "ã¤ãªãŒã‚Šã®å…¬é–‹ç¯„囲" ffVisibilityDescription: "自分ã®ãƒ•ã‚©ãƒãƒ¼/フォãƒãƒ¯ãƒ¼æƒ…å ±ã®å…¬é–‹ç¯„囲をè¨å®šã§ãã¾ã™ã€‚" +continueThread: "ã•ã‚‰ã«ã‚¹ãƒ¬ãƒƒãƒ‰ã‚’見る" deleteAccountConfirm: "アカウントãŒå‰Šé™¤ã•ã‚Œã¾ã™ã€‚よã‚ã—ã„ã§ã™ã‹ï¼Ÿ" _emailUnavailable: diff --git a/packages/client/src/components/note.sub.vue b/packages/client/src/components/note.sub.vue index 45204854be1ccdf7ad8ddfd1e14104c1a851fcce..2e3636550578b1aa41a7862ff730c6c2d962e121 100644 --- a/packages/client/src/components/note.sub.vue +++ b/packages/client/src/components/note.sub.vue @@ -1,5 +1,5 @@ <template> -<div class="wrpstxzv" :class="{ children }" v-size="{ max: [450] }"> +<div class="wrpstxzv" :class="{ children: depth > 1 }" v-size="{ max: [450] }"> <div class="main"> <MkAvatar class="avatar" :user="note.user"/> <div class="body"> @@ -15,12 +15,18 @@ </div> </div> </div> - <XSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :detail="true" :children="true"/> + <template v-if="depth < 5"> + <XSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :detail="true" :depth="depth + 1"/> + </template> + <div v-else class="more"> + <MkA class="text _link" :to="notePage(note)">{{ $ts.continueThread }} <i class="fas fa-angle-double-right"></i></MkA> + </div> </div> </template> <script lang="ts"> import { defineComponent } from 'vue'; +import notePage from '@/filters/note'; import XNoteHeader from './note-header.vue'; import XSubNoteContent from './sub-note-content.vue'; import XCwButton from './cw-button.vue'; @@ -45,16 +51,12 @@ export default defineComponent({ required: false, default: false }, - children: { - type: Boolean, + // how many notes are in between this one and the note being viewed in detail + depth: { + type: Number, required: false, - default: false + default: 1 }, - // TODO - truncate: { - type: Boolean, - default: true - } }, data() { @@ -74,6 +76,10 @@ export default defineComponent({ }); } }, + + methods: { + notePage, + } }); </script> @@ -138,9 +144,13 @@ export default defineComponent({ } } - > .reply { + > .reply, > .more { border-left: solid 0.5px var(--divider); margin-top: 10px; } + + > .more { + padding: 10px 0 0 16px; + } } </style>