{"version":3,"sources":["webpack://gatsby-casper/./src/templates/features.tsx"],"names":["PostFull","NoImage","PostFullHeader","PostFullTitle","setLightness","colors","data","className","mode","id","css","SiteMain","outer","inner","to","style","backgroundColor","borderRadius","padding","margin","textAlign","width","height","display","alignItems","justifyContent","src","markdownRemark","frontmatter","image","publicURL","maxWidth","maxHeight","color","title","ast","htmlAst","href","docs"],"mappings":"+XAuDA,MAuEaA,EAAW,CAAH,sDAKRC,EAAU,CAAH,6HAWPC,GAAiB,iBAAH,oBAAG,CAAH,2SAqBdC,GAAgB,aAAH,oBAAG,CAAH,2BAEfC,QAAa,OAAQC,cAFN,kEAgE1B,UA5KwB,EAAGC,WAEvB,QAAC,IAAD,CAAaC,UAAU,kBACrB,QAAC,IAAD,MACE,QAAC,KAAD,CAAsBC,KAAK,YAC3B,gBAAMC,GAAG,YAAYF,UAAU,YAAYG,IAAG,CAAGC,KAAUC,KAAb,SAC5C,eAAKF,IAAKG,OACR,oBACE,QAAC,KAAD,CAAMC,GAAG,aAAT,uBAEF,eACEC,MAAO,CACLC,gBAAiB,OACjBC,aAAc,GACdC,QAAS,GACTC,OAAQ,OACRC,UAAW,SACXC,MAAO,IACPC,OAAQ,IACRC,QAAS,OACTC,WAAY,SACZC,eAAgB,YAGlB,eACEC,IAAKpB,EAAKqB,eAAeC,YAAYC,MAAMC,UAC3Cf,MAAO,CACLQ,QAAS,eACTQ,SAAU,IACVC,UAAW,SAIjB,cACEjB,MAAO,CACLkB,MAAO3B,EAAKqB,eAAeC,YAAYK,MACvCb,UAAW,WAGZd,EAAKqB,eAAeC,YAAYM,QAEnC,QAAC,KAAD,CAAK3B,UAAU,eAAe4B,IAAK7B,EAAKqB,eAAeS,WAEvD,yBACQ,KACN,aAAGC,KAAM/B,EAAKqB,eAAeC,YAAYU,MAAzC,qBACqBhC,EAAKqB,eAAeC,YAAYM,OAChD,IAJP,2BAQA,8CAC6B,KAC3B,aAAGG,KAAM/B,EAAKqB,eAAeC,YAAYU,MAAzC,mBAGF,4BACW,KACT,aAAGD,KAAK,qCAAR,uBACuB/B,EAAKqB,eAAeC,YAAYM,WAM7D,QAAC,IAAD","file":"component---src-templates-features-tsx-55a84e971d99addcd1f1.js","sourcesContent":["import { graphql, Link } from \"gatsby\";\nimport * as _ from \"lodash\";\nimport { setLightness } from \"polished\";\nimport React from \"react\";\n\nimport { css } from \"@emotion/react\";\nimport styled from \"@emotion/styled\";\n\nimport { Footer } from \"../components/Footer\";\nimport { Wrapper } from \"../components/Wrapper\";\nimport IndexLayout from \"../layouts\";\nimport { colors } from \"../styles/colors\";\nimport { SiteMain } from \"../styles/shared\";\nimport { Ast } from \"../components/PostContent\";\nimport {\n  inner,\n  outer,\n  TransitionNavigation,\n} from \"../components/header/SiteNav\";\n\nexport interface Author {\n  id: string;\n  bio: string;\n  avatar: {\n    children: any[];\n  };\n}\n\ninterface PageTemplateProps {\n  data: any;\n  pageContext: PageContext;\n  location: Location;\n}\n\nexport interface PageContext {\n  excerpt: string;\n  timeToRead: number;\n  fields: {\n    slug: string;\n  };\n  frontmatter: {\n    image: {\n      childImageSharp: {\n        fluid: any;\n      };\n    };\n    excerpt: string;\n    title: string;\n    date: string;\n    draft?: boolean;\n    tags: string[];\n    author: Author[];\n  };\n}\n\nconst FeatureTemplate = ({ data }: PageTemplateProps) => {\n  return (\n    <IndexLayout className=\"post-template\">\n      <Wrapper>\n        <TransitionNavigation mode=\"normal\" />\n        <main id=\"site-main\" className=\"site-main\" css={[SiteMain, outer]}>\n          <div css={inner}>\n            <div>\n              <Link to=\"/features\">View all Features</Link>\n            </div>\n            <div\n              style={{\n                backgroundColor: \"#fff\",\n                borderRadius: 25,\n                padding: 25,\n                margin: \"auto\",\n                textAlign: \"center\",\n                width: 250,\n                height: 250,\n                display: \"flex\",\n                alignItems: \"center\",\n                justifyContent: \"center\",\n              }}\n            >\n              <img\n                src={data.markdownRemark.frontmatter.image.publicURL}\n                style={{\n                  display: \"inline-block\",\n                  maxWidth: 200,\n                  maxHeight: 200,\n                }}\n              />\n            </div>\n            <h1\n              style={{\n                color: data.markdownRemark.frontmatter.color,\n                textAlign: \"center\",\n              }}\n            >\n              {data.markdownRemark.frontmatter.title}\n            </h1>\n            <Ast className=\"post-content\" ast={data.markdownRemark.htmlAst} />\n\n            <p>\n              Learn{\" \"}\n              <a href={data.markdownRemark.frontmatter.docs}>\n                How to connect to {data.markdownRemark.frontmatter.title}\n              </a>{\" \"}\n              in just a few minutes.\n            </p>\n\n            <p>\n              Looking for code examples?{\" \"}\n              <a href={data.markdownRemark.frontmatter.docs}>Read the docs</a>\n            </p>\n\n            <p>\n              Ready to{\" \"}\n              <a href=\"http://app.adnerf.com/user/signup\">\n                start building with {data.markdownRemark.frontmatter.title}\n              </a>\n            </p>\n          </div>\n        </main>\n\n        <Footer />\n      </Wrapper>\n    </IndexLayout>\n  );\n};\n\nexport const PostFull = css`\n  position: relative;\n  z-index: 50;\n`;\n\nexport const NoImage = css`\n  .post-full-content {\n    padding-top: 0;\n  }\n\n  .post-full-content:before,\n  .post-full-content:after {\n    display: none;\n  }\n`;\n\nexport const PostFullHeader = styled.header`\n  position: relative;\n  margin: 0 auto;\n  padding: 70px 170px 50px;\n  border-top-left-radius: 3px;\n  border-top-right-radius: 3px;\n\n  @media (max-width: 1170px) {\n    padding: 60px 11vw 50px;\n  }\n\n  @media (max-width: 800px) {\n    padding-right: 5vw;\n    padding-left: 5vw;\n  }\n\n  @media (max-width: 500px) {\n    padding: 20px 0 35px;\n  }\n`;\n\nexport const PostFullTitle = styled.h1`\n  margin: 0 0 0.2em;\n  color: ${setLightness(\"0.05\", colors.darkgrey)};\n  @media (max-width: 500px) {\n    margin-top: 0.2em;\n    font-size: 3.3rem;\n  }\n`;\n\nexport const query = graphql`\n  query($slug: String, $primaryTag: String) {\n    markdownRemark(fields: { slug: { eq: $slug } }) {\n      html\n      htmlAst\n      excerpt\n      timeToRead\n      frontmatter {\n        title\n        userDate: date(formatString: \"D MMMM YYYY\")\n        date\n        tags\n        excerpt\n        color\n        docs\n        image {\n          publicURL\n        }\n        author {\n          id\n          bio\n          avatar {\n            childImageSharp {\n              gatsbyImageData(width: 200)\n            }\n          }\n        }\n      }\n    }\n    relatedPosts: allMarkdownRemark(\n      filter: {\n        frontmatter: { tags: { in: [$primaryTag] }, draft: { ne: true } }\n      }\n      limit: 5\n      sort: { fields: [frontmatter___date], order: DESC }\n    ) {\n      totalCount\n      edges {\n        node {\n          id\n          timeToRead\n          excerpt\n          frontmatter {\n            title\n            date\n          }\n          fields {\n            slug\n          }\n        }\n      }\n    }\n  }\n`;\n\nexport default FeatureTemplate;\n"],"sourceRoot":""}