Update layout to include conf graphics

Signed-off-by: Brian Warner <[email protected]>

Author: brianwarner

src/components/ConfLayout/index.tsx

@@ -0,0 +1,48 @@
+import React from "react"
+import { Link } from "gatsby"
+import DocsSidebar from "../DocsSidebar"
+import Marked from '../Marked'
+
+interface Props {
+  title: string
+  heroText: string
+  nextDoc: any
+  permalink: string
+  sideBarData: any
+  rawMarkdownBody: string
+  pageContext: any
+}
+
+const Index = ({ title, heroText, nextDoc, sideBarData, rawMarkdownBody, pageContext }: Props) => {
+  return (
+    <section>
+      <div className="foundation conf">
+        <div className="foundation-hero">
+          <div className="foundation-hero-inner-content">
+              <img src="/img/graphql_conf-details-white.svg" alt="GraphQL Foundation logo" />
+              <div>{heroText}</div>
+          </div>
+        </div>
+        <div className="documentationContent">
+          <div className="inner-content">
+            <h1>{title}</h1>
+            <Marked pageContext={pageContext}>{rawMarkdownBody}</Marked>
+            {nextDoc?.frontmatter?.permalink && (
+              <Link className="read-next" to={nextDoc.frontmatter.permalink}>
+                <span className="read-next-continue">
+                  Continue Reading &rarr;
+                </span>
+                <span className="read-next-title">
+                  {nextDoc.frontmatter.title}
+                </span>
+              </Link>
+            )}
+          </div>
+          <DocsSidebar sideBarData={sideBarData} />
+        </div>
+      </div>
+    </section>
+  )
+}
+
+export default Index

src/content/foundation/GraphQLConf.md

@@ -2,7 +2,7 @@
 title: GraphQL Conf 2022
 sidebarTitle: GraphQL Conf
 heroText: The GraphQL Foundation-hosted event for spec and implementation contributors!
-layout: foundation
+layout: conf
 category: GraphQL Foundation
 permalink: /foundation/graphql-conf/
 next: /foundation/community-grant/

src/templates/doc.tsx

@@ -7,13 +7,15 @@ import FoundationLayout from "../components/FoundationLayout"
 import BlogLayout from "../components/BlogLayout"
 import CodeLayout from "../components/CodeLayout"
 import FAQLayout from "../components/FAQLayout"
+import ConfLayout from "../components/ConfLayout"
 
 const layoutMap: Record<string, React.ComponentType<any>> = {
   docs: DocsLayout,
   foundation: FoundationLayout,
   blog: BlogLayout,
   code: CodeLayout,
   faq: FAQLayout,
+  conf: ConfLayout,
 }
 
 const Blog = ({ data, pageContext }: PageProps<GatsbyTypes.DocTemplateQuery, GatsbyTypes.SitePageContext>) => {