component---src-templates-tag-js-7ca96b5087dd996ca5fd.js.map

{"version":3,"sources":["webpack:///./src/templates/tag.js"],"names":["colors","theme","fontSizes","StyledTagsContainer","styled","Main","mixins","inlineLink","flexBetween","lg","lightSlate","slate","sm","TagTemplate","pageContext","data","location","tag","edges","allMarkdownRemark","className","to","map","node","frontmatter","title","slug","date","tags","key","Date","toLocaleDateString","year","month","day","length","i","kebabCase","pageQuery"],"mappings":"2FAAA,+IAOQA,EAAsBC,IAAtBD,OAAQE,EAAcD,IAAdC,UAEVC,EAAsBC,YAAOC,KAAV,2EAAGD,CAAH,uNAInBE,IAAOC,WAIPD,IAAOE,YAIMN,EAAUO,GAYVT,EAAOU,WAITV,EAAOW,MACHT,EAAUU,IA+DhBC,UArDK,SAAC,GAAqC,IAAnCC,EAAkC,EAAlCA,YAAaC,EAAqB,EAArBA,KAAMC,EAAe,EAAfA,SAChCC,EAAQH,EAARG,IACAC,EAAUH,EAAKI,kBAAfD,MAER,OACE,kBAAC,IAAD,CAAQF,SAAUA,GAChB,kBAACb,EAAD,KACE,0BAAMiB,UAAU,cACd,0BAAMA,UAAU,SAAhB,KACA,kBAAC,OAAD,CAAMC,GAAG,aAAT,iBAGF,4BACE,kCAAQJ,GACR,8BACE,kBAAC,OAAD,CAAMI,GAAG,kBAAT,mBAIJ,wBAAID,UAAU,cACXF,EAAMI,KAAI,YAAe,IAAD,IAAXC,KAC6BC,YAAjCC,EADe,EACfA,MAAOC,EADQ,EACRA,KAAMC,EADE,EACFA,KAAMC,EADJ,EACIA,KAC3B,OACE,wBAAIC,IAAKH,GACP,4BACE,kBAAC,OAAD,CAAML,GAAIK,GAAOD,IAEnB,uBAAGL,UAAU,YACX,8BACG,IAAIU,KAAKH,GAAMI,mBAAmB,QAAS,CAC1CC,KAAM,UACNC,MAAO,OACPC,IAAK,aAGT,qCACCN,GACCA,EAAKO,OAAS,GACdP,EAAKN,KAAI,SAACL,EAAKmB,GAAN,OACP,kBAAC,OAAD,CAAMP,IAAKO,EAAGf,GAAE,kBAAoBgB,IAAUpB,GAA9B,IAAuCG,UAAU,OAAjE,IACIH,eAoCnB,IAAMqB,EAAS","file":"component---src-templates-tag-js-7ca96b5087dd996ca5fd.js","sourcesContent":["import React from 'react';\nimport { Link, graphql } from 'gatsby';\nimport kebabCase from 'lodash/kebabCase';\nimport PropTypes from 'prop-types';\nimport { Layout } from '@components';\nimport styled from 'styled-components';\nimport { theme, mixins, Main } from '@styles';\nconst { colors, fontSizes } = theme;\n\nconst StyledTagsContainer = styled(Main)`\n  max-width: 1000px;\n\n  a {\n    ${mixins.inlineLink};\n  }\n\n  h1 {\n    ${mixins.flexBetween};\n    margin-bottom: 50px;\n\n    a {\n      font-size: ${fontSizes.lg};\n      font-weight: 400;\n    }\n  }\n\n  ul {\n    li {\n      font-size: 24px;\n      h2 {\n        font-size: inherit;\n        margin: 0;\n        a {\n          color: ${colors.lightSlate};\n        }\n      }\n      .subtitle {\n        color: ${colors.slate};\n        font-size: ${fontSizes.sm};\n\n        .tag {\n          margin-right: 10px;\n        }\n      }\n    }\n  }\n`;\n\nconst TagTemplate = ({ pageContext, data, location }) => {\n  const { tag } = pageContext;\n  const { edges } = data.allMarkdownRemark;\n\n  return (\n    <Layout location={location}>\n      <StyledTagsContainer>\n        <span className=\"breadcrumb\">\n          <span className=\"arrow\">&larr;</span>\n          <Link to=\"/pensieve\">All memories</Link>\n        </span>\n\n        <h1>\n          <span>#{tag}</span>\n          <span>\n            <Link to=\"/pensieve/tags\">View all tags</Link>\n          </span>\n        </h1>\n\n        <ul className=\"fancy-list\">\n          {edges.map(({ node }) => {\n            const { title, slug, date, tags } = node.frontmatter;\n            return (\n              <li key={slug}>\n                <h2>\n                  <Link to={slug}>{title}</Link>\n                </h2>\n                <p className=\"subtitle\">\n                  <time>\n                    {new Date(date).toLocaleDateString('en-US', {\n                      year: 'numeric',\n                      month: 'long',\n                      day: 'numeric',\n                    })}\n                  </time>\n                  <span>&nbsp;&mdash;&nbsp;</span>\n                  {tags &&\n                    tags.length > 0 &&\n                    tags.map((tag, i) => (\n                      <Link key={i} to={`/pensieve/tags/${kebabCase(tag)}/`} className=\"tag\">\n                        #{tag}\n                      </Link>\n                    ))}\n                </p>\n              </li>\n            );\n          })}\n        </ul>\n      </StyledTagsContainer>\n    </Layout>\n  );\n};\n\nexport default TagTemplate;\n\nTagTemplate.propTypes = {\n  pageContext: PropTypes.shape({\n    tag: PropTypes.string.isRequired,\n  }),\n  data: PropTypes.shape({\n    allMarkdownRemark: PropTypes.shape({\n      totalCount: PropTypes.number.isRequired,\n      edges: PropTypes.arrayOf(\n        PropTypes.shape({\n          node: PropTypes.shape({\n            frontmatter: PropTypes.shape({\n              title: PropTypes.string.isRequired,\n            }),\n          }),\n        }).isRequired,\n      ),\n    }),\n  }),\n  location: PropTypes.object,\n};\n\nexport const pageQuery = graphql`\n  query($tag: String!) {\n    allMarkdownRemark(\n      limit: 2000\n      sort: { fields: [frontmatter___date], order: DESC }\n      filter: { frontmatter: { tags: { in: [$tag] } } }\n    ) {\n      totalCount\n      edges {\n        node {\n          frontmatter {\n            title\n            description\n            date\n            slug\n            tags\n          }\n        }\n      }\n    }\n  }\n`;\n"],"sourceRoot":""}