Refine scrollspy style and behavior (#2290)

Author: chalin

.vscode/cspell.json

@@ -6,11 +6,12 @@
     "Docsy",
     "errorf",
     "hugo",
+    "relref",
+    "scrollspy",
     "shortcode",
     "shortcodes",
     "tabpane",
     "upvote",
-    "warnf",
-    "relref"
+    "warnf"
   ]
 }

assets/scss/_sidebar-toc.scss

@@ -63,7 +63,7 @@
       &.active {
         color: var(--bs-primary);
         border-left-color: var(--bs-primary);
-        font-weight: $font-weight-medium;
+        background-color: var(--bs-secondary-bg-subtle);
       }
 
       &:focus,

layouts/_partials/td/scroll-spy-attr.txt

@@ -0,0 +1,9 @@
+{{ if not (.Param "ui.scrollspy.disable") -}}
+  {{ replaceRE `\s+` " "
+  `
+  data-bs-spy="scroll"
+  data-bs-target="#TableOfContents"
+  data-bs-smooth-scroll="true"
+  data-bs-root-margin="0px 0px -40%"
+  `
+ | strings.TrimSpace | add " " }} {{ end -}}

layouts/_partials/td/scrollspy-attr.txt

@@ -11,7 +11,7 @@
       {{ partial "navbar.html" . }}
     </header>
     <div class="container-fluid td-outer">
-      <div class="td-main" {{ partialCached "td/scroll-spy-attr.txt" . | safeHTMLAttr }}>
+      <div class="td-main" {{- partialCached "td/scrollspy-attr.txt" . .Section | safeHTMLAttr }}>
         <div class="row flex-xl-nowrap">
           <aside class="col-12 col-md-3 col-xl-2 td-sidebar d-print-none">
             {{ partial "sidebar.html" . }}

layouts/blog/baseof.html

@@ -11,7 +11,7 @@
       {{ partial "navbar.html" . }}
     </header>
     <div class="container-fluid td-outer">
-      <div class="td-main" {{ partialCached "td/scroll-spy-attr.txt" . | safeHTMLAttr }}>
+      <div class="td-main" {{- partialCached "td/scrollspy-attr.txt" . .Section | safeHTMLAttr }}>
         <div class="row flex-xl-nowrap">
           <aside class="col-12 col-md-3 col-xl-2 td-sidebar d-print-none">
             {{ partial "sidebar.html" . }}

layouts/docs/baseof.html

@@ -1,4 +1,4 @@
 ---
 title: Blog
-menu: {main: {weight: 50}}
+menu: { main: { weight: 50 } }
 ---