Bug 1426685 - Fix regressions from fixed-positioning global header

4 files changed, 38 insertions, 48 deletions

diff --git a/extensions/BugModal/web/bug_modal.css b/extensions/BugModal/web/bug_modal.css
index b70a838c1..0fbc536b9 100644
--- a/extensions/BugModal/web/bug_modal.css
+++ b/extensions/BugModal/web/bug_modal.css
@@ -826,10 +826,10 @@ body.platform-Win32 .comment-text, body.platform-Win64 .comment-text {
 
 /* theme */
 
-#bugzilla-body {
+#main-inner {
+    margin: 15px auto;
     max-width: 1024px;
     min-width: 800px;
-    width: 100%;
 }
 
 .vcard {
diff --git a/extensions/BugModal/web/bug_modal.js b/extensions/BugModal/web/bug_modal.js
index 1218b4f27..c1080cde8 100644
--- a/extensions/BugModal/web/bug_modal.js
+++ b/extensions/BugModal/web/bug_modal.js
@@ -141,7 +141,7 @@ $(function() {
     $('#top-btn')
         .click(function(event) {
             event.preventDefault();
-            $.scrollTo($('body'));
+            $.scrollTo($('#main-inner'));
         });
 
     // bottom btn
@@ -1421,31 +1421,26 @@ $(function() {
             return -1;
         },
 
-        // Bring an element into view, leaving space for the outline.
-        // If passed a string, it will be treated as an id - the page will scroll
-        // unanimated and the url will be added to the browser's history.
-        // If passed an element, an smooth scroll will take place and no entry
-        // will be added to the history.
+        // Bring an element into view, leaving space for the outline. If passed
+        // a string, it will be treated as an id - the page will scroll and the
+        // url will be added to the browser's history. If passed an element, no
+        // entry will be added to the history.
         scrollTo: function(target, complete) {
+            let $target;
+
             if (typeof target === 'string') {
-                var el = $('#' + target);
+                $target = $('#' + target);
                 window.location.hash = target;
-                var $html = $('html');
-                if (Math.abs($html.scrollTop() - el.offset().top) <= 1) {
-                    $html.scrollTop($html.scrollTop() - 10);
-                }
-                $html.scrollLeft(0);
+            } else {
+                $target = target;
             }
-            else {
-                var offset = target.offset();
-                $('html')
-                    .animate({
-                            scrollTop: offset.top - 20,
-                            scrollLeft: 0
-                        },
-                        200,
-                        complete
-                    );
+
+            if ($target.length) {
+                $('main').scrollTop(Math.round($target.position().top) - 20);
+            }
+
+            if (complete) {
+                complete();
             }
         }
 
diff --git a/extensions/BugModal/web/common_bug_modal.css b/extensions/BugModal/web/common_bug_modal.css
index b71254cc0..473c4a445 100644
--- a/extensions/BugModal/web/common_bug_modal.css
+++ b/extensions/BugModal/web/common_bug_modal.css
@@ -815,10 +815,10 @@ body.platform-Win32 .comment-text, body.platform-Win64 .comment-text {
 
 /* theme */
 
-#bugzilla-body {
+#main-inner {
+    margin: 15px auto;
     max-width: 1024px;
     min-width: 800px;
-    width: 100%;
 }
 
 .vcard {
diff --git a/extensions/BugModal/web/common_bug_modal.js b/extensions/BugModal/web/common_bug_modal.js
index cc7f31dfd..160f922cc 100644
--- a/extensions/BugModal/web/common_bug_modal.js
+++ b/extensions/BugModal/web/common_bug_modal.js
@@ -141,7 +141,7 @@ $(function() {
     $('#top-btn')
         .click(function(event) {
             event.preventDefault();
-            $.scrollTo($('body'));
+            $.scrollTo($('#main-inner'));
         });
 
     // bottom btn
@@ -1348,31 +1348,26 @@ $(function() {
             return -1;
         },
 
-        // Bring an element into view, leaving space for the outline.
-        // If passed a string, it will be treated as an id - the page will scroll
-        // unanimated and the url will be added to the browser's history.
-        // If passed an element, an smooth scroll will take place and no entry
-        // will be added to the history.
+        // Bring an element into view, leaving space for the outline. If passed
+        // a string, it will be treated as an id - the page will scroll and the
+        // url will be added to the browser's history. If passed an element, no
+        // entry will be added to the history.
         scrollTo: function(target, complete) {
+            let $target;
+
             if (typeof target === 'string') {
-                var el = $('#' + target);
+                $target = $('#' + target);
                 window.location.hash = target;
-                var $html = $('html');
-                if (Math.abs($html.scrollTop() - el.offset().top) <= 1) {
-                    $html.scrollTop($html.scrollTop() - 10);
-                }
-                $html.scrollLeft(0);
+            } else {
+                $target = target;
             }
-            else {
-                var offset = target.offset();
-                $('html')
-                    .animate({
-                            scrollTop: offset.top - 20,
-                            scrollLeft: 0
-                        },
-                        200,
-                        complete
-                    );
+
+            if ($target.length) {
+                $('main').scrollTop(Math.round($target.position().top) - 20);
+            }
+
+            if (complete) {
+                complete();
             }
         }