{"version":3,"sources":["webpack:///./src/components/FeatureImage/styled.ts","webpack:///./src/templates/Page.tsx"],"names":["Img","styled","img","props","theme","content","borderRadius","Box","breakpoints","GatsbyImage","pageQuery","Page","page","data","markdownRemark","fluidHeaderImage","frontmatter","headerImage","childImageSharp","fluid","title","dangerouslySetInnerHTML","__html","html"],"mappings":"8FAAA,mFA+CaA,GA3CeC,UAAOC,IAAV,2EAAGD,CAAH,2JACG,SAAAE,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAC5B,SAAAH,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAYrCL,UAAOC,IAAV,oEAAGD,CAAH,2MACU,SAAAE,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAC5B,SAAAH,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAgBnCL,kBAAOM,OAAV,sEAAGN,CAAH,+GAMG,SAAAE,GAAK,OAAIA,EAAMC,MAAMI,YAAY,MAKrCP,kBAAOQ,KAAV,kEAAGR,CAAH,0HACY,SAAAE,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAC5B,SAAAH,GAAK,OAAIA,EAAMC,MAAMC,QAAQC,gBAGnC,SAAAH,GAAK,OAAIA,EAAMC,MAAMI,YAAY,Q,kCCpDxD,+JASaE,EAAY,YAyBZC,EAAiC,SAAC,GAA8C,YAApBC,EAAoB,EAA5CC,KAAQC,eACjDC,EAAmBH,SAAH,UAAGA,EAAMI,mBAAT,iBAAG,EAAmBC,mBAAtB,iBAAG,EAAgCC,uBAAnC,aAAG,EAAiDC,MAC1E,OACE,kBAAC,WAAD,KACE,kBAAC,IAAD,CAAKC,MAAOR,SAAF,UAAEA,EAAMI,mBAAR,aAAE,EAAmBI,QAC/B,kBAAC,IAAD,KACE,kBAAC,IAAD,KACyB,OAArBL,EAA4B,kBAAC,IAAD,CAAKI,MAAOJ,IAAuB,GACjE,yBAAKM,wBAAyB,CAAEC,OAAQV,aAAF,EAAEA,EAAMW,YAOzCZ","file":"component---src-templates-page-tsx-cf4c444150e388ca8b0a.js","sourcesContent":["import styled from 'styled-components'\nimport { Box } from 'rebass/styled-components'\nimport GatsbyImage from 'gatsby-image'\n\nexport const LoadingImage = styled.img`\n  border-top-left-radius: ${props => props.theme.content.borderRadius};\n  border-top-right-radius: ${props => props.theme.content.borderRadius};\n  height: 100%;\n  width: 100%;\n  transition: 1s all linear;\n  object-fit: fill;\n  z-index: 1;\n\n  &.loaded {\n    opacity: 0;\n  }\n`\n\nexport const Image = styled.img`\n  border-top-left-radius: ${props => props.theme.content.borderRadius};\n  border-top-right-radius: ${props => props.theme.content.borderRadius};\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n  object-fit: fill;\n  transition: 0.2s all ease-in-out;\n  opacity: 0;\n  z-index: 2;\n\n  &.loaded {\n    opacity: 1;\n  }\n`\n\nexport const Wrapper = styled(Box)`\n  overflow: hidden;\n  padding: 0;\n  position: relative;\n  margin: -3rem -6rem 1rem;\n\n  @media (max-width: ${props => props.theme.breakpoints[0]}) {\n    margin: -1rem;\n  }\n`\n\nexport const Img = styled(GatsbyImage)`\n  border-top-left-radius: ${props => props.theme.content.borderRadius};\n  border-top-right-radius: ${props => props.theme.content.borderRadius};\n  margin: -3rem -6rem 1rem;\n\n  @media (max-width: ${props => props.theme.breakpoints[0]}) {\n    margin: -1rem;\n  }\n`\n","import React, { Fragment, FunctionComponent } from 'react'\nimport { graphql } from 'gatsby'\nimport { FluidObject } from 'gatsby-image'\nimport { Img } from '../components/FeatureImage/styled'\nimport Seo from '../components/Seo'\nimport { PageQuery } from '../graphqlTypes'\nimport Layout from '../components/Layout'\nimport ContentBox from '../components/ContentBox'\n\nexport const pageQuery = graphql`\n  query Page($id: String) {\n    markdownRemark(id: {eq: $id}) {\n      id\n      html\n      frontmatter {\n        slug\n        tags\n        title\n        headerImage {\n          childImageSharp {\n            fluid(maxWidth: 800, quality: 90) {\n              ...GatsbyImageSharpFluid_withWebp\n            }\n          }\n        }\n      }\n    }\n  }\n`\n\ninterface Props {\n  data: PageQuery\n}\n\nexport const Page: FunctionComponent<Props> = ({ data: { markdownRemark: page } }: Props) => {\n  const fluidHeaderImage = page?.frontmatter?.headerImage?.childImageSharp?.fluid as FluidObject\n  return (\n    <Fragment>\n      <Seo title={page?.frontmatter?.title}/>\n      <Layout>\n        <ContentBox>\n          { fluidHeaderImage !== null ? <Img fluid={fluidHeaderImage} /> : ''}\n          <div dangerouslySetInnerHTML={{ __html: page?.html as string }} />\n        </ContentBox>\n      </Layout>\n    </Fragment>\n  )\n}\n\nexport default Page\n"],"sourceRoot":""}