fix: removes unnecessary codeblock , undo css formatting issues, modi…

…fy scrip load url
facebook · May 30, 2019 · 26bd209 · 26bd209
1 parent 06307c7
commit 26bd209
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 35 deletions.
diff --git a/packages/docusaurus-1.x/lib/core/Head.js b/packages/docusaurus-1.x/lib/core/Head.js
@@ -172,7 +172,7 @@ class Head extends React.Component {
             }}
           />
         )}
-        <script src="/js/scrollSpy.js" />
+        <script src={`${this.props.config.baseUrl}js/scrollSpy.js`} />
         {this.props.config.usePrism && (
           <link
             rel="stylesheet"

diff --git a/packages/docusaurus-1.x/lib/static/css/main.css b/packages/docusaurus-1.x/lib/static/css/main.css
@@ -725,7 +725,7 @@ blockquote {
   position: fixed;
   width: 100%;
   z-index: 9999;
-  transform: translate3d(0, 0, 0);
+  transform: translate3d(0,0,0);
 }
 
 @media only screen and (min-width: 1024px) {
@@ -1743,9 +1743,7 @@ input::placeholder {
   width: 100%;
 }
 
-.line1,
-.line2,
-.line3 {
+.line1, .line2, .line3 {
   width: 100%;
   height: 3px;
   background-color: #393939;
@@ -2380,6 +2378,7 @@ input::placeholder {
 }
 /* End of Footer */
 
+
 .tabs {
   border-top: 1px solid #cfcfcf;
 }

diff --git a/packages/docusaurus-1.x/lib/static/js/scrollSpy.js b/packages/docusaurus-1.x/lib/static/js/scrollSpy.js
@@ -20,25 +20,33 @@
     }
     timer = setTimeout(function() {
       timer = null;
-      let found = false;
-      const headings = findHeadings();
+      let activeNavFound = false;
+      const headings = findHeadings(); // toc nav anchors
       for (let i = 0; i < headings.length; i++) {
-        // if !found and i is the last element, highlight the last
-        let current = !found;
-        if (!found && i < headings.length - 1) {
+        // headings[i] is current element
+        // if an element is already active, then current element is not active
+        // if no element is already active, then current element is active
+        let currNavActive = !activeNavFound;
+        // if current element is active and it is not the last nav item
+        // this loop decides if current active element should stay active or not
+        if (currNavActive && i < headings.length - 1) {
+          // find the next toc nav item
           const next = headings[i + 1].href.split('#')[1];
+          // find the corresponding page header
           const nextHeader = document.getElementById(next);
+          // get top offset (relative to viewport) of next page header
           const top = nextHeader.getBoundingClientRect().top;
-          // The following tests whether top + scrollTop
-          // (the top of the header) is greater than scrollTop
-          // (where scrollTop = window.pageYOffset, the top of
-          // the window), with OFFSET pixels of slop.
-          current = top > OFFSET;
+          // if next header is offset more than 10 pixels from top (it is far) (top > OFFSET)
+          // set/keep the current nav element to active
+          currNavActive = top > OFFSET;
         }
-        if (current) {
-          found = true;
+
+        if (currNavActive) {
+          // if the current nav element is active
+          activeNavFound = true;
           headings[i].classList.add('active');
         } else {
+          // if the current nav element is not active
           headings[i].classList.remove('active');
         }
       }
@@ -50,23 +58,5 @@
     // Cache the headings once the page has fully loaded.
     headingsCache = findHeadings();
     onScroll();
-    // Find the active nav item in the sidebar
-    const item = document.getElementsByClassName('navListItemActive')[0];
-    if (!item) {
-      return;
-    }
-    const bounding = item.getBoundingClientRect();
-    if (
-      bounding.top >= 0 &&
-      bounding.bottom <=
-        (window.innerHeight || document.documentElement.clientHeight)
-    ) {
-      // Already visible.  Do nothing.
-    } else {
-      // Not visible.  Scroll sidebar.
-      item.scrollIntoView({block: 'center', inline: 'nearest'});
-      // eslint-disable-next-line no-multi-assign
-      document.body.scrollTop = document.documentElement.scrollTop = 0;
-    }
   });
 })();