From 1ef8d70ac466cf12772eb0cb74d6b2feed4b64f1 Mon Sep 17 00:00:00 2001
From: Em Zhan <zqianem@gmail.com>
Date: Sat, 17 Jun 2023 21:40:39 -0500
Subject: [PATCH] Avoid menu border flash during page navigation

Partially addresses #443
---
 src/theme/book.js   | 7 ++++---
 src/theme/index.hbs | 2 +-
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/theme/book.js b/src/theme/book.js
index ff3650eb..1911b118 100644
--- a/src/theme/book.js
+++ b/src/theme/book.js
@@ -676,13 +676,14 @@ function playground_text(playground, hidden = true) {
         }, { passive: true });
     })();
     (function controllBorder() {
-        menu.classList.remove('bordered');
-        document.addEventListener('scroll', function () {
+        function updateBorder() {
             if (menu.offsetTop === 0) {
                 menu.classList.remove('bordered');
             } else {
                 menu.classList.add('bordered');
             }
-        }, { passive: true });
+        }
+        updateBorder();
+        document.addEventListener('scroll', updateBorder, { passive: true });
     })();
 })();
diff --git a/src/theme/index.hbs b/src/theme/index.hbs
index 6f3948c6..195e41bc 100644
--- a/src/theme/index.hbs
+++ b/src/theme/index.hbs
@@ -115,7 +115,7 @@
             <div class="page">
                 {{> header}}
                 <div id="menu-bar-hover-placeholder"></div>
-                <div id="menu-bar" class="menu-bar sticky bordered">
+                <div id="menu-bar" class="menu-bar sticky">
                     <div class="left-buttons">
                         <button id="sidebar-toggle" class="icon-button" type="button" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
                             <i class="fa fa-bars"></i>