diff options
| author | Alex Pooley (@zuedev) <zuedev@gmail.com> | 2026-05-30 03:22:15 +0100 |
|---|---|---|
| committer | Alex Pooley (@zuedev) <zuedev@gmail.com> | 2026-05-30 03:22:15 +0100 |
| commit | d6b268829c0bf2d5b5b063d668be6ff0deed408a (patch) | |
| tree | 2a4cf802b04c0ea023f9a37861196ff9a4e2d98f | |
| parent | c1c8e8f33d277699fedf565e5a0efe1386470cf4 (diff) | |
| download | unnamed-group-d6b268829c0bf2d5b5b063d668be6ff0deed408a.tar unnamed-group-d6b268829c0bf2d5b5b063d668be6ff0deed408a.tar.gz unnamed-group-d6b268829c0bf2d5b5b063d668be6ff0deed408a.tar.bz2 unnamed-group-d6b268829c0bf2d5b5b063d668be6ff0deed408a.tar.xz unnamed-group-d6b268829c0bf2d5b5b063d668be6ff0deed408a.zip | |
return of the toc
| -rw-r--r-- | 174bg/handbook/source/index.css | 8 | ||||
| -rw-r--r-- | 174bg/handbook/source/index.html | 76 |
2 files changed, 82 insertions, 2 deletions
diff --git a/174bg/handbook/source/index.css b/174bg/handbook/source/index.css index 72cd38f..ec705bb 100644 --- a/174bg/handbook/source/index.css +++ b/174bg/handbook/source/index.css @@ -1,6 +1,14 @@ @import "tailwindcss"; @plugin "@tailwindcss/typography"; +@utility hide-scrollbar { + &::-webkit-scrollbar { + display: none; + } + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} + p { text-align: justify; } diff --git a/174bg/handbook/source/index.html b/174bg/handbook/source/index.html index 51409d9..8e5bb7a 100644 --- a/174bg/handbook/source/index.html +++ b/174bg/handbook/source/index.html @@ -6,8 +6,10 @@ <title>174th Battle Group Handbook</title> <link href="index.css" rel="stylesheet" /> </head> - <body class="dark:bg-stone-900"> - <nav> + <body class="dark:bg-stone-900 flex flex-row"> + <nav + class="w-64 p-4 border-r border-stone-700 h-screen sticky top-0 overflow-y-auto hide-scrollbar" + > <div id="table-of-contents"></div> <div id="search"></div> </nav> @@ -1531,4 +1533,74 @@ </main> </body> <script src="wikilinks.js"></script> + <script> + document.addEventListener("DOMContentLoaded", () => { + generateTableOfContents(); + }); + + function generateTableOfContents() { + const container = document.getElementById("table-of-contents"); + if (!container) return; + + const sections = document.querySelectorAll( + "main article[id], main section[id]", + ); + + const entries = []; + sections.forEach((section) => { + const heading = section.querySelector("h1, h2, h3, h4, h5, h6"); + if (!heading) return; + entries.push({ + id: section.id, + level: parseInt(heading.tagName.charAt(1), 10), + text: heading.textContent.trim(), + }); + }); + + if (entries.length === 0) return; + + const baseLevel = Math.min(...entries.map((entry) => entry.level)); + + const rootList = document.createElement("ul"); + rootList.className = "space-y-1 text-sm"; + const stack = [{ level: baseLevel - 1, list: rootList, item: null }]; + + entries.forEach((entry) => { + while ( + stack.length > 1 && + entry.level <= stack[stack.length - 1].level + ) { + stack.pop(); + } + + const parent = stack[stack.length - 1]; + + let parentList = parent.list; + if (!parentList) { + parentList = document.createElement("ul"); + parentList.className = + "mt-1 ml-3 space-y-1 border-l border-stone-200 pl-3 dark:border-stone-700"; + parent.item.appendChild(parentList); + parent.list = parentList; + } + + const listItem = document.createElement("li"); + const link = document.createElement("a"); + link.href = "#" + entry.id; + link.textContent = entry.text; + link.className = + "block rounded px-2 py-1 text-stone-600 no-underline transition-colors hover:bg-stone-100 hover:text-stone-900 dark:text-stone-400 dark:hover:bg-stone-800 dark:hover:text-stone-100"; + listItem.appendChild(link); + parentList.appendChild(listItem); + + stack.push({ + level: entry.level, + list: null, + item: listItem, + }); + }); + + container.appendChild(rootList); + } + </script> </html> |