mirror of
https://github.com/oceanprotocol/docs.git
synced 2024-11-26 19:49:26 +01:00
Improvement: Sidebar list
This commit is contained in:
parent
fef6cb9fbf
commit
7e98d8d2c2
@ -4,6 +4,7 @@ import HeaderSection from '../components/HeaderSection'
|
||||
import Content from '../components/Content'
|
||||
import styles from '../templates/Doc.module.scss'
|
||||
import MarkdownTemplate from './MarkdownTemplate'
|
||||
import sidebarStyles from '../components/Sidebar.module.scss'
|
||||
|
||||
export default function MarkdownList({ pageContext }) {
|
||||
const subSections = {}
|
||||
@ -35,19 +36,26 @@ export default function MarkdownList({ pageContext }) {
|
||||
<Content>
|
||||
<main className={styles.wrapper}>
|
||||
<aside className={styles.sidebar}>
|
||||
<ul>
|
||||
<nav className={sidebarStyles.sidebar}>
|
||||
{Object.keys(subSections).map((ele, subSectionIndex) => {
|
||||
return selectedSubSection === subSectionIndex ? (
|
||||
<li key={subSectionIndex}>
|
||||
<div key={subSectionIndex}>
|
||||
<h4 className={sidebarStyles.groupTitle}>
|
||||
<a
|
||||
style={{ cursor: 'pointer', color: 'black' }}
|
||||
onClick={() => changeSubsection(subSectionIndex)}
|
||||
>
|
||||
{ele.replace(/_/g, ' ')}
|
||||
</a>
|
||||
<div className={sidebarStyles.list}>
|
||||
<ul>
|
||||
{subSections[ele].map((node) => (
|
||||
<li
|
||||
className={
|
||||
elem.id === node.id
|
||||
? sidebarStyles.active
|
||||
: sidebarStyles.link
|
||||
}
|
||||
key={node.id}
|
||||
onClick={() => changePage(subSectionIndex, node)}
|
||||
>
|
||||
@ -61,19 +69,23 @@ export default function MarkdownList({ pageContext }) {
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</li>
|
||||
</div>
|
||||
</h4>
|
||||
</div>
|
||||
) : (
|
||||
<li>
|
||||
<div>
|
||||
<h4 className={sidebarStyles.groupTitle}>
|
||||
<a
|
||||
onClick={() => changeSubsection(subSectionIndex)}
|
||||
style={{ cursor: 'pointer', color: '#8b98a9' }}
|
||||
>
|
||||
{ele.replace(/_/g, ' ')}
|
||||
</a>
|
||||
</li>
|
||||
</h4>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
</nav>
|
||||
</aside>
|
||||
<article className={styles.main}>
|
||||
<MarkdownTemplate data={elem}></MarkdownTemplate>
|
||||
|
Loading…
Reference in New Issue
Block a user