From bcd4b2694bc4a24c0b10eb21925368ab204fa82d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=B6ren=20Weber?= <mail@soeren-weber.de>
Date: Mon, 6 Jun 2022 00:44:04 +0200
Subject: [PATCH] toc: add scrollbar #262

---
 static/css/theme.css | 5 +++--
 static/js/theme.js   | 3 +++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/static/css/theme.css b/static/css/theme.css
index db0e706ac2..99c5482d81 100644
--- a/static/css/theme.css
+++ b/static/css/theme.css
@@ -1159,9 +1159,10 @@ option {
 
 #TableOfContents {
     font-size: 13px !important;
-    max-height: 85%;
-    overflow: auto;
+    max-height: 90vh;
+    overflow: hidden;
     padding: 15px 5px !important;
+    position: relative; /* PS */
 }
 
 #TableOfContents > ul > li > a {
diff --git a/static/js/theme.js b/static/js/theme.js
index 78b7dd4205..f8502f23da 100644
--- a/static/js/theme.js
+++ b/static/js/theme.js
@@ -427,6 +427,7 @@ function initToc(){
     function showToc(){
         var b = document.querySelector( 'body' );
         b.classList.toggle( 'toc-flyout' );
+        pst && pst.update();
     }
 
     document.querySelector( '#sidebar-overlay' ).addEventListener( 'click', showNav );
@@ -434,10 +435,12 @@ function initToc(){
     document.querySelector( '#toc-overlay' ).addEventListener( 'click', showToc );
     var t = document.querySelector( '#toc-menu' );
     var p = document.querySelector( '.progress' );
+    var pst;
     if( t && p ){
         // we may not have a toc
         t.addEventListener( 'click', showToc );
         p.addEventListener( 'click', showToc );
+        pst = new PerfectScrollbar('#TableOfContents');
     }
 }