{"version":3,"sources":["webpack://gatsby-tailwind/./src/components/blog/BlogPostList.jsx","webpack://gatsby-tailwind/./src/pages/blog.jsx","webpack://gatsby-tailwind/./src/util/slugify.js"],"names":["blogposts","className","map","frontmatter","Link","key","slug","to","slugify","G","image","titleImage","sharp","gatsbyImageData","alt","titleImageAlt","title","description","dateTime","date","formattedDate","data","posts","nodes","noMarginBottom","noMarginTop","noMarginSides","module","exports","input","str","trim","toLowerCase","fr","i","l","length","replace","RegExp","charAt"],"mappings":"mPA+CA,EAxCqB,SAAC,GAAD,IAAGA,EAAH,EAAGA,UAAH,OACnB,uBAAKC,UAAU,wCACZD,EAAUE,KAAI,gBAAGC,EAAH,EAAGA,YAAH,OACb,gBAAC,EAAAC,KAAD,CACEC,IAAKF,EAAYG,KACjBC,GAAE,SAAWC,IAAQL,EAAYG,MACjCL,UAAU,qIAEV,uBAAKA,UAAU,gDACb,uBAAKA,UAAU,eACb,gBAAC,EAAAQ,EAAD,CACEC,MAAOP,EAAYQ,WAAWC,MAAMC,gBACpCZ,UAAU,wBACVa,IAAKX,EAAYY,iBAGrB,uBAAKd,UAAU,kCACb,sBAAIA,UAAU,uDACXE,EAAYa,OAEf,qBAAGf,UAAU,4CACVE,EAAYc,aAEf,uBAAKhB,UAAU,qBACb,wBAAMiB,SAAUf,EAAYgB,MACzBhB,EAAYiB,wBCqC7B,EA7BiB,SAAC,GAAc,IACxBpB,EADuB,EAAXqB,KACKC,MAAMC,MAE7B,OACE,gBAAC,IAAD,CAAQC,gBAAc,EAACC,aAAW,EAACC,eAAa,GAC9C,gBAAC,IAAD,CAAKV,MAAM,OAAOC,YAAY,kBAC9B,uBAAKhB,UAAU,yCACb,uBAAKA,UAAU,qDACb,uBAAKA,UAAU,eACb,sBAAIA,UAAU,qFAAd,SAIF,gBAAC,EAAD,CAAcD,UAAWA,S,kBCjCnC2B,EAAOC,QApBP,SAAiBC,GACf,IAAIC,EAAMD,EAEVC,GADAA,EAAMA,EAAIC,QACAC,cAKV,IAFA,IAAMC,EAAK,+BAEFC,EAAI,EAAGC,EAAIF,EAAGG,OAAQF,EAAIC,EAAGD,GAAK,EACzCJ,EAAMA,EAAIO,QAAQ,IAAIC,OAAOL,EAAGM,OAAOL,GAAI,KAFlC,+BAE2CK,OAAOL,IAQ7D,OALAJ,EAAMA,EACHO,QAAQ,eAAgB,IACxBA,QAAQ,OAAQ,KAChBA,QAAQ,MAAO","file":"component---src-pages-blog-jsx-60c36625b9eff404fa4d.js","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from 'gatsby';\nimport { GatsbyImage } from 'gatsby-plugin-image';\n\nimport slugify from '../../util/slugify';\n\nconst BlogPostList = ({ blogposts }) => (\n  <div className=\"mx-4 mt-4 space-y-4 md:mx-8 md:mt-12\">\n    {blogposts.map(({ frontmatter }) => (\n      <Link\n        key={frontmatter.slug}\n        to={`/blog/${slugify(frontmatter.slug)}`}\n        className=\"inline-flex  items-center rounded-md ring ring-slate-100 transition-colors hover:bg-red-100 focus:outline-none focus:ring-red-500\"\n      >\n        <div className=\"flex flex-wrap space-x-3 py-4 md:flex-nowrap\">\n          <div className=\"mx-auto p-2\">\n            <GatsbyImage\n              image={frontmatter.titleImage.sharp.gatsbyImageData}\n              className=\"max-w-[250px] rounded\"\n              alt={frontmatter.titleImageAlt}\n            />\n          </div>\n          <div className=\"flex flex-col p-2 md:flex-grow\">\n            <h2 className=\"title-font mb-2 text-2xl font-medium text-zinc-900 \">\n              {frontmatter.title}\n            </h2>\n            <p className=\"flex-grow leading-relaxed text-zinc-800 \">\n              {frontmatter.description}\n            </p>\n            <div className=\"flex items-center\">\n              <time dateTime={frontmatter.date}>\n                {frontmatter.formattedDate}\n              </time>\n            </div>\n          </div>\n        </div>\n      </Link>\n    ))}\n  </div>\n);\n\nBlogPostList.propTypes = {\n  // eslint-disable-next-line react/forbid-prop-types\n  blogposts: PropTypes.arrayOf(PropTypes.object).isRequired,\n};\n\nexport default BlogPostList;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { graphql } from 'gatsby';\nimport Layout from '../components/layout';\nimport SEO from '../components/seo';\nimport BlogPostList from '../components/blog/BlogPostList';\n\nexport const query = graphql`\n  query {\n    posts: allMdx(\n      sort: { fields: frontmatter___date, order: DESC }\n      filter: { fileAbsolutePath: { glob: \"**/content/blog/**\" } }\n    ) {\n      nodes {\n        frontmatter {\n          title\n          date\n          formattedDate: date(formatString: \"MMMM DD, YYYY\")\n          description\n          slug\n          titleImage {\n            sharp: childImageSharp {\n              gatsbyImageData(\n                width: 250\n                placeholder: BLURRED\n                formats: [AUTO, WEBP, AVIF]\n              )\n            }\n          }\n          titleImageAlt\n          titleImageSource {\n            text\n            href\n          }\n        }\n      }\n    }\n  }\n`;\n\nconst BlogPage = ({ data }) => {\n  const blogposts = data.posts.nodes;\n\n  return (\n    <Layout noMarginBottom noMarginTop noMarginSides>\n      <SEO title=\"Blog\" description=\"LCT Blogposts\" />\n      <div className=\"flex flex-grow flex-col items-center \">\n        <div className=\"w-full max-w-6xl flex-grow bg-white py-12 shadow \">\n          <div className=\"text-center\">\n            <h1 className=\"font-yrsa text-4xl font-extrabold leading-9 sm:leading-10 md:text-5xl lg:text-6xl\">\n              Blog\n            </h1>\n          </div>\n          <BlogPostList blogposts={blogposts} />\n        </div>\n      </div>\n    </Layout>\n  );\n};\n\nBlogPage.propTypes = {\n  data: PropTypes.shape({\n    posts: PropTypes.shape({\n      // eslint-disable-next-line react/forbid-prop-types\n      nodes: PropTypes.arrayOf(PropTypes.object).isRequired,\n    }).isRequired,\n  }).isRequired,\n};\n\nexport default BlogPage;\n","function slugify(input) {\n  let str = input;\n  str = str.trim();\n  str = str.toLowerCase();\n\n  // swap accents\n  const fr = 'àáäâèéëêìíïîòóöôùúüûñç·/_,:;';\n  const to = 'aaaaeeeeiiiioooouuuunc------';\n  for (let i = 0, l = fr.length; i < l; i += 1) {\n    str = str.replace(new RegExp(fr.charAt(i), 'g'), to.charAt(i));\n  }\n\n  str = str\n    .replace(/[^a-z0-9 -]/g, '') // remove invalid chars\n    .replace(/\\s+/g, '-') // collapse whitespace and replace by -\n    .replace(/-+/g, '-'); // collapse dashes\n\n  return str;\n}\n\nmodule.exports = slugify;\n"],"sourceRoot":""}