diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx index aa864c827..5e00db3c9 100644 --- a/components/Sidebar.tsx +++ b/components/Sidebar.tsx @@ -98,6 +98,11 @@ const getSpecificationPath = [ '/specification-links', '/specification' ] + +const getResourcesPath = [ + '/resources', +] + export const SidebarLayout = ({ children }: { children: React.ReactNode }) => { const router = useRouter() const [open, setOpen] = useState(false) @@ -118,6 +123,8 @@ export const SidebarLayout = ({ children }: { children: React.ReactNode }) => { {getSpecificationPath.includes(router.asPath) &&

Specification

} + {getResourcesPath.includes(router.asPath) &&

Resources

} + {router.pathname === null &&

Docs

} @@ -154,6 +161,7 @@ export const DocsNav = () => { getStarted: false, getReference: false, getSpecification: false, + getResources: false, }) useEffect(() => { if (getDocsPath.includes(router.asPath)) { @@ -164,6 +172,8 @@ export const DocsNav = () => { setActive({ ...active, getReference: true }) } else if (getSpecificationPath.includes(router.asPath)) { setActive({ ...active, getSpecification: true }) + } else if (getResourcesPath.includes(router.asPath)) { + setActive({ ...active, getResources: true }) } }, [router.asPath]) @@ -183,6 +193,12 @@ export const DocsNav = () => { setActive({ ...active, getSpecification: !active.getSpecification }) } + const handleClickResources = () => { + setActive({ ...active, getResources: !active.getResources }) + } + + const rotateResources = active.getResources ? 'rotate(180deg)' : 'rotate(0)' + const rotate = active.getDocs ? 'rotate(180deg)' : 'rotate(0)' const rotateG = active.getStarted ? 'rotate(180deg)' : 'rotate(0)' const rotateR = active.getReference ? 'rotate(180deg)' : 'rotate(0)' @@ -310,6 +326,23 @@ export const DocsNav = () => { + {/* Resources */} +
+
+
+ eye icon + +
+ + +
+
+ +
+
) diff --git a/pages/resources/[slug].page.tsx b/pages/resources/[slug].page.tsx new file mode 100644 index 000000000..649f3bd1b --- /dev/null +++ b/pages/resources/[slug].page.tsx @@ -0,0 +1,27 @@ +import React from 'react' +import Head from 'next/head' +import StyledMarkdown from '~/components/StyledMarkdown' +import { getLayout } from '~/components/Sidebar' +import getStaticMarkdownPaths from '~/lib/getStaticMarkdownPaths' +import getStaticMarkdownProps from '~/lib/getStaticMarkdownProps' +import { Headline1 } from '~/components/Headlines' +import { SectionContext } from '~/context' +import { Remember } from '~/components/Remember' + +export async function getStaticPaths() { return getStaticMarkdownPaths('pages/resources') } +export async function getStaticProps(args: any) { return getStaticMarkdownProps(args, 'pages/resources') } + +export default function StaticMarkdownPage ({ frontmatter, content }: { frontmatter: any, content: any }) { + const newTitle = 'JSON Schema - ' + frontmatter.title + return ( + + + {newTitle} + + {frontmatter.title} + + + + ) +} +StaticMarkdownPage.getLayout = getLayout \ No newline at end of file diff --git a/pages/resources/_index.md b/pages/resources/_index.md new file mode 100644 index 000000000..fd3225214 --- /dev/null +++ b/pages/resources/_index.md @@ -0,0 +1,17 @@ +--- +title: "Resources" +section: docs +--- + +Resources +========================= + +Welcome to the **Resources** section! A curated list of the JSON Schema resources available out there 🌐. + +What you'll find in this section? +* Articles +* Books +* Courses +* Videos +* Podcasts +* Papers \ No newline at end of file diff --git a/pages/resources/index.page.tsx b/pages/resources/index.page.tsx new file mode 100644 index 000000000..68e55a733 --- /dev/null +++ b/pages/resources/index.page.tsx @@ -0,0 +1,27 @@ +import React from 'react' +import { getLayout } from '~/components/Sidebar' +import fs from 'fs' +import matter from 'gray-matter' +import StyledMarkdown from '~/components/StyledMarkdown' +import { Remember } from '~/components/Remember' +import { SectionContext } from '~/context' + +export async function getStaticProps() { + const block1 = fs.readFileSync('pages/resources/_index.md', 'utf-8') + const { content: block1Content } = matter(block1) + return { + props: { + blocks: [block1Content] + } + } +} + +export default function ContentExample ({ blocks }: { blocks: any[] }) { + return ( + + + + + ) +} +ContentExample.getLayout = getLayout \ No newline at end of file diff --git a/public/icons/settings.svg b/public/icons/settings.svg new file mode 100644 index 000000000..c86dabec9 --- /dev/null +++ b/public/icons/settings.svg @@ -0,0 +1,11 @@ + + + + + + + + + + +