🎨 Style: add scroll bar for auto toc (#136)

hugo-fixit · May 17, 2022 · aa208e2 · aa208e2
1 parent 791ff12
commit aa208e2
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,6 +8,7 @@ All notable changes to this project will be documented in this file.
 > Add hugo new features support.
 > Snapshot: 
 
+- :art: Style: add scroll bar for auto toc ([#136](https://github.com/Lruihao/FixIt/issues/136))
 - :arrow_up: Chore: update some third-party libraries
 - **Full Changelog:** @Lruihao [`v0.2.14...v0.2.15`](https://github.com/Lruihao/FixIt/compare/v0.2.14...v0.2.15)
 

diff --git a/assets/css/_partial/_single/_toc.scss b/assets/css/_partial/_single/_toc.scss
@@ -9,7 +9,7 @@
     font-size: $toc-content-font-size;
 
     ul {
-      text-indent: -0.85rem;
+      text-indent: -0.8rem;
       padding-left: 0.8rem;
       list-style: none;
 
@@ -75,12 +75,15 @@
   }
 
   .toc-content {
+    overflow-y: scroll;
+    max-height: calc(100vh - #{2*$header-height});
+
     &.always-active ul {
       display: block;
     }
 
     > nav > ul {
-      margin: 0.625rem 0;
+      margin: 0;
     }
 
     ul {

diff --git a/exampleSite/content/posts/theme-documentation-basics/index.en.md b/exampleSite/content/posts/theme-documentation-basics/index.en.md
@@ -16,6 +16,9 @@ categories: ["documentation"]
 
 lightgallery: true
 
+toc:
+  auto: false
+
 menu:
   main:
     name: "Basics"

diff --git a/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md b/exampleSite/content/posts/theme-documentation-basics/index.zh-cn.md
@@ -16,6 +16,9 @@ categories: ["documentation"]
 
 lightgallery: true
 
+toc:
+  auto: false
+
 menu:
   main:
     title: "探索 Hugo - FixIt 主题的全部内容和背后的核心概念。"
-Original file line number
+Diff line change
@@ Expand Up / @@ -16,6 +16,9 @@ categories: ["documentation"] @@
     lightgallery: true
+    toc:
+      auto: false
     menu:
       main:
         name: "Basics"
@@ Expand Down @@