text: import React from 'react'
  
  import Layout from '../components/Layout'
  import BlogRoll from '../components/BlogRoll'
  import PropTypes from 'prop-types'
  
  const PressPage = ({ data }) => {
    const { frontmatter } = data.markdownRemark
    const { image, title} = frontmatter
  
    return (
        <Layout>
          <div
            className="full-width-image-container margin-top-0"
            style={{
              backgroundImage: `url(${
                !!image.childImageSharp ? image.childImageSharp.fluid.src : image
              })`,
            }}
          >
            <h1
              className="has-text-weight-bold is-size-1"
              style={{
                color: 'white',
                padding: '1rem',
              }}
            >
              {title}
            </h1>
          </div>
          <section className="section">
            <div className="container">
              <div className="content">
                <BlogRoll />
              </div>
            </div>
          </section>
        </Layout>
    )
  }
  
  PressPage.propTypes = {
    data: PropTypes.shape({
      markdownRemark: PropTypes.shape({
        frontmatter: PropTypes.object,
      }),
    }),
  }
  
  export default PressPage
  
  export const pressPageQuery = graphql`
    query PressPage($id: String!) {
      markdownRemark(id: { eq: $id }) {
        frontmatter {
          title
          image {
            childImageSharp {
              fluid(maxWidth: 2048, quality: 100) {
                ...GatsbyImageSharpFluid
              }
            }
          }
        }
      }
    }
  `
  