Highlight currently visited section.

2 files changed, 36 insertions, 0 deletions

diff --git a/docs/_static/custom.js b/docs/_static/custom.js
new file mode 100644
index 00000000..235a14ea
--- /dev/null
+++ b/docs/_static/custom.js
@@ -0,0 +1,31 @@
+$(document).ready(function () {
+  var sections = $('div.section');
+  var activeLink = null;
+  var bottomHeightThreshold = $(document).height() - 30;
+
+  $(window).scroll(function (event) {
+    var distanceFromTop = $(this).scrollTop();
+    var currentSection = null;
+
+    if(distanceFromTop + window.innerHeight > bottomHeightThreshold) {
+      currentSection = $(sections[sections.length - 1]);
+    }
+    else {
+      sections.each(function () {
+        var section = $(this);
+        if (section.offset().top - 1 < distanceFromTop) {
+          currentSection = section;
+        }
+      });
+    }
+
+    if (activeLink) {
+      activeLink.parent().removeClass('active');
+    }
+
+    if (currentSection) {
+      activeLink = $('.sphinxsidebar a[href="#' + currentSection.attr('id') + '"]');
+      activeLink.parent().addClass('active');
+    }
+  });
+});
diff --git a/docs/_static/style.css b/docs/_static/style.css
index b7d1ac29..9afc6f31 100644
--- a/docs/_static/style.css
+++ b/docs/_static/style.css
@@ -421,6 +421,11 @@ div#welcome-to-discord-py > h1 {
   display: none;
 }
 
+.active {
+  background-color: #dbdbdb;
+  border-left: 5px solid #dbdbdb;
+}
+
 @media screen and (max-width: 870px) {
 
   div.document {