component---src-pages-index-js-3434548b2693e500e92f.js.map

{"version":3,"sources":["webpack:///./src/templates/wrapper.js","webpack:///./src/ThemeContext.js","webpack:///./src/pages/index.js"],"names":["Wrapper","children","className","ThemeContext","createContext","dark","themeToggle","query","data","SEO","titleTemplate","allMarkdownRemark","edges","map","idx","node","Consumer","key","context","frontmatter","layout","to","fields","slug","title","date","target","rel","href","url","focusable","role","xmlns","viewBox","width","height","fill","d","publisher"],"mappings":"2FAAA,qCAeeA,IAXC,SAAC,GAAoB,IAAjBC,EAAgB,EAAhBA,SAElB,OACE,yBAAKC,UAAS,kBACZ,kBAAC,IAAD,MACCD,K,yICFDE,G,UAAeC,wBALM,CACzBC,MAAM,EACNC,YAAa,gB,YCKFC,EAAK,YA0BH,sBAAe,IAAZC,EAAW,EAAXA,KAEhB,OACE,kBAAC,IAAD,KACE,kBAACC,EAAA,EAAD,CAAKC,cAAc,OACnB,6BAASR,UAAU,yCAChBM,EAAKG,kBAAkBC,MAAMC,KAAI,WAAWC,GAAX,IAAGC,EAAH,EAAGA,KAAH,OAChC,kBAACZ,EAAaa,SAAd,CAAuBC,IAAKH,IACzB,SAACI,GAAD,OACC,6BAAShB,UAAS,cAAegB,EAAQb,KAAO,WAAa,YAA3C,wCAA4Fa,EAAQb,KAAO,WAAa,eAC3G,SAA5BU,EAAKI,YAAYC,QAChB,kBAAC,IAAD,CAAMC,GAAIN,EAAKO,OAAOC,KAAMrB,UAAU,cACpC,yBAAKA,UAAU,gCACb,yBAAKA,UAAU,sBACb,wBAAIA,UAAU,wBACZ,0BAAMA,UAAU,iCACba,EAAKI,YAAYK,QAGtB,uBAAGtB,UAAU,kBACX,0BAAMA,UAAU,6BACba,EAAKI,YAAYM,UAOD,kBAA5BV,EAAKI,YAAYC,QAChB,uBAAGM,OAAO,SAASC,IAAI,sBAAsBC,KAAMb,EAAKI,YAAYU,IAAK3B,UAAU,cACjF,yBAAKA,UAAU,gCACb,yBAAKA,UAAU,sBACb,wBAAIA,UAAU,wBACZ,0BAAMA,UAAU,iCACba,EAAKI,YAAYK,MAElB,yBAAKM,UAAU,QAAQ5B,UAAU,8CAA8C6B,KAAK,MAAMC,MAAM,6BAA6BC,QAAQ,cAAcC,MAAM,KAAKC,OAAO,MAAK,gDAA4B,0BAAMC,KAAK,eAAeC,EAAE,ohBAGtO,uBAAGnC,UAAU,kBACX,0BAAMA,UAAU,6BAAhB,aACaa,EAAKI,YAAYM,KAD9B,OACwCV,EAAKI,YAAYmB","file":"component---src-pages-index-js-3434548b2693e500e92f.js","sourcesContent":["import React from 'react';\nimport Header from '../components/Header';\n// import { ThemeProvider, ThemeContext } from '../ThemeContext';\n\nconst Wrapper = ( { children } ) => {\n\n  return (\n    <div className={`wrapper -light`}>\n      <Header />\n      {children}\n    </div>\n  );\n}\n\n\nexport default Wrapper;","import React, { useContext, createContext, useState, useEffect } from 'react';\r\n\r\nconst defaultContextData = {\r\n  dark: false,\r\n  themeToggle: () => {}\r\n}\r\n\r\nconst ThemeContext = createContext(defaultContextData);\r\nconst useTheme = () => useContext(ThemeContext);\r\n\r\nconst useEffectTheme = () => {\r\n  const [themeState, setThemeState] = useState({\r\n    dark: false,\r\n    hasThemeLoaded: false\r\n  });\r\n  useEffect(() => {\r\n    const lsTheme = localStorage.getItem('darkTheme') === 'true';\r\n    setThemeState({ ...themeState, dark: lsTheme, hasThemeLoaded: true });\r\n  }, []);\r\n\r\n  return [themeState, setThemeState];\r\n}\r\n\r\nconst ThemeProvider = ({ children }) => {\r\n  const [themeState, setThemeState] = useEffectTheme();\r\n\r\n  if (!themeState.hasThemeLoaded) {\r\n    return <div />;\r\n  }\r\n\r\n  const themeToggle = () => {\r\n    const dark = !themeState.dark;\r\n    localStorage.setItem('darkTheme', dark);\r\n    setThemeState({ ...themeState, dark });\r\n  };\r\n\r\n  return (\r\n    <ThemeContext.Provider\r\n      value={{\r\n        dark: themeState.dark,\r\n        themeToggle\r\n      }}\r\n    >\r\n      {children}\r\n    </ThemeContext.Provider>\r\n  )\r\n}\r\n\r\nexport { ThemeProvider, useTheme, ThemeContext};","import React from 'react';\nimport Link from 'gatsby-link';\nimport SEO from '../components/SEO';\nimport { graphql } from 'gatsby';\n\nimport { ThemeContext } from '../ThemeContext';\n\nimport Wrapper from '../templates/wrapper';\n\nexport const query = graphql`\n  query IndexQuery {\n    allMarkdownRemark(sort: {fields: [fileAbsolutePath], order: DESC}) {\n      totalCount\n      edges {\n        node {\n          id\n          fileAbsolutePath\n          frontmatter {\n            title\n            layout\n            publisher\n            url\n            date(formatString: \"DD MMMM, YYYY\")\n          }\n          fields {\n            slug\n            title\n            date\n          }\n        }\n      }\n    }\n  }\n`;\n\nexport default ({ data }) => {\n\n  return (\n    <Wrapper>\n      <SEO titleTemplate=\"%s\" />\n      <section className=\"cf pv6 ph4 pa6-l bt mw9 center avenir\">\n        {data.allMarkdownRemark.edges.map(({ node }, idx) => (\n          <ThemeContext.Consumer key={idx}>\n            {(context) => (\n              <article className={`pb3 bb b--${context.dark ? 'white-10' : 'black-05'} bg-animate bg-transparent hover-bg-${context.dark ? 'black-30' : 'light-gray'}`}>\n                {node.frontmatter.layout === 'post' &&\n                  <Link to={node.fields.slug} className=\"post-title\">\n                    <div className=\"flex flex-column flex-row-ns\">\n                      <div className=\"w-100 pa3-l pl3-ns\">\n                        <h2 className=\"f2 f2-m lh-title mv0\">\n                          <span className=\"dib lh-copy pa3 tracked-tight\">\n                            {node.frontmatter.title}\n                          </span>\n                        </h2>\n                        <p className=\"f5 lh-copy mv0\">\n                          <span className=\"lh-copy pa3 tracked-tight\">\n                            {node.frontmatter.date}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </Link>\n                }\n                {node.frontmatter.layout === 'post-external' &&\n                  <a target=\"_blank\" rel=\"noopener noreferrer\" href={node.frontmatter.url} className=\"post-title\">\n                    <div className=\"flex flex-column flex-row-ns\">\n                      <div className=\"w-100 pa3-l pl3-ns\">\n                        <h2 className=\"f2 f2-m lh-title mv0\">\n                          <span className=\"dib lh-copy pa3 tracked-tight\">\n                            {node.frontmatter.title}\n                            { /* Icon credit to FontAwesome - https://fontawesome.com/license */ }\n                            <svg focusable=\"false\" className=\"svg-inline--fa fa-external-link-alt fa-w-18\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\" width=\"32\" height=\"32\"><title>External Link</title><path fill=\"currentColor\" d=\"M576 24v127.984c0 21.461-25.96 31.98-40.971 16.971l-35.707-35.709-243.523 243.523c-9.373 9.373-24.568 9.373-33.941 0l-22.627-22.627c-9.373-9.373-9.373-24.569 0-33.941L442.756 76.676l-35.703-35.705C391.982 25.9 402.656 0 424.024 0H552c13.255 0 24 10.745 24 24zM407.029 270.794l-16 16A23.999 23.999 0 0 0 384 303.765V448H64V128h264a24.003 24.003 0 0 0 16.97-7.029l16-16C376.089 89.851 365.381 64 344 64H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V287.764c0-21.382-25.852-32.09-40.971-16.97z\"></path></svg>\n                          </span>\n                        </h2>\n                        <p className=\"f5 lh-copy mv0\">\n                          <span className=\"lh-copy pa3 tracked-tight\">\n                            Published {node.frontmatter.date} on {node.frontmatter.publisher}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </a>\n                }\n              </article>\n            )}\n          </ThemeContext.Consumer>\n        ))}\n      </section>\n    </Wrapper>\n  )\n}\n\n"],"sourceRoot":""}