From 77a9a084d644476cb912681d833d06a16b78ece1 Mon Sep 17 00:00:00 2001
From: Sanjaiyan Parthipan <parthipankalayini@gmail.com>
Date: Wed, 13 Sep 2023 00:37:32 +0530
Subject: [PATCH 1/4] Add smooth scroll property to css

---
 src/styles/base/_reset.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/styles/base/_reset.scss b/src/styles/base/_reset.scss
index aa8042287..77283d40a 100644
--- a/src/styles/base/_reset.scss
+++ b/src/styles/base/_reset.scss
@@ -18,6 +18,7 @@ html {
   // enough that it does not actually exceed the breakpoint height.
   background-color: var(--colors-text-background, var(--color-text-background));
   height: 100%;
+  scroll-behavior: smooth;
 }
 
 //============================================================

From acb79b2677a856c20389ea9cb76026872ba2c96f Mon Sep 17 00:00:00 2001
From: Sanjaiyan Parthipan <parthipankalayini@gmail.com>
Date: Thu, 14 Sep 2023 22:15:57 +0530
Subject: [PATCH 2/4] fix: scrolling issue

---
 src/components/Navigator/NavigatorCard.vue | 1 +
 src/components/Tutorial/Assessments.vue    | 6 +++++-
 src/mixins/scrollToElement.js              | 6 +++++-
 src/styles/base/_reset.scss                | 1 -
 src/utils/router-utils.js                  | 6 +++++-
 src/utils/scroll-lock.js                   | 6 +++++-
 6 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/src/components/Navigator/NavigatorCard.vue b/src/components/Navigator/NavigatorCard.vue
index f0ffc597f..df7ddb5e1 100644
--- a/src/components/Navigator/NavigatorCard.vue
+++ b/src/components/Navigator/NavigatorCard.vue
@@ -933,6 +933,7 @@ export default {
       this.$refs.scroller.$el.scrollBy({
         top: offsetHeight * positionIndex,
         left: 0,
+        behavior: 'smooth',
       });
     },
     handleFocusOut(event) {
diff --git a/src/components/Tutorial/Assessments.vue b/src/components/Tutorial/Assessments.vue
index 5168c2120..d900dea3b 100644
--- a/src/components/Tutorial/Assessments.vue
+++ b/src/components/Tutorial/Assessments.vue
@@ -144,7 +144,11 @@ export default {
       element.scrollIntoView(true);
 
       // Scroll down to display the content below the navigation bar.
-      window.scrollBy(0, -this.navigationBarHeight - additionalOffset);
+      window.scrollBy({
+        top: -this.navigationBarHeight - additionalOffset,
+        left: 0,
+        behavior: 'smooth',
+      });
     },
     onSubmit() {
       this.$nextTick(() => {
diff --git a/src/mixins/scrollToElement.js b/src/mixins/scrollToElement.js
index 5ec6769a8..311d902f2 100644
--- a/src/mixins/scrollToElement.js
+++ b/src/mixins/scrollToElement.js
@@ -26,7 +26,11 @@ export default {
       element.scrollIntoView();
       // if not scrolled to the bottom, use the offset
       if (window.scrollY + window.innerHeight < document.body.scrollHeight) {
-        window.scrollBy(-offset.x, -offset.y);
+        window.scrollBy({
+          top: -offset.y,
+          left: -offset.x,
+          behavior: 'smooth',
+        });
       }
       return element;
     },
diff --git a/src/styles/base/_reset.scss b/src/styles/base/_reset.scss
index 77283d40a..aa8042287 100644
--- a/src/styles/base/_reset.scss
+++ b/src/styles/base/_reset.scss
@@ -18,7 +18,6 @@ html {
   // enough that it does not actually exceed the breakpoint height.
   background-color: var(--colors-text-background, var(--color-text-background));
   height: 100%;
-  scroll-behavior: smooth;
 }
 
 //============================================================
diff --git a/src/utils/router-utils.js b/src/utils/router-utils.js
index b85393bfe..43e277327 100644
--- a/src/utils/router-utils.js
+++ b/src/utils/router-utils.js
@@ -89,7 +89,11 @@ export async function restoreScrollOnReload() {
     // one tick for the page to render
     // a second tick for the data to be rendered
     await waitFrames(2);
-    window.scrollTo(scrollPosition.x, scrollPosition.y);
+    window.scrollTo({
+      top: scrollPosition.y,
+      left: scrollPosition.x,
+      behavior: 'smooth',
+    });
   }
 }
 
diff --git a/src/utils/scroll-lock.js b/src/utils/scroll-lock.js
index a9ac31acd..05f122714 100644
--- a/src/utils/scroll-lock.js
+++ b/src/utils/scroll-lock.js
@@ -160,7 +160,11 @@ export default {
       document.body.style.removeProperty('width');
 
       // restore scrolled Y position after resetting the position property
-      window.scrollTo(0, Math.abs(scrolledClientY));
+      window.scrollTo({
+        top: Math.abs(scrolledClientY),
+        left: 0,
+        behavior: 'smooth',
+      });
     }
     isLocked = false;
   },

From 7448b061b6eb584564a77f3dab80c55cdb13136f Mon Sep 17 00:00:00 2001
From: Sanjaiyan Parthipan <parthipankalayini@gmail.com>
Date: Thu, 14 Sep 2023 22:16:01 +0530
Subject: [PATCH 3/4] fix: scrolling issue


From e5faaa581f2302efd563d079bbb6d8e37e1e4bc2 Mon Sep 17 00:00:00 2001
From: Sanjaiyan Parthipan <parthipankalayini@gmail.com>
Date: Sat, 16 Sep 2023 23:52:27 +0530
Subject: [PATCH 4/4] minor fix

---
 src/components/Navigator/NavigatorCard.vue | 1 -
 src/utils/scroll-lock.js                   | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/components/Navigator/NavigatorCard.vue b/src/components/Navigator/NavigatorCard.vue
index df7ddb5e1..f0ffc597f 100644
--- a/src/components/Navigator/NavigatorCard.vue
+++ b/src/components/Navigator/NavigatorCard.vue
@@ -933,7 +933,6 @@ export default {
       this.$refs.scroller.$el.scrollBy({
         top: offsetHeight * positionIndex,
         left: 0,
-        behavior: 'smooth',
       });
     },
     handleFocusOut(event) {
diff --git a/src/utils/scroll-lock.js b/src/utils/scroll-lock.js
index 05f122714..ec347eba5 100644
--- a/src/utils/scroll-lock.js
+++ b/src/utils/scroll-lock.js
@@ -163,7 +163,6 @@ export default {
       window.scrollTo({
         top: Math.abs(scrolledClientY),
         left: 0,
-        behavior: 'smooth',
       });
     }
     isLocked = false;