From 2b33152e18ea01c0bdb5cde9331bb24730580275 Mon Sep 17 00:00:00 2001
From: Akshay <akshay.ap95@gmail.com>
Date: Sun, 11 Apr 2021 12:39:21 +0200
Subject: [PATCH] [WIP]Improvment: Read the docs

---
 src/templates/MarkdownList.jsx     | 14 +++++++++++++-
 src/templates/MarkdownTemplate.jsx |  8 +++++++-
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/templates/MarkdownList.jsx b/src/templates/MarkdownList.jsx
index 18d96f58..8f5fd4ca 100644
--- a/src/templates/MarkdownList.jsx
+++ b/src/templates/MarkdownList.jsx
@@ -1,14 +1,26 @@
 import { Link } from "gatsby"
 import React from "react"
 import Layout from "../components/Layout"
+import HeaderSection from '../components/HeaderSection'
+import Content from '../components/Content'
+import styles from './Doc.module.scss'
+import MarkdownTemplate from "./MarkdownTemplate"
 
 export default function MarkdownList({pageContext}) {
   return (
     <Layout>
-        <div>{pageContext.name}</div>
+        <HeaderSection title={pageContext.name} />
+        <Content>
+        <main className={styles.wrapper}>
+        <aside className={styles.sidebar}>
         <ul>
          {pageContext.markdownList.map(({node})=><li><Link to={node.frontmatter.slug}>{node.frontmatter.title}</Link></li>)}
         </ul>
+        </aside>
+        {/* <MarkdownTemplate path={pageContext.markdownList[0]}></MarkdownTemplate> */}
+        {/* {pageContext.markdownList[0]} */}
+        </main>
+        </Content>
     </Layout>
   )
 }
diff --git a/src/templates/MarkdownTemplate.jsx b/src/templates/MarkdownTemplate.jsx
index 286a3fe2..c47005f1 100644
--- a/src/templates/MarkdownTemplate.jsx
+++ b/src/templates/MarkdownTemplate.jsx
@@ -4,15 +4,20 @@ import DocToc from '../components/DocToc'
 import DocHeader from '../components/DocHeader'
 import DocContent from '../components/DocContent'
 import Layout from '../components/Layout'
+import HeaderSection from '../components/HeaderSection'
+import Content from '../components/Content'
 
 export default function MarkdownTemplate({data}) {
     const post = data.markdownRemark
   return (
     <Layout>
         {/* <div dangerouslySetInnerHTML={{__html:post.html}}></div> */}
-        <DocHeader title={post.frontmatter.title}/>
+        {/* <DocHeader title={post.frontmatter.title}/> */}
+        <HeaderSection title={post.frontmatter.title} />
         {post.tableOfContents && <DocToc tableOfContents={post.tableOfContents} />}
+        <Content>
         <DocContent html={post.html} htmlAst={post.htmlAst} />
+        </Content>
     </Layout>
   )
 }
@@ -26,6 +31,7 @@ export const postQuery = graphql`
       frontmatter {
         slug
         title
+        section
       }
       ...PageFooter
     }