{"version":3,"file":"component---src-pages-index-js-7f65a1b37c63b08dd12f.js","mappings":"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","sources":["webpack://portfolio/./src/components/seo.js","webpack://portfolio/./src/components/ProjectCard.js","webpack://portfolio/./src/components/BlogPost.js","webpack://portfolio/./src/pages/index.js"],"sourcesContent":["/**\n * SEO component that queries for data with\n *  Gatsby's useStaticQuery React hook\n *\n * See: https://www.gatsbyjs.com/docs/use-static-query/\n */\n\nimport React from \"react\"\nimport PropTypes from \"prop-types\"\nimport { Helmet } from \"react-helmet\"\nimport { useStaticQuery, graphql } from \"gatsby\"\n\nfunction SEO({ description, lang, meta, title }) {\n  const { site } = useStaticQuery(\n    graphql`\n      query {\n        site {\n          siteMetadata {\n            title\n            description\n            author\n          }\n        }\n      }\n    `\n  )\n\n  const metaDescription = description || site.siteMetadata.description\n  const defaultTitle = site.siteMetadata?.title\n\n  return (\n    <Helmet\n      htmlAttributes={{\n        lang,\n      }}\n      title={title}\n      titleTemplate={defaultTitle ? `%s | ${defaultTitle}` : null}\n      meta={[\n        {\n          name: `description`,\n          content: metaDescription,\n        },\n        {\n          property: `og:title`,\n          content: title,\n        },\n        {\n          property: `og:description`,\n          content: metaDescription,\n        },\n        {\n          property: `og:type`,\n          content: `website`,\n        },\n        {\n          name: `twitter:card`,\n          content: `summary`,\n        },\n        {\n          name: `twitter:creator`,\n          content: site.siteMetadata?.author || ``,\n        },\n        {\n          name: `twitter:title`,\n          content: title,\n        },\n        {\n          name: `twitter:description`,\n          content: metaDescription,\n        },\n      ].concat(meta)}\n    />\n  )\n}\n\nSEO.defaultProps = {\n  lang: `en`,\n  meta: [],\n  description: ``,\n}\n\nSEO.propTypes = {\n  description: PropTypes.string,\n  lang: PropTypes.string,\n  meta: PropTypes.arrayOf(PropTypes.object),\n  title: PropTypes.string.isRequired,\n}\n\nexport default SEO\n","import React from \"react\"\nimport PropTypes from \"prop-types\"\nimport { Link } from \"gatsby\"\nimport { StaticImage } from \"gatsby-plugin-image\"\n\nProjectCard.propTypes = {\n  title: PropTypes.string.isRequired,\n  description: PropTypes.string,\n  link: PropTypes.string,\n  color: PropTypes.oneOf([\"blue\", \"green\", \"purple\", \"orange\"]),\n  tags: PropTypes.arrayOf(PropTypes.string),\n}\n\nfunction ProjectCard({ title, color, description, link, tags = [] }) {\n  const getColor = c =>\n    c === \"blue\"\n      ? \"bg-gradient-to-r from-blue-500 via-purple-500 to-pink-500\"\n      : c === \"purple\"\n      ? \"bg-gradient-to-r from-purple-500 via-pink-500 to-red-500\"\n      : c === \"green\"\n      ? \"bg-gradient-to-r from-green-500 via-blue-500 to-indigo-500\"\n      : c === \"orange\"\n      ? \"bg-gradient-to-r from-yellow-600 via-red-500 to-pink-500\"\n      : \"bg-gray-500\"\n\n  return (\n    <Link class=\"flex\" to={link}>\n      <div\n        className={\n          \"relative border-matrix border-2 overflow-hidden mb-2 mr-2 flex flex-grow flex-col p-6 rounded-lg\"\n        }\n      >\n        <h3 class=\"text-matrix font-mono font-bold mb-4 text-xl z-10\">\n          {title}\n        </h3>\n        <p class=\"text-matrix font-mono z-10\">{description}</p>\n        <div class=\"flex mt-4 flex-wrap flex-grow-0\tz-10\">\n          {tags.map(t => (\n            <div className=\"px-4 py-2 text-sm rounded-full mr-2 mb-2 bg-green-900 text-matrix font-bold font-mono\">\n              {t}\n            </div>\n          ))}\n        </div>\n        <div className=\"absolute top-0 left-0 z-0\" style={{ margin: -15 }}>\n          <StaticImage\n            loading=\"eager\"\n            src=\"../images/green_holo_texture_2.png\"\n            alt=\"Texture\"\n            placeholder=\"blurred\"\n          />\n        </div>\n      </div>\n    </Link>\n  )\n}\n\nexport default ProjectCard\n","import React from \"react\"\nimport PropTypes from \"prop-types\"\n\nBlogPost.propTypes = {\n  node: PropTypes.shape({\n    title: PropTypes.string,\n    uniqueSlug: PropTypes.string,\n    virtuals: PropTypes.shape({\n      subtitle: PropTypes.string,\n      readingTime: PropTypes.number,\n      totalClapCount: PropTypes.number,\n    }),\n  }),\n}\n\nfunction BlogPost({ node }) {\n  const {\n    title,\n    uniqueSlug,\n    virtuals: { subtitle, readingTime, totalClapCount },\n  } = node\n  return (\n    <a\n      href={`https://medium.com/tombonanni/${uniqueSlug}`}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n    >\n      <div class=\"mb-6 p-6 border-matrix border-2 rounded-lg\">\n        <h3 class=\"font-bold text-matrix font-mono\">{title}</h3>\n        {!!readingTime && (\n          <p class=\"text-matrix font-mono mb-2\">\n            {Math.round(readingTime)} min read\n          </p>\n        )}\n        {!!totalClapCount && (\n          <p class=\"text-matrix font-mono mb-2\">{totalClapCount} claps</p>\n        )}\n        <p class=\"text-matrix font-mono\">{subtitle}</p>\n      </div>\n    </a>\n  )\n}\n\nexport default BlogPost\n","import React from \"react\"\nimport { graphql, Link } from \"gatsby\"\nimport Layout from \"../components/layout\"\nimport SEO from \"../components/seo\"\nimport ProjectCard from \"../components/ProjectCard\"\nimport BlogPost from \"../components/BlogPost\"\n\nconst IndexPage = ({ data }) => (\n  <Layout>\n    <SEO title=\"Home\" />\n\n    <p class=\"p-2 font-mono text-matrix text-left\">\n      Full Stack Blockchain Engineer. Want to know more? Head over to my{\" \"}\n      <Link to=\"/about\">About</Link>.\n    </p>\n    <h2 class=\"mt-12 mb-2 font-bold text-matrix font-mono text-base\">\n      <span class=\"py-2\">Featured projects</span>\n    </h2>\n    <div class=\"grid sm:grid-cols-1 md:grid-cols-2 gap-2 mt-4\">\n      <ProjectCard\n        title=\"ethersplit\"\n        description=\"NFT minting website built with Gatsby + Web3\"\n        link=\"/ethersplit\"\n        color=\"green\"\n        tags={[\"gatsby\", \"web3\", \"tailwindcss\"]}\n      />\n      <ProjectCard\n        title=\"afito-ui\"\n        description=\"Building blocks for Afito Apps\"\n        link=\"/afito-ui\"\n        color=\"green\"\n        tags={[\"react\", \"storybook\", \"styled-components\", \"stripe\"]}\n      />\n      <ProjectCard\n        title=\"mailr\"\n        description=\"Curate your mailing list\"\n        link=\"/mailr\"\n        color=\"green\"\n        tags={[\"react\", \"next.js\", \"mongodb\", \"chart.js\"]}\n      />\n      <ProjectCard\n        title=\"gatsby-web3-starter\"\n        description=\"Easily build blockchain enabled websites and apps\"\n        link=\"/gatsby-web3-starter\"\n        color=\"green\"\n        tags={[\"gatsby\", \"webpack5\", \"web3\"]}\n      />\n    </div>\n    <h2 class=\"mt-12 mb-2 font-bold text-matrix font-mono text-base\">\n      <span class=\"py-2\">My posts</span>\n    </h2>\n    <div class=\"mt-4 mb-36\">\n      {data.allMediumPost.edges.map(({ node }) => (\n        <BlogPost node={node} />\n      ))}\n    </div>\n  </Layout>\n)\n\nexport const query = graphql`\n  query {\n    allMediumPost(sort: { fields: [createdAt], order: DESC }) {\n      edges {\n        node {\n          id\n          title\n          uniqueSlug\n          virtuals {\n            subtitle\n            readingTime\n            totalClapCount\n          }\n          author {\n            name\n          }\n        }\n      }\n    }\n  }\n`\n\nexport default IndexPage\n"],"names":["SEO","description","lang","meta","title","site","useStaticQuery","metaDescription","siteMetadata","defaultTitle","htmlAttributes","titleTemplate","name","content","property","author","concat","defaultProps","color","link","tags","Link","class","to","className","map","t","style","margin","S","loading","src","alt","placeholder","node","uniqueSlug","virtuals","subtitle","readingTime","totalClapCount","href","target","rel","Math","round","data","allMediumPost","edges"],"sourceRoot":""}