diff --git a/webapp/components/CommentList/CommentList.vue b/webapp/components/CommentList/CommentList.vue index 17da8dda40..b5eb070c8e 100644 --- a/webapp/components/CommentList/CommentList.vue +++ b/webapp/components/CommentList/CommentList.vue @@ -47,6 +47,33 @@ export default { return comment.id === updatedComment.id ? updatedComment : comment }) }, + scrollCommentsIntoView() { + if (!window || !document) { + return + } + const container = document.getElementById('comments') + if (container) { + const top = container.offsetTop + window.scroll({ + top, + left: 0, + behavior: 'smooth', + }) + } + }, + }, + watch: { + $route(to, from) { + // scroll inside the same page + if (to.hash === '#comments') { + this.scrollCommentsIntoView() + } + }, + }, + mounted() { + if (this.$route.hash === '#comments') { + setTimeout(this.scrollCommentsIntoView, 250) + } }, } diff --git a/webapp/pages/post/_id.vue b/webapp/pages/post/_id.vue index 3f8d938687..a02afd3b92 100644 --- a/webapp/pages/post/_id.vue +++ b/webapp/pages/post/_id.vue @@ -77,17 +77,6 @@ export default { ] }, }, - watch: { - $route(to, from) { - if (to.hash === '#comments') { - window.scroll({ - top: document.getElementById('comments').offsetTop, - left: 0, - behavior: 'smooth', - }) - } - }, - }, } diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue index dd84ee3d75..147a046636 100644 --- a/webapp/pages/post/_id/_slug/index.vue +++ b/webapp/pages/post/_id/_slug/index.vue @@ -193,7 +193,7 @@ export default { .ds-card-image { img { - max-height: 300px; + height: 300px; object-fit: cover; object-position: center; }