78 lines
2.0 KiB
JavaScript
78 lines
2.0 KiB
JavaScript
|
import React, { Fragment } from 'react';
|
||
|
|
import Helmet from 'react-helmet';
|
||
|
|
import classnames from 'classnames';
|
||
|
|
import { graphql, StaticQuery } from 'gatsby';
|
||
|
|
|
||
|
|
import Header from './header';
|
||
|
|
import Footer from './footer';
|
||
|
|
|
||
|
|
import '../css/imports/base.css';
|
||
|
|
import '../css/imports/utilities.css';
|
||
|
|
import '../css/imports/gitter.css';
|
||
|
|
|
||
|
|
const Layout = ({ children }) => {
|
||
|
|
return (
|
||
|
|
<StaticQuery
|
||
|
|
query={graphql`
|
||
|
|
query layoutQuery {
|
||
|
|
site {
|
||
|
|
siteMetadata {
|
||
|
|
title
|
||
|
|
description
|
||
|
|
}
|
||
|
|
}
|
||
|
|
footer: file(relativePath: { regex: "/global/" }) {
|
||
|
|
childDataYaml {
|
||
|
|
footer {
|
||
|
|
buttons {
|
||
|
|
url
|
||
|
|
name
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
notifs: file(relativePath: { regex: "/notifications/" }) {
|
||
|
|
childDataYaml {
|
||
|
|
notifications {
|
||
|
|
published
|
||
|
|
loud
|
||
|
|
message
|
||
|
|
url
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
`}
|
||
|
|
>
|
||
|
|
{data => {
|
||
|
|
const { title, description } = data.site.siteMetadata;
|
||
|
|
const notifs = data.notifs.childDataYaml.notifications.filter(notif => notif.published);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Fragment>
|
||
|
|
<Helmet defaultTitle={title} titleTemplate={`%s | ${title}`}>
|
||
|
|
<meta name="description" content={description} />
|
||
|
|
</Helmet>
|
||
|
|
{notifs.map((node, i) => (
|
||
|
|
<a
|
||
|
|
key={i}
|
||
|
|
href={node.url}
|
||
|
|
className={classnames('notification', {
|
||
|
|
'notification-loud': node.loud,
|
||
|
|
})}
|
||
|
|
>
|
||
|
|
{node.message}
|
||
|
|
</a>
|
||
|
|
))}
|
||
|
|
<Header notifications={notifs} />
|
||
|
|
{children}
|
||
|
|
<Footer buttons={data.footer.childDataYaml.footer.buttons} />
|
||
|
|
</Fragment>
|
||
|
|
);
|
||
|
|
}}
|
||
|
|
</StaticQuery>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Layout;
|