{"version":3,"sources":["webpack:///./src/components/tag.js","webpack:///./src/components/photo.js","webpack:///./src/components/photogrid.js","webpack:///./src/pages/index.js"],"names":["Tag","props","Wrapper","children","styled","div","isActive","breakpoint","sm","Photo","image","site","setTag","tag","href","src","className","fluid","childImageSharp","alt","name","desc","class","github","tags","map","currentTag","onClick","xl","PhotoGrid","data","useStaticQuery","useState","filteredSites","sites","filter","includes","filteredGames","games","generateImage","commerceImage","wuphfImage","pizzayouImage","overthrowImage","bakeryImage","chatImage","wordGuessImage","reggieCubeImage","kingsbookImage","spaceImage","onTagClick","tagClicked","length","id","IndexPage","noContainer","title"],"mappings":"wNAOeA,EAJH,SAAAC,GACV,OAAO,kBAACC,EAAYD,EAAQA,EAAME,WAK9BD,EAAUE,IAAOC,IAAV,mEAAGD,CAAH,uMAEF,SAAAH,GAAK,OAAKA,EAAMK,SAAW,UAAY,aAK5B,SAAAL,GAAK,OAAKA,EAAMK,SAAW,UAAY,aAKrC,SAAAL,GAAK,OAAKA,EAAMK,SAAW,UAAY,aCuBzDJ,EAAUE,IAAOC,IAAV,gEAAGD,CAAH,0rBAQAG,IAAWC,IA6DTC,EA3GD,SAAC,GAAkC,IAAhCC,EAA+B,EAA/BA,MAAOC,EAAwB,EAAxBA,KAAMC,EAAkB,EAAlBA,OAAQC,EAAU,EAAVA,IACpC,OACE,kBAAC,EAAD,KACE,uBAAGC,KAAMH,GAAQA,EAAKI,KACpB,yBAAKC,UAAU,YACb,kBAAC,IAAD,CACEC,MAAOP,GAASA,EAAMQ,gBAAgBD,MACtCE,IAAKR,GAAQA,EAAKS,SAKxB,yBAAKJ,UAAU,QACb,4BAEE,2BAAIL,GAAQA,EAAKS,OAEnB,2BAAIT,GAAQA,EAAKU,MACjB,yBAAKC,MAAM,UACT,uBAAGR,KAAMH,GAAQA,EAAKY,QAAUZ,EAAKY,UAEvC,yBAAKP,UAAU,QACZL,GACCA,EAAKa,MACLb,EAAKa,KAAKC,KAAI,SAAAC,GAAU,OACtB,kBAAC,EAAD,CACEC,QAAS,kBAAMf,EAAOc,IACtBpB,SAAUoB,IAAeb,GAExBa,UCoIXxB,EAAUE,IAAOC,IAAV,yEAAGD,CAAH,4RAGAG,IAAWC,GAiBXD,IAAWqB,IAUTC,EA5LG,WAChB,IAAMC,EAAOC,yBAAe,cADN,EAwFAC,mBAAS,IAAxBnB,EAxFe,KAwFVD,EAxFU,KA0FhBqB,EACI,KAARpB,EAAaqB,IAAMC,QAAO,SAAAxB,GAAI,OAAIA,EAAKa,KAAKY,SAASvB,MAAQqB,IACzDG,EACI,KAARxB,EAAayB,IAAMH,QAAO,SAAAxB,GAAI,OAAIA,EAAKa,KAAKY,SAASvB,MAAQyB,IAEzDC,EAAgB,SAAAnB,GACpB,OAAQA,GACN,IAAK,qCACH,OAAOU,EAAKU,cACd,IAAK,QACH,OAAOV,EAAKW,WACd,IAAK,YACH,OAAOX,EAAKY,cACd,IAAK,YACH,OAAOZ,EAAKa,eACd,IAAK,kBACH,OAAOb,EAAKc,YACd,IAAK,WACH,OAAOd,EAAKe,UACd,IAAK,kBACH,OAAOf,EAAKgB,eACd,IAAK,cACH,OAAOhB,EAAKiB,gBACd,IAAK,kBACH,OAAOjB,EAAKkB,eACd,IAAK,mBACH,OAAOlB,EAAKmB,WACd,QACE,MAAO,KAIPC,EAAa,SAAAC,GACIvC,EAArBuC,IAAetC,EAAa,GAAasC,IAG3C,OACE,kBAAC,EAAD,KACGlB,EAAcmB,OAAS,GACtB,wBAAIpC,UAAU,SAAd,wBAEF,yBAAKA,UAAU,iBACZiB,EAAcR,KAAI,SAAAd,GACjB,IAAMD,EAAQ6B,EAAc5B,EAAKS,MAEjC,OACE,kBAAC,EAAD,CAAOT,KAAMA,EAAMD,MAAOA,EAAOE,OAAQsC,EAAYrC,IAAKA,QAIhE,yBAAKwC,GAAG,cACLhB,EAAce,OAAS,GACtB,wBAAIpC,UAAU,SAAd,qBAEF,yBAAKA,UAAU,iBACZqB,EAAcZ,KAAI,SAAAd,GACjB,IAAMD,EAAQ6B,EAAc5B,EAAKS,MAEjC,OACE,kBAAC,EAAD,CAAOT,KAAMA,EAAMD,MAAOA,EAAOE,OAAQsC,EAAYrC,IAAKA,WChJzDyC,UAPG,kBAChB,kBAAC,IAAD,CAAQC,aAAW,GACjB,kBAAC,IAAD,CAAKC,MAAM,SACX,kBAAC,EAAD","file":"component---src-pages-index-js-7f056364c716fc71c164.js","sourcesContent":["import React from \"react\"\nimport styled from \"styled-components\"\n\nconst Tag = props => {\n return {props.children}\n}\n\nexport default Tag\n\nconst Wrapper = styled.div`\n display: inline-block;\n color: ${props => (props.isActive ? \"inherit\" : \"#ea00b7\")};\n border: 1px solid #ea00b7;\n border-radius: 15px;\n padding: 0.3rem 0.5rem;\n margin: 0.2rem 0.5rem 0.2rem 0;\n background-color: ${props => (props.isActive ? \"#ea00b7\" : \"inherit\")};\n /* transition: all 0.2s ease-in-out; */\n &:hover {\n cursor: pointer;\n /* text-decoration: underline; */\n background-color: ${props => (props.isActive ? \"#ea00b7\" : \"#752d64\")};\n }\n`\n","import React from \"react\"\nimport Img from \"gatsby-image\"\nimport styled from \"styled-components\"\nimport { breakpoint } from \"../styles\"\nimport Tag from \"./tag\"\n\nconst Photo = ({ image, site, setTag, tag }) => {\n return (\n \n \n
\n \n {/*
{site.name}
*/}\n
\n \n
\n

\n {/* {site && site.name} */}\n {site && site.name}\n

\n

{site && site.desc}

\n
\n \n
\n
\n {site &&\n site.tags &&\n site.tags.map(currentTag => (\n setTag(currentTag)}\n isActive={currentTag === tag ? true : false}\n >\n {currentTag}\n \n ))}\n
\n
\n \n )\n}\n\nconst Wrapper = styled.div`\n width: 100%;\n background-color: #13141a;\n border-radius: 10px;\n padding: 1rem;\n .desc {\n padding: 0 1rem;\n\n @media ${breakpoint.sm} {\n padding: 0;\n }\n\n h3 {\n margin: 1rem 0 0 0;\n }\n a {\n color: inherit;\n text-decoration: none;\n &:hover {\n /* text-decoration: underline; */\n }\n }\n .tags {\n display: flex;\n justify-content: flex-end;\n margin-top: 0.5rem;\n }\n }\n\n .boxFluid {\n position: relative;\n transform: scale(1, 1);\n width: 100%;\n transition: all 0.2s ease-in-out;\n\n img {\n background-color: white;\n border-radius: 10px;\n }\n\n &:hover {\n /* color: red; */\n display: pointer;\n /* box-shadow: 5px -5px white; */\n transition: all 0.2s ease-in-out;\n transform: scale(1.05, 1.05);\n /* img {\n filter: blur(8px);\n } */\n }\n\n .overlay {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n background-color: rgba(40, 42, 43, 0.7);\n filter: opacity(0);\n font-size: 1.5rem;\n line-height: 1rem;\n text-align: center;\n }\n }\n`\n\nexport default Photo\n","import React, { useState } from \"react\"\nimport { useStaticQuery, graphql } from \"gatsby\"\nimport Img from \"gatsby-image\"\nimport { sites, games } from \"../constants/sites\"\nimport Photo from \"./photo\"\n\nimport styled from \"styled-components\"\nimport { breakpoint } from \"../styles\"\n\nconst PhotoGrid = () => {\n const data = useStaticQuery(graphql`\n query GetImages {\n commerceImage: file(relativePath: { eq: \"home/commerce.png\" }) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n wuphfImage: file(relativePath: { eq: \"home/wuphf-screenshot.png\" }) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n pizzayouImage: file(\n relativePath: { eq: \"home/pizzayou-screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n overthrowImage: file(\n relativePath: { eq: \"home/overthrow-screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n bakeryImage: file(relativePath: { eq: \"home/bakery-screenshot.png\" }) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n chatImage: file(relativePath: { eq: \"home/chatcord-screenshot.png\" }) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n wordGuessImage: file(\n relativePath: { eq: \"home/wordguess-screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n reggieCubeImage: file(\n relativePath: { eq: \"home/reggiecube-screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n kingsbookImage: file(\n relativePath: { eq: \"home/kingsbook-screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n spaceImage: file(\n relativePath: { eq: \"home/spaceshooter_screenshot.png\" }\n ) {\n childImageSharp {\n fluid(maxWidth: 800) {\n ...GatsbyImageSharpFluid_tracedSVG\n }\n }\n }\n }\n `)\n\n const [tag, setTag] = useState(\"\")\n\n const filteredSites =\n tag !== \"\" ? sites.filter(site => site.tags.includes(tag)) : sites\n const filteredGames =\n tag !== \"\" ? games.filter(site => site.tags.includes(tag)) : games\n\n const generateImage = name => {\n switch (name) {\n case \"Commerce Bank Cubicle Reservations\":\n return data.commerceImage\n case \"WUPHF\":\n return data.wuphfImage\n case \"Pizza You\":\n return data.pizzayouImage\n case \"Overthrow\":\n return data.overthrowImage\n case \"Charles' Bakery\":\n return data.bakeryImage\n case \"ChatCord\":\n return data.chatImage\n case \"Word Guess Game\":\n return data.wordGuessImage\n case \"Reggie Cube\":\n return data.reggieCubeImage\n case \"The King's Book\":\n return data.kingsbookImage\n case \"Space Shooter 2D\":\n return data.spaceImage\n default:\n return \"\"\n }\n }\n\n const onTagClick = tagClicked => {\n tagClicked === tag ? setTag(\"\") : setTag(tagClicked)\n }\n\n return (\n \n {filteredSites.length > 0 && (\n

