{"version":3,"file":"component---src-templates-category-template-js-fcc1bddc313f40615bea.js","mappings":"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","sources":["webpack://sahansera-dev-blog/./src/components/Article/Headline.js","webpack://sahansera-dev-blog/./src/components/Article/Article.js","webpack://sahansera-dev-blog/./src/components/List/List.js","webpack://sahansera-dev-blog/./src/templates/CategoryTemplate.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nconst Headline = props => {\n  const { title, children, theme } = props;\n\n  return (\n    <React.Fragment>\n      {title ? <h1>{title}</h1> : <h1>{children}</h1>}\n\n      {/* --- STYLES --- */}\n      <style jsx>{`\n        h1 {\n          font-size: ${theme.font.size.xxl};\n          margin: ${theme.space.stack.l};\n          animation-name: headlineEntry;\n          animation-duration: ${theme.time.duration.long};\n\n          :global(span) {\n            font-weight: ${theme.font.weight.standard};\n            display: block;\n            font-size: 0.5em;\n            letter-spacing: 0;\n            margin: ${theme.space.stack.xs};\n          }\n\n          :global(svg) {\n            height: 0.75em;\n            fill: ${theme.color.brand.primary};\n          }\n        }\n\n        @keyframes headlineEntry {\n          from {\n            opacity: 0.5;\n          }\n          to {\n            opacity: 1;\n          }\n        }\n\n        @from-width tablet {\n          h1 {\n            font-size: ${`calc(${theme.font.size.xl} * 1.2)`};\n          }\n        }\n\n        @from-width desktop {\n          h1 {\n            font-size: ${`calc(${theme.font.size.xl} * 1.4)`};\n          }\n        }\n      `}</style>\n    </React.Fragment>\n  );\n};\n\nHeadline.propTypes = {\n  title: PropTypes.string,\n  children: PropTypes.node,\n  theme: PropTypes.object.isRequired\n};\n\nexport default Headline;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nconst Article = props => {\n  const { children, theme } = props;\n\n  return (\n    <React.Fragment>\n      <article className=\"article\">{children}</article>\n\n      {/* --- STYLES --- */}\n      <style jsx>{`\n        .article {\n          padding: ${theme.space.inset.default};\n          margin: 0 auto;\n        }\n        @from-width tablet {\n          .article {\n            padding: ${`calc(${theme.space.default}) calc(${theme.space.default} * 2)`};\n            max-width: ${theme.text.maxWidth.tablet};\n          }\n        }\n        @from-width desktop {\n          .article {\n            padding: ${`calc(${theme.space.default} * 2 + 90px) 0 calc(${theme.space.default} * 2)`};\n            max-width: ${theme.text.maxWidth.desktop};\n          }\n        }\n      `}</style>\n    </React.Fragment>\n  );\n};\n\nArticle.propTypes = {\n  children: PropTypes.node.isRequired,\n  theme: PropTypes.object.isRequired\n};\n\nexport default Article;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Link } from \"gatsby\";\n\nconst List = props => {\n  const { edges, theme } = props;\n\n  return (\n    <React.Fragment>\n      <ul>\n        {edges.map(edge => {\n          const {\n            node: {\n              frontmatter: { title },\n              fields: { slug }\n            }\n          } = edge;\n\n          return (\n            <li key={slug}>\n              <Link to={slug}>{title}</Link>\n            </li>\n          );\n        })}\n      </ul>\n\n      {/* --- STYLES --- */}\n      <style jsx>{`\n        ul {\n          margin: ${theme.space.stack.m};\n          padding: ${theme.space.m};\n          list-style: circle;\n        }\n        li {\n          padding: ${theme.space.xs} 0;\n          font-size: ${theme.font.size.s};\n          line-height: ${theme.font.lineHeight.l};\n        }\n      `}</style>\n    </React.Fragment>\n  );\n};\n\nList.propTypes = {\n  edges: PropTypes.array.isRequired,\n  theme: PropTypes.object.isRequired\n};\n\nexport default List;\n","import { FaTag } from \"react-icons/fa/\";\nimport PropTypes from \"prop-types\";\nimport React from \"react\";\nimport { graphql } from \"gatsby\";\nimport Seo from \"../components/Seo\";\nimport { ThemeContext } from \"../layouts\";\nimport Article from \"../components/Article\";\nimport Headline from \"../components/Article/Headline\";\nimport List from \"../components/List\";\n\nconst CategoryTemplate = props => {\n  const {\n    pageContext: { category },\n    data: {\n      allMarkdownRemark: { totalCount, edges },\n      site: {\n        siteMetadata: { facebook }\n      }\n    }\n  } = props;\n\n  return (\n    <React.Fragment>\n      <ThemeContext.Consumer>\n        {theme => (\n          <Article theme={theme}>\n            <header>\n              <Headline theme={theme}>\n                <span>Posts in category</span> <FaTag />\n                {category}\n              </Headline>\n              <p className=\"meta\">\n                There {totalCount > 1 ? \"are\" : \"is\"} <strong>{totalCount}</strong> post\n                {totalCount > 1 ? \"s\" : \"\"} in the category.\n              </p>\n              <List edges={edges} theme={theme} />\n            </header>\n          </Article>\n        )}\n      </ThemeContext.Consumer>\n\n      <Seo />\n    </React.Fragment>\n  );\n};\n\nCategoryTemplate.propTypes = {\n  data: PropTypes.object.isRequired,\n  pageContext: PropTypes.object.isRequired\n};\n\nexport default CategoryTemplate;\n\n// eslint-disable-next-line no-undef\nexport const categoryQuery = graphql`\n  query PostsByCategory($category: String) {\n    allMarkdownRemark(\n      limit: 1000\n      sort: { fields: [fields___prefix], order: DESC }\n      filter: { frontmatter: { category: { eq: $category } } }\n    ) {\n      totalCount\n      edges {\n        node {\n          fields {\n            slug\n          }\n          excerpt\n          timeToRead\n          frontmatter {\n            title\n            category\n          }\n        }\n      }\n    }\n    site {\n      siteMetadata {\n        facebook {\n          appId\n        }\n      }\n    }\n  }\n`;\n"],"names":["props","title","children","theme","font","size","xxl","space","stack","l","time","duration","long","weight","standard","xs","color","brand","primary","xl","inset","default","text","maxWidth","tablet","desktop","edges","m","s","lineHeight","map","edge","node","frontmatter","slug","fields","key","Link","to","category","pageContext","data","allMarkdownRemark","totalCount","site","siteMetadata","facebook","ThemeContext","className"],"sourceRoot":""}