{"version":3,"sources":["webpack:///./src/components/Blog/LatestPosts.js","webpack:///./src/components/Blog/Categories.js","webpack:///./src/pages/index.js","webpack:///./src/components/Blog/ElementCard.js","webpack:///./src/components/Blog/PostList.js"],"names":["LinkWrapper","styled","div","styles","border","color","colors","mainBlue","mainWhite","size","tablet","LatestPosts","posts","title","fade","to","className","PostList","edges","CategoriesWrapper","Categories","cats","map","node","key","id","slug","ElementCard","name","query","IndexPage","data","img","background","childImageSharp","fluid","bannerImage","alt","ElementCardWrapper","article","shadows","lightShadow","transDefault","darkShadow","mainBlack","PostListWrapper"],"mappings":"yLAsBMA,EAAcC,IAAOC,IAAV,2EAAGD,CAAH,kJAKXE,IAAOC,OAAO,CAACC,MAAM,GAAIF,IAAOG,OAAOC,WAGhCJ,IAAOG,OAAOE,UAGLL,IAAOM,KAAKC,QAoBnBC,EA9CK,WAAO,IAEhBC,EAFe,OAEfA,MAEP,OACI,kBAAC,IAAD,KACI,kBAAC,IAAD,CAAOC,MAAM,sBACb,kBAACb,EAAD,KACE,kBAAC,IAAD,CAASc,MAAI,EAACC,GAAG,QAAQC,UAAU,gBAAnC,cAEF,kBAACC,EAAA,EAAD,CAAUL,MAAOA,EAAMM,U,0BCa7BC,EAAoBlB,IAAOC,IAAV,oFAAGD,CAAH,iPAgCRmB,EAvDI,WAAO,IAEfC,EAFc,OAEdA,KAEP,OACI,kBAAC,IAAD,KACI,kBAAC,IAAD,CAAOR,MAAM,eACb,kBAACM,EAAD,KAEIE,EAAKH,MAAMI,KAAI,YAAa,IAAXC,EAAU,EAAVA,KACb,OACI,kBAAC,IAAD,CAAST,MAAI,EAACU,IAAKD,EAAKE,GAAIV,GAAE,IAAMQ,EAAKG,MACrC,kBAACC,EAAA,EAAD,CAAad,MAAOU,EAAKK,cCnBrD,sCAQA,IAWaC,EAAK,aAmBHC,UA9BG,SAAC,GAAD,IAAEC,EAAF,EAAEA,KAAF,OAChB,kBAAC,IAAD,KACE,kBAAC,IAAD,CAAKlB,MAAM,SACX,kBAAC,IAAD,CAAQmB,IAAKD,EAAKE,WAAWC,gBAAgBC,OAC3C,kBAAC,IAAD,CAAaH,IAAKD,EAAKK,YAAYF,gBAAgBC,MAAOE,IAAI,cAEhE,kBAAC,EAAD,MACA,kBAAC,EAAD,S,iCCfJ,mCAkBMC,EAAqBrC,IAAOsC,QAAV,sFAAGtC,CAAH,0iBAENE,IAAOqC,QAAQC,YAC3BtC,IAAOuC,aAISvC,IAAOqC,QAAQG,WAIfxC,IAAOG,OAAOE,UAOVL,IAAOG,OAAOC,SAUvBJ,IAAOG,OAAOsC,UAMNzC,IAAOM,KAAKC,OAYpBP,IAAOG,OAAOE,UAWfL,IAAOG,OAAOsC,WAWfjB,IAlFK,SAAC,GAAa,IAAZd,EAAW,EAAXA,MAClB,OACI,kBAACyB,EAAD,KACI,yBAAKtB,UAAU,cACX,4BAAQA,UAAU,gBACd,wBAAIA,UAAU,eACTH,Q,iCCVzB,6DAyBMgC,EAAkB5C,IAAOC,IAAV,4EAAGD,CAAH,iPAmBNgB,IAtCE,SAAC,GAAa,IAAZL,EAAW,EAAXA,MAEf,OACI,kBAAC,IAAD,KACI,kBAACiC,EAAD,KAEIjC,EAAMU,KAAI,YAAa,IAAXC,EAAU,EAAVA,KACR,OACE,kBAAC,IAAD,CAAST,MAAI,EAACC,GAAE,IAAMQ,EAAKG,KAAQF,IAAKD,EAAKE,IAC3C,kBAAC,IAAD,CAAaZ,MAAOU,EAAKV,gB","file":"component---src-pages-index-js-9116b87afc9cfd5ed49c.js","sourcesContent":["import React from 'react'\nimport {graphql, useStaticQuery} from 'gatsby'\nimport { Section, Title, styles } from '../../utils';\nimport PostList from './PostList';\nimport styled from 'styled-components'\nimport AniLink from 'gatsby-plugin-transition-link/AniLink';\n\nconst LatestPosts = () => {\n\n    const {posts} = useStaticQuery(query)\n\n    return (\n        <Section>\n            <Title title=\"latest blog posts\" />\n            <LinkWrapper>\n              <AniLink fade to=\"/blog\" className=\"btn allPosts\">All posts</AniLink>\n            </LinkWrapper>\n            <PostList posts={posts.edges} />\n        </Section>\n    )\n}\n\nconst LinkWrapper = styled.div`\n  text-align: center;\n  margin-top: 3rem;\n\n  .allPosts {\n    ${styles.border({color: `${styles.colors.mainBlue}`})};\n    padding: 0.5rem;\n    font-size: 1.3rem;\n    color: ${styles.colors.mainWhite};\n  }\n\n  @media (min-width:${styles.size.tablet}) {\n    .allPosts {\n      padding: 1.5rem;\n    }\n  }\n`\n\nconst query = graphql`\n {\n  posts:allWordpressPost( limit:6, sort:{fields: date,order:DESC}){\n    edges {\n      node {\n        id\n        slug\n        title\n      }\n    }\n  }\n}\n`\nexport default LatestPosts\n","import React from 'react'\nimport {graphql, useStaticQuery} from 'gatsby'\nimport { Section, Title } from '../../utils';\nimport ElementCard from './ElementCard';\nimport styled from 'styled-components'\nimport AniLink from \"gatsby-plugin-transition-link/AniLink\";\n\nconst Categories = () => {\n\n    const {cats} = useStaticQuery(query)\n\n    return (\n        <Section>\n            <Title title=\"categories\" />\n            <CategoriesWrapper>\n            {\n                cats.edges.map(({node}) => {\n                    return (\n                        <AniLink fade key={node.id} to={`/${node.slug}`}>\n                            <ElementCard title={node.name} />\n                        </AniLink>\n                    )\n                })\n            }\n            \n            </CategoriesWrapper>\n        </Section>\n    )\n}\n\nconst CategoriesWrapper = styled.div`\n\n    padding-top: 2rem;\n\n    display: grid;\n    grid-template-columns: auto;\n    grid-row-gap: 1rem;\n\n    @media (min-width:576px) {\n      grid-template-columns: 1fr 1fr;\n      grid-column-gap: 1.5rem;\n    }\n\n    @media (min-width:768px) {\n      grid-template-columns: 1fr 1fr 1fr;\n      grid-column-gap: 3rem;\n    }\n`\n\nconst query = graphql`\n {\n    cats:allWordpressCategory(filter:{count:{gt:0}}) {\n                edges {\n                    node {\n                        slug\n                        id:wordpress_id\n                        name\n                    }\n                }\n            }\n}\n`\nexport default Categories\n","import React from \"react\"\nimport { graphql } from 'gatsby'\nimport Layout from \"../components/layout\"\nimport SEO from \"../components/seo\"\nimport {Header, BannerImage} from '../utils'\nimport LatestPosts from '../components/Blog/LatestPosts'\nimport Categories from \"../components/Blog/Categories\";\n\nconst IndexPage = ({data}) => (\n  <Layout>\n    <SEO title=\"Home\" />\n    <Header img={data.background.childImageSharp.fluid}>\n      <BannerImage img={data.bannerImage.childImageSharp.fluid} alt=\"Debuxing\" />\n    </Header>\n    <LatestPosts />\n    <Categories />\n  </Layout>\n)\n\nexport const query = graphql`\n{\n  background:file(relativePath:{eq:\"bcg/cover-debuxing.jpg\"}) {\n    childImageSharp {\n      fluid {\n        ...GatsbyImageSharpFluid\n      }\n    }\n  }\n  bannerImage:file(relativePath:{eq:\"debuxing-logo.png\"}) {\n    childImageSharp {\n      fluid {\n        ...GatsbyImageSharpFluid\n      }\n    }\n  }\n}`\n\n\nexport default IndexPage\n","import React from 'react'\nimport styled from 'styled-components'\nimport {styles} from '../../utils'\n\nconst ElementCard = ({title}) => {\n    return (\n        <ElementCardWrapper>\n            <div className=\"post-inner\">\n                <header className=\"entry-header\">\n                    <h2 className=\"entry-title\">\n                        {title}\n                    </h2>\n                </header>\n            </div>\n        </ElementCardWrapper>\n    )\n}\n\nconst ElementCardWrapper = styled.article`\n\n    box-shadow: ${styles.shadows.lightShadow};\n    ${styles.transDefault};\n    height: 100%;\n    \n    &:hover {\n        box-shadow: ${styles.shadows.darkShadow};\n    }\n\n    .post-inner {\n        background: ${styles.colors.mainWhite};\n        height: 100%;\n\n        display:flex;\n        align-items: center;\n        justify-content: center;\n        &:hover {\n            background: ${styles.colors.mainBlue};\n        }\n    }\n\n    .entry-header {\n        text-align: center;\n    }\n\n    .entry-title {\n        text-decoration: none;\n        color: ${styles.colors.mainBlack};\n        font-size: 1.0rem;\n        margin: 0;\n        padding: 0.5rem;\n    }\n\n    @media (min-width: ${styles.size.tablet}){\n        .entry-header {\n            padding: 1.2rem;\n        }\n\n        .entry-title {\n            font-size: 1.5rem;\n        }\n    }\n\n    \n    .post-inner:hover .entry-title {\n        color: ${styles.colors.mainWhite};\n    }\n\n    .header-svg{\n        position: relative;\n        z-index: 11;\n        margin-top: -7.81%;\n    }\n\n    .svg-block {\n        stroke: none;\n        fill: ${styles.colors.mainBlack};\n    }\n\n    .svg-container {\n        bottom: 0;\n        width: 100%;\n    }\n\n    \n`\n\nexport default ElementCard\n","import React from 'react'\nimport { Section } from '../../utils';\nimport ElementCard from './ElementCard';\nimport styled from 'styled-components'\nimport AniLink from 'gatsby-plugin-transition-link/AniLink'\n\nconst PostList = ({posts}) => {\n\n    return (\n        <Section>\n            <PostListWrapper>\n            {\n                posts.map(({node}) => {\n                    return (\n                      <AniLink fade to={`/${node.slug}`} key={node.id}>\n                        <ElementCard title={node.title}  />\n                      </AniLink>\n                    )\n                })\n            }\n            </PostListWrapper>\n        </Section>\n    )\n}\n\nconst PostListWrapper = styled.div`\n\n    padding-top: 2rem;\n\n    display: grid;\n    grid-template-columns: auto;\n    grid-row-gap: 1rem;\n\n    @media (min-width:576px) {\n      grid-template-columns: 1fr 1fr;\n      grid-column-gap: 1.5rem;\n    }\n\n    @media (min-width:768px) {\n      grid-template-columns: 1fr 1fr 1fr;\n      grid-column-gap: 3rem;\n    }\n`\n\nexport default PostList\n"],"sourceRoot":""}