PORTFOLIO - WEBSITES

\n )}\n
\n {filteredSites.map(site => {\n const image = generateImage(site.name)\n\n return (\n \n )\n })}\n
\n
\n {filteredGames.length > 0 && (\n

PORTFOLIO - GAMES

\n )}\n
\n {filteredGames.map(site => {\n const image = generateImage(site.name)\n\n return (\n \n )\n })}\n
\n
\n \n )\n}\n\nconst Wrapper = styled.div`\n .title {\n margin-left: 1rem;\n @media ${breakpoint.sm} {\n margin-left: 0rem;\n }\n }\n .gridContainer {\n display: grid;\n grid-template-columns: 1fr;\n grid-gap: 1.25rem;\n justify-items: center;\n /* align-items: center; */\n /* padding: 0.5rem 0 1rem 0; */\n /* background-color: yellow; */\n\n @media (min-width: 1100px) {\n grid-template-columns: 1fr 1fr;\n }\n\n @media ${breakpoint.xl} {\n grid-template-columns: 1fr 1fr 1fr;\n }\n }\n\n #top-margin {\n margin-top: 4rem;\n }\n`\n\nexport default PhotoGrid\n","import React from \"react\"\n\nimport Layout from \"../components/layout\"\nimport SEO from \"../components/seo\"\n\nimport PhotoGrid from \"../components/photogrid\"\n\nconst IndexPage = () => (\n \n \n \n \n)\n\nexport default IndexPage\n"],"sourceRoot":""}