This commit is contained in:
lingdocs 2022-09-10 23:25:19 +04:00
parent 3c0dcf99d5
commit e9e6193784
3 changed files with 46 additions and 46 deletions

View File

@ -1,45 +0,0 @@
/**
* Copyright (c) 2021 lingdocs.com
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
import { NavHashLink } from 'react-router-hash-link';
import Scrollspy from 'react-scrollspy';
function TableOfContents({ tableOfContents }) {
return (
<nav className="table-of-contents col-3 col-xl-4 text-muted mx-3 my-3">
<Scrollspy items={tableOfContents.map(x => x.id)} currentClassName="is-current">
{tableOfContents.map(item => {
if (item.level === 2) return (
<div key={item.title} className="table-of-contents-item">
<div className="link-unstyled pb-2">
<NavHashLink smooth to={`#${item.id}`}>{item.title}</NavHashLink>
</div>
{item.children.map(child => {
if (child.level === 3) return (
<div className="link-unstyled ml-2 pb-1" key={child.title}>
<small>
<NavHashLink smooth to={`#${child.id}`}>
{child.title}
</NavHashLink>
</small>
</div>
);
else return undefined;
})}
</div>
)
else {
return null;
}
})}
</Scrollspy>
</nav>
);
}
export default TableOfContents;

View File

@ -0,0 +1,45 @@
/**
* Copyright (c) 2021 lingdocs.com
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*/
import { NavHashLink } from 'react-router-hash-link';
import Scrollspy from 'react-scrollspy';
function TableOfContents({ tableOfContents }) {
return (
<nav className="table-of-contents col-3 col-xl-4 text-muted mx-3 my-3">
<Scrollspy items={tableOfContents.map(x => x.id)} currentClassName="is-current">
{tableOfContents.map(item => {
if (item.level === 2) return (
<div key={item.title} className="table-of-contents-item">
<div className="link-unstyled pb-2">
<NavHashLink smooth to={`#${item.id}`}>{item.title}</NavHashLink>
</div>
{item.children.map(child => {
if (child.level === 3) return (
<div className="link-unstyled ml-2 pb-1" key={child.title}>
<small>
<NavHashLink smooth to={`#${child.id}`}>
{child.title}
</NavHashLink>
</small>
</div>
);
else return undefined;
})}
</div>
)
else {
return null;
}
})}
</Scrollspy>
</nav>
);
}
export default TableOfContents;

View File

@ -53,7 +53,7 @@ const LandingPage = () => {
return <> return <>
<main className="col bg-faded py-3 d-flex flex-column"> <main className="col bg-faded py-3 d-flex flex-column">
<h1>LingDocs Pashto Grammar</h1> <h1>LingDocs Pashto Grammar</h1>
<p className="lead">Explore the wonderful language of Pashto you can</p> <p className="lead">Explore the wonderful language of Pashto</p>
{content.map((block) => ( {content.map((block) => (
<Link to={block.link} className="plain-link"> <Link to={block.link} className="plain-link">
<div className="card clickable my-2" style={{ maxWidth: "600px"}}> <div className="card clickable my-2" style={{ maxWidth: "600px"}}>