{"version":3,"sources":["webpack:///./src/pages/blog.tsx"],"names":["BlogIndexPostContainer","styled","a","rhythm","BlogIndexPage","posts","data","allMarkdownRemark","edges","title","map","node","frontmatter","fields","slug","content","description","excerpt","href","key","data-sal","data-sal-delay","data-sal-easing","date","dangerouslySetInnerHTML","__html","pageQuery"],"mappings":"6FACA,kGAQMA,EARN,UAQ+BC,EAAOC,EAAV,+EAAGD,CAAH,4QAGTE,YAAO,GACbA,YAAO,GACDA,YAAO,EAAI,GACVA,YAAO,EAAI,GASVA,YAAO,EAAI,IA0CjBC,UAhC4C,SAAC,GAAa,IACjEC,EADiE,EAAXC,KACzCC,kBAAkBC,MAErC,OACE,kBAAC,IAAD,CAAYC,MAAM,aACfJ,EAAMK,KAAI,YAAc,IAAXC,EAAW,EAAXA,KACNF,EAAQE,EAAKC,YAAYH,OAASE,EAAKE,OAAOC,KAC9CC,EAAUJ,EAAKC,YAAYI,aAAeL,EAAKM,QACrD,OACE,kBAACjB,EAAD,CACEkB,KAAMP,EAAKE,OAAOC,KAClBK,IAAKR,EAAKE,OAAOC,KACjBM,WAAS,WACTC,iBAAe,IACfC,kBAAgB,QAEhB,iCACE,gCACE,4BAAKb,GACL,+BAAQE,EAAKC,YAAYW,OAE3B,iCACE,uBAAGC,wBAAyB,CAAEC,OAAQV,aAY/C,IAAMW,EAAY","file":"component---src-pages-blog-tsx-3aa861af105e2faf9945.js","sourcesContent":["import { PageProps, graphql } from 'gatsby';\nimport React from 'react';\n\nimport BaseLayout from '../layouts/base';\nimport { rhythm } from '../utils/typography';\n\nimport { BlogIndexQuery } from '../../types/graphql-types';\nimport styled from 'styled-components';\n\nconst BlogIndexPostContainer = styled.a`\n  display: block;\n  margin: auto;\n  margin-bottom: ${rhythm(1)};\n  padding: ${rhythm(1)};\n  border-radius: ${rhythm(1 / 4)};\n  box-shadow: 0 0 ${rhythm(1 / 4)} rgba(0, 0, 0, 0.2);\n  transition: 0.3s;\n\n  text-decoration: none;\n  &:hover {\n    transform: scale(1.02);\n    color: unset;\n  }\n  header {\n    margin-bottom: ${rhythm(1 / 4)};\n  }\n  p {\n    margin-bottom: 0;\n  }\n  header > h3 {\n    margin-bottom: 0;\n  }\n`;\n\nconst BlogIndexPage: React.FC<PageProps<BlogIndexQuery>> = ({ data }) => {\n  const posts = data.allMarkdownRemark.edges;\n\n  return (\n    <BaseLayout title=\"All posts\">\n      {posts.map(({ node }) => {\n        const title = node.frontmatter.title || node.fields.slug;\n        const content = node.frontmatter.description || node.excerpt;\n        return (\n          <BlogIndexPostContainer\n            href={node.fields.slug}\n            key={node.fields.slug}\n            data-sal=\"slide-up\"\n            data-sal-delay=\"0\"\n            data-sal-easing=\"ease\"\n          >\n            <article>\n              <header>\n                <h3>{title}</h3>\n                <small>{node.frontmatter.date}</small>\n              </header>\n              <section>\n                <p dangerouslySetInnerHTML={{ __html: content }} />\n              </section>\n            </article>\n          </BlogIndexPostContainer>\n        );\n      })}\n    </BaseLayout>\n  );\n};\n\nexport default BlogIndexPage;\n\nexport const pageQuery = graphql`\n  query BlogIndex {\n    allMarkdownRemark(sort: { fields: [frontmatter___date], order: DESC }) {\n      edges {\n        node {\n          excerpt\n          fields {\n            slug\n          }\n          frontmatter {\n            date(formatString: \"MMMM DD, YYYY\")\n            title\n            description\n          }\n        }\n      }\n    }\n  }\n`;\n"],"sourceRoot":""}