From 50feeed8bf10c96a38ded800395908b20e577b54 Mon Sep 17 00:00:00 2001
From: Vasily Belolapotkov <belolapotkov.v@gmail.com>
Date: Tue, 24 Sep 2019 12:47:42 +0300
Subject: [PATCH] fix the bug with scrolling post comments into view

---
 webapp/components/CommentList/CommentList.vue | 27 +++++++++++++++++++
 webapp/pages/post/_id.vue                     | 11 --------
 webapp/pages/post/_id/_slug/index.vue         |  2 +-
 3 files changed, 28 insertions(+), 12 deletions(-)

diff --git a/webapp/components/CommentList/CommentList.vue b/webapp/components/CommentList/CommentList.vue
index 17da8dda4..b5eb070c8 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)
+    }
   },
 }
 </script>
diff --git a/webapp/pages/post/_id.vue b/webapp/pages/post/_id.vue
index 3f8d93868..a02afd3b9 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',
-        })
-      }
-    },
-  },
 }
 </script>
 
diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue
index dd84ee3d7..147a04663 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;
       }