Prevent the top bar from covering the heading when scrolling down (in mobile views)

_javascript/utils/smooth-scroll.js

@@ -21,11 +21,18 @@ $(function() {
     .not("[href='#']")
     .not("[href='#0']")
     .click(function(event) {
-      if (this.pathname.replace(/^\//, "") === location.pathname.replace(/^\//, "")) {
+
-        if (location.hostname === this.hostname) {
+      if (this.pathname.replace(/^\//, "") !== location.pathname.replace(/^\//, "")) {
+        return;
+      }
+
+      if (location.hostname !== this.hostname) {
+        return;
+      }
+
       const hash = decodeURI(this.hash);
       let toFootnoteRef = RegExp(/^#fnref:/).test(hash);
-          let toFootnote = toFootnoteRef? false : RegExp(/^#fn:/).test(hash);
+      let toFootnote = toFootnoteRef ? false : RegExp(/^#fn:/).test(hash);
       let selector = hash.includes(":") ? hash.replace(/\:/g, "\\:") : hash;
       let $target = $(selector);
 
@@ -33,14 +40,17 @@ $(function() {
       let isAnchor = RegExp(/^H\d/).test(parent);
       let isMobileViews = !$topbarTitle.is(":hidden");
 
-          if (typeof $target !== "undefined") {
+      if (typeof $target === "undefined") {
+        return;
+      }
+
       event.preventDefault();
 
       if (history.pushState) { /* add hash to URL */
         history.pushState(null, null, hash);
       }
 
-            let curOffset = isAnchor? $(this).offset().top : $(window).scrollTop();
+      let curOffset = isAnchor ? $(this).offset().top : $(window).scrollTop();
       let destOffset = $target.offset().top -= REM / 2;
 
       if (destOffset < curOffset) { // scroll up
@@ -56,6 +66,11 @@ $(function() {
         if ((isAnchor || toFootnoteRef) && isMobileViews) {
           destOffset -= topbarHeight;
         }
+
+      } else {
+        if (isMobileViews) {
+          destOffset -= topbarHeight;
+        }
       }
 
       $("html").animate({
@@ -93,9 +108,5 @@ $(function() {
           }
         }
       });
-          }
-        }
-      }
-
     }); /* click() */
 });