diff --git a/src/components/conversation/conversation.scss b/src/components/conversation/conversation.scss index ae06dbfa7..daf3cb11e 100644 --- a/src/components/conversation/conversation.scss +++ b/src/components/conversation/conversation.scss @@ -40,24 +40,6 @@ /* stylelint-enable declaration-no-important */ } - .thread-ancestor-dive-box { - padding-left: var(--status-margin); - border-bottom: 1px solid var(--border); - border-radius: 0; - - /* Make the button stretch along the whole row */ - &, - &-inner { - display: flex; - align-items: stretch; - flex-direction: column; - } - } - - .thread-ancestor-dive-box-inner { - padding: var(--status-margin); - } - .thread-ancestors + .thread-tree > .conversation-status { border-top: 1px solid var(--border); } diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index 8b4cfafde..6c3421033 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -105,7 +105,7 @@ :replies="getReplies(element.status.id)" :focused="focused === element.status.id" - can-dive + conversation-rank="ancestor" @goto="setFocused" @dive="diveIntoStatus(element.status.id)" @@ -117,33 +117,6 @@ class="virtual-spacer" :style="{ height: element.height + 'px' }" /> -
-
- - - - -
-
+ + + +
diff --git a/src/components/thread_tree/thread_tree.js b/src/components/thread_tree/thread_tree.js index 2dacf4212..6dedf78ed 100644 --- a/src/components/thread_tree/thread_tree.js +++ b/src/components/thread_tree/thread_tree.js @@ -1,4 +1,5 @@ import { useMergedConfigStore } from 'src/stores/merged_config.js' +import { useStatusesStore } from 'src/stores/statuses.js' import { library } from '@fortawesome/fontawesome-svg-core' import { @@ -43,14 +44,21 @@ const ThreadTree = { 'isPage', ], computed: { + status() { + const status = useStatusesStore().allStatuses.get(this.statusId) + if (status.retweeted_status) { + return useStatusesStore().allStatuses.get(status.retweeted_status.id) + } + return status + }, currentReplies() { - return [...this.getReplies(this.statusId)].map(({ id }) => id) + return [...this.getReplies(this.status.id)].map(({ id }) => id) }, simple() { return !useMergedConfigStore().mergedConfig.conversationTreeAdvanced }, threadShowing() { - return this.threadDisplay.get(this.statusId) === 'showing' + return this.threadDisplay.get(this.status.id) === 'showing' }, canDive() { return this.isExpanded diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue index b8d35e3df..3f004b4a3 100644 --- a/src/components/thread_tree/thread_tree.vue +++ b/src/components/thread_tree/thread_tree.vue @@ -10,6 +10,7 @@ :replies="getReplies(statusId)" :focused="focused === statusId" + :conversation-rank="depth === 0 ? 'current' : 'child'" :thread-display-state="threadDisplay.get(statusId)" @dive="$emit('dive', statusId)" @@ -53,7 +54,7 @@ @@ -72,7 +73,7 @@