Fixed: use original class for highlighting sidebar item

resources/css/theme-default.style.css

@@ -511,7 +511,8 @@ html {
 .tocify-wrapper .tocify-focus {
     box-shadow: 0 1px 0 #000;
     background-color: #2467af;
-    color: #fff
+    color: #fff;
+    font-weight: bold;
 }
 
 .tocify-wrapper .tocify-subheader {
@@ -526,10 +527,6 @@ html {
     display: block;
 }
 
-.tocify-wrapper .tocify-subheader .tocify-item>a.active {
-    font-weight: bold;
-}
-
 .tocify-wrapper .tocify-subheader .tocify-item>a {
     padding-left: 25px;
     font-size: 12px

resources/js/theme-default.js

@@ -1,7 +1,7 @@
 function hashChange() {
-    const currentItems = document.querySelectorAll('.tocify-subheader.visible, .tocify-item a.active');
+    const currentItems = document.querySelectorAll('.tocify-subheader.visible, .tocify-item.tocify-focus');
     Array.from(currentItems).forEach((elem) => {
-        elem.classList.remove('visible', 'active');
+        elem.classList.remove('visible', 'tocify-focus');
     });
 
     const currentTag = document.querySelector(`a[href="${window.location.hash}"]`);
@@ -18,7 +18,7 @@ function hashChange() {
             });
         }
 
-        currentTag.classList.add('active');
+        currentTag.parentElement.classList.add('tocify-focus');
         // wait for dom changes to be done
         setTimeout(() => currentTag.scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'center' }), 1500);
     }