/**
 * Layout component that queries for data
 * with Gatsby's StaticQuery component
 *
 * See: https://www.gatsbyjs.org/docs/static-query/
 */ import React from 'react' ; import { StaticQuery , graphql } from 'gatsby' ; import Typography from '@material-ui/core/Typography' ; import CssBaseline from '@material-ui/core/CssBaseline' ; import Header from '../Header' ; const Layout = ( { children } ) => ( < StaticQuery query = { graphql `
      query SiteTitleQuery {
        site {
          siteMetadata {
            title
          }
        }
      }
    ` } render = { data => ( < > < CssBaseline /> < Header siteTitle = { data . site . siteMetadata . title } / > < div style = { { margin : `0 auto` , maxWidth : 960 , padding : `0px 1.0875rem 1.45rem` , paddingTop : 0 } } > < main > < Typography component = "div" > { children } < /Typography> < /main> < /div> < />)}/ > ) ; export default Layout ;