homepage/src/templates/siteTemplate.js

62 lines
1.4 KiB
JavaScript
Raw Normal View History

import React from 'react'
import { graphql } from 'gatsby'
import Layout from '../components/layout'
import { MDXRenderer } from 'gatsby-plugin-mdx'
import { MDXProvider } from '@mdx-js/react'
import { Helmet } from 'react-helmet'
2019-12-12 21:27:56 +00:00
2019-12-14 16:10:54 +00:00
const ide =
2020-08-03 00:53:01 +00:00
'https://repos.ctdo.de/neri/ctdo-homepage/_edit/master/src/webpages/'
2019-12-14 16:10:54 +00:00
const MdLeakH1 = (props) => <h2 {...props}># {props.children}</h2>
const MdLeakH2 = (props) => <h3 {...props}>## {props.children}</h3>
const MdLeakH3 = (props) => <h4 {...props}>### {props.children}</h4>
const MdLeakH4 = (props) => <h5 {...props}>#### {props.children}</h5>
2019-12-17 21:54:47 +00:00
const components = {
h1: MdLeakH1,
h2: MdLeakH2,
h3: MdLeakH3,
h4: MdLeakH4,
}
2019-12-12 21:27:56 +00:00
export default function Template({
data, // this prop will be injected by the GraphQL query below.
}) {
const {
frontmatter: { title, edit, path },
body,
} = data.mdx
2019-12-12 21:27:56 +00:00
const editLink = edit ? ide + edit : null
2019-12-14 16:10:54 +00:00
2019-12-12 21:27:56 +00:00
return (
<>
<Helmet
htmlAttributes={{
lang: 'de',
}}
title={`ctdo - ${title.toLowerCase()}`}
/>
<Layout path={path} editLink={editLink}>
<MDXProvider components={components}>
<MDXRenderer>{body}</MDXRenderer>
</MDXProvider>
</Layout>
</>
2019-12-12 21:27:56 +00:00
)
}
export const pageQuery = graphql`
query ($path: String!) {
2019-12-12 23:03:04 +00:00
mdx(frontmatter: { path: { eq: $path } }) {
body
2019-12-12 21:27:56 +00:00
frontmatter {
title
2020-01-22 12:33:25 +00:00
edit
path
2019-12-12 21:27:56 +00:00
}
}
}
`