use scrollspy on docs pages

GeoSot · GeoSot · commit dfdebd748363 · 2022-10-03T21:05:56.000+03:00
diff --git a/site/assets/scss/_toc.scss b/site/assets/scss/_toc.scss
@@ -1,4 +1,5 @@
 // stylelint-disable selector-max-type
+// stylelint-disable selector-no-qualifying-type
 
 .bd-toc {
   @include media-breakpoint-up(lg) {
@@ -29,10 +30,18 @@
     }
 
     a {
+      padding: .1rem .2rem;
       color: inherit;
+      text-decoration: none;
+      @include border-radius(.2rem);
 
-      &:not(:hover) {
-        text-decoration: none;
+      &:hover,
+      &.active {
+        color: $bd-purple;
+        background-color: $bd-purple-light;
+      }
+      &.active {
+        font-weight: 500;
       }
 
       code {
diff --git a/site/layouts/_default/docs.html b/site/layouts/_default/docs.html
@@ -1,3 +1,4 @@
+{{ define "body_override" }}<body data-bs-spy="scroll" tabindex="0" data-bs-target="#TableOfContents">{{ end }}
 {{ define "main" }}
   <div class="container-xxl bd-gutter mt-3 my-md-4 bd-layout">
     <aside class="bd-sidebar">

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,4 @@`
	`1`	`+{{ define "body_override" }}<body data-bs-spy="scroll" tabindex="0" data-bs-target="#TableOfContents">{{ end }}`
`1`	`2`	`{{ define "main" }}`
`2`	`3`	`<div class="container-xxl bd-gutter mt-3 my-md-4 bd-layout">`
`3`	`4`	`<aside class="bd-sidebar">`