-
Notifications
You must be signed in to change notification settings - Fork 144
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* feat: add table of contents Also standardized on in-content H1s away from pagetitles Fixed missing H2s on gmp overview Fixes #737 * fix: organize styles and hide TOC on small screens * fix: only with 3 or more TOC items * chore: remove dead code
- Loading branch information
1 parent
b46aecd
commit 0058f98
Showing
10 changed files
with
160 additions
and
66 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,32 +1,50 @@ | ||
| --- | ||
| import MainLayout from "./MainLayout.astro"; | ||
| import Navigation from "./Navigation.astro"; | ||
| import TableOfContents from "./TableOfContents.astro"; | ||
| import { getGithubEditUrl } from '../scripts/github-edit'; | ||
| import { getGithubEditUrl } from "../scripts/github-edit"; | ||
| const githubEditUrl = getGithubEditUrl(Astro); | ||
| const { title, description, image, hidden } = Astro.props.frontmatter || Astro.props; | ||
| const { frontmatter, headings } = Astro.props; | ||
| const { description, image, hidden } = Astro.props.frontmatter || Astro.props; | ||
| --- | ||
|
|
||
| <MainLayout {...Astro.props}> | ||
| <div id="page"> | ||
| <div class="sideNav nomobile"> | ||
| <Navigation /> | ||
| </div> | ||
| <div class="mainBody"> | ||
| <h1>{title}</h1> | ||
| <!-- <div style="display:flex;justify-content:space-between;"> | ||
| {# <a href="https://github.com/axelarnetwork/documentation/edit/main/{{page.inputPath}}">Suggest Edits</a> #} | ||
| </div> --> | ||
| <article> | ||
| <slot /> | ||
| <div style="margin-top:32px;"><a href={githubEditUrl}><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="pen" class="svg-inline--fa fa-pen fa-w-16 astro-mgbad2nq" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" height="1em" width="1em"> | ||
| <path fill="currentColor" d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z" class="astro-mgbad2nq"></path> | ||
| </svg> Edit this page</a></div> | ||
| </article> | ||
| <div id="page"> | ||
| <div class="sideNav nomobile"> | ||
| <Navigation /> | ||
| </div> | ||
| <div class="mainBody"> | ||
| <article> | ||
| <slot /> | ||
| <div style="margin-top:32px;"> | ||
| <a href={githubEditUrl} | ||
| ><svg | ||
| aria-hidden="true" | ||
| focusable="false" | ||
| data-prefix="fas" | ||
| data-icon="pen" | ||
| class="svg-inline--fa fa-pen fa-w-16 astro-mgbad2nq" | ||
| role="img" | ||
| xmlns="http://www.w3.org/2000/svg" | ||
| viewBox="0 0 512 512" | ||
| height="1em" | ||
| width="1em" | ||
| > | ||
| <path | ||
| fill="currentColor" | ||
| d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z" | ||
| class="astro-mgbad2nq"></path> | ||
| </svg> Edit this page</a | ||
| > | ||
| </div> | ||
|
|
||
| </article> | ||
| { | ||
| headings && headings.length > 2 && ( | ||
| <TableOfContents headings={headings} /> | ||
| ) | ||
| } | ||
| </div> | ||
| </div> | ||
| </MainLayout> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,36 @@ | ||
| --- | ||
| import TableOfContentsHeading from "./TableOfContentsHeading.astro"; | ||
| const { headings } = Astro.props; | ||
| const toc = buildToc(headings); | ||
| function buildToc(headings) { | ||
| const toc: any[] = []; | ||
| const parentHeadings = new Map(); | ||
| headings.forEach((h) => { | ||
| const heading = { ...h, subheadings: [] }; | ||
| parentHeadings.set(heading.depth, heading); | ||
| // Change 2 to 1 if your markdown includes your <h1> | ||
| if (heading.depth === 2) { | ||
| toc.push(heading); | ||
| } else if (heading.depth < 4 && heading.depth > 1) { | ||
| if (!parentHeadings.get(heading.depth - 1)) { | ||
| console.log("No parent heading for", heading); | ||
| return; | ||
| } | ||
| parentHeadings.get(heading.depth - 1).subheadings.push(heading); | ||
| } else { | ||
| // Skip headings that are too deep or shallow | ||
| } | ||
| }); | ||
| return toc; | ||
| } | ||
| --- | ||
|
|
||
| <div id="toc"> | ||
| <strong>On this page</strong> | ||
| <ul> | ||
| {toc.map((heading) => <TableOfContentsHeading heading={heading} />)} | ||
| </ul> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| --- | ||
| const { heading } = Astro.props; | ||
| --- | ||
|
|
||
| <li> | ||
| <a href={"#" + heading.slug}> | ||
| {heading.text} | ||
| </a> | ||
| { | ||
| heading.subheadings.length > 0 && ( | ||
| <ul> | ||
| {heading.subheadings.map((subheading) => ( | ||
| <Astro.self heading={subheading} /> | ||
| ))} | ||
| </ul> | ||
| ) | ||
| } | ||
| </li> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,14 +1,8 @@ | ||
| // Get the current URL | ||
| const currentUrl = window.location.href; | ||
| const links = document.querySelectorAll(".sideNav a, nav a"); | ||
|
|
||
| // Get all links on the page | ||
| const links = document.querySelectorAll("a"); | ||
|
|
||
| // Loop through the links | ||
| for (let link of links) { | ||
| // If the link's href matches the current URL | ||
| if (link.href === currentUrl) { | ||
| // Add the active class to the link | ||
| link.classList.add("active"); | ||
| } | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters