{"version":3,"sources":["webpack:///./src/components/sidebar/RecentPostList.js","webpack:///./src/components/sidebar/RecentPost.js","webpack:///./src/components/layout/sidebar.js","webpack:///./src/components/layout/layout_sidebar.js","webpack:///./src/templates/blog-content.js"],"names":["Container","styled","div","List","Content","Image","Link","Title","Date","RecentPostList","nodes","map","node","key","frontmatter","title","to","fields","slug","fixed","topImage","childImageSharp","created_at","RecentPost","useStaticQuery","allMarkdownRemark","edges","console","log","Aside","aside","Sidebar","Main","main","LayoutSidebar","props","GlobalStyle","children","Article","article","h1","Post","markdownRemark","data","description","image","fluid","src","PostCardCategoryList","categories","PostCardDate","updated_at","dangerouslySetInnerHTML","__html","html","query"],"mappings":"+QAKMA,EAAYC,IAAOC,IAAV,4EAAGD,CAAH,gCAKTE,EAAOF,IAAOC,IAAV,uEAAGD,CAAH,8FAOJG,EAAUH,IAAOC,IAAV,0EAAGD,CAAH,gCAIPI,EAAQJ,YAAOK,KAAV,wEAAGL,CAAH,2DAMLM,EAAQN,YAAOK,KAAV,wEAAGL,CAAH,8GASLO,EAAOP,IAAOC,IAAV,uEAAGD,CAAH,mCA0BKQ,MApBf,YAAoC,IAAVC,EAAS,EAATA,MACxB,OACE,kBAACV,EAAD,KACGU,EAAMC,KAAI,YAAe,IAAZC,EAAW,EAAXA,KACZ,OACE,kBAACT,EAAD,CAAMU,IAAKD,EAAKE,YAAYC,OAC1B,kBAACV,EAAD,CAAOW,GAAIJ,EAAKK,OAAOC,MACrB,kBAAC,IAAD,CAAKC,MAAOP,EAAKE,YAAYM,SAASC,gBAAgBF,SAExD,kBAACf,EAAD,KACE,kBAACG,EAAD,CAAOS,GAAIJ,EAAKK,OAAOC,MAAON,EAAKE,YAAYC,OAC/C,kBAAC,EAAD,KAAOH,EAAKE,YAAYQ,mBChDhCtB,EAAYC,IAAOC,IAAV,wEAAGD,CAAH,6FAQTG,EAAUH,IAAOC,IAAV,sEAAGD,CAAH,yFAiDEsB,EA1CI,WACjB,IA+BMb,EA/BOc,YAAe,cA+BTC,kBAAkBC,MAErC,OADAC,QAAQC,IAAIlB,GAEV,kBAAC,EAAD,KACE,kBAAC,EAAD,cACA,kBAAC,EAAD,CAAgBA,MAAOA,MCrDvBmB,EAAQ5B,IAAO6B,MAAV,qEAAG7B,CAAH,qDAcI8B,EARC,WACd,OACE,kBAACF,EAAD,KACE,kBAAC,EAAD,Q,YCLA7B,G,UAAYC,IAAOC,IAAV,gFAAGD,CAAH,2DAMTG,EAAUH,IAAOC,IAAV,8EAAGD,CAAH,kHAUP+B,EAAO/B,IAAOgC,KAAV,2EAAGhC,CAAH,6DAoBKiC,EAdO,SAAAC,GACpB,OACE,kBAAC,EAAD,KACE,kBAACC,EAAA,EAAD,MACA,kBAAC,IAAD,MACA,kBAAC,EAAD,KACE,kBAACJ,EAAD,KAAOG,EAAME,UACb,kBAAC,EAAD,OAEF,kBAAC,IAAD,Q,oCC9BAC,EAAUrC,IAAOsC,QAAV,4EAAGtC,CAAH,iLAuBPM,EAAQN,IAAOuC,GAAV,0EAAGvC,CAAH,sDAMLG,EAAUH,IAAOC,IAAV,4EAAGD,CAAH,kHAUE,SAASwC,EAAT,GAAyB,IAC9BC,EAD6B,EAARC,KACrBD,eACA5B,EAAgB4B,EAAhB5B,YACR,OACE,kBAAC,EAAD,KACE,kBAAC,IAAD,CACEC,MAAOD,EAAYC,MACnB6B,YAAa9B,EAAY8B,YACzBC,MAAO/B,EAAYM,SAASC,gBAAgByB,MAAMC,IAClDR,SAAS,IAEX,kBAAC,IAAD,CAAKO,MAAOhC,EAAYM,SAASC,gBAAgByB,QACjD,kBAACR,EAAD,KACE,kBAAC,EAAD,KAAQxB,EAAYC,OACpB,kBAACiC,EAAA,EAAD,CAAsBC,WAAYnC,EAAYmC,aAC9C,kBAACC,EAAA,EAAD,CACE5B,WAAYR,EAAYQ,WACxB6B,WAAYrC,EAAYqC,aAE1B,kBAAC,EAAD,CAASC,wBAAyB,CAAEC,OAAQX,EAAeY,UAK5D,IAAMC,EAAK,c","file":"component---src-templates-blog-content-js-ab9c98de977e77dea799.js","sourcesContent":["import React from \"react\"\nimport styled from \"styled-components\"\nimport { Link } from \"gatsby\"\nimport Img from \"gatsby-image\"\n\nconst Container = styled.div`\n  @media (min-width: 768px) {\n  }\n`\n\nconst List = styled.div`\n  font-size: 0.875em;\n  padding-top: 1em;\n  display: flex;\n  align-items: center;\n  justify-content: start;\n`\nconst Content = styled.div`\n  padding-left: 0.5em;\n  flex: 1;\n`\nconst Image = styled(Link)`\n  transition: all 0.3s ease-in-out;\n  &:hover {\n    opacity: 0.5;\n  }\n`\nconst Title = styled(Link)`\n  text-decoration: none;\n  line-height: 1.3em;\n  color: black;\n  transition: all 0.3s ease-in-out;\n  &:hover {\n    opacity: 0.5;\n  }\n`\nconst Date = styled.div`\n  /* font-size: 0; */\n  padding-top: 0.2em;\n  color: gray;\n`\n\nfunction RecentPostList({ nodes }) {\n  return (\n    <Container>\n      {nodes.map(({ node }) => {\n        return (\n          <List key={node.frontmatter.title}>\n            <Image to={node.fields.slug}>\n              <Img fixed={node.frontmatter.topImage.childImageSharp.fixed} />\n            </Image>\n            <Content>\n              <Title to={node.fields.slug}>{node.frontmatter.title}</Title>\n              <Date>{node.frontmatter.created_at}</Date>\n            </Content>\n          </List>\n        )\n      })}\n    </Container>\n  )\n}\n\nexport default RecentPostList\n","import React from \"react\"\nimport styled from \"styled-components\"\nimport { graphql, useStaticQuery } from \"gatsby\"\nimport RecentPostList from \"./RecentPostList\"\n\nconst Container = styled.div`\n  border: 1px solid #e0e0e0;\n  padding: 1em;\n  margin: 1em 2em;\n  @media (min-width: 768px) {\n    margin: 0;\n  }\n`\nconst Content = styled.div`\n  font-size: 13px;\n  font-weight: bold;\n  border-bottom: 1px solid #e0e0e0;\n  padding-bottom: 5px;\n`\n\nconst RecentPost = () => {\n  const data = useStaticQuery(graphql`\n    {\n      allMarkdownRemark(\n        sort: { order: DESC, fields: frontmatter___created_at }\n      ) {\n        edges {\n          node {\n            fields {\n              slug\n            }\n            frontmatter {\n              title\n              created_at\n              updated_at\n              categories\n              topImage {\n                relativePath\n                childImageSharp {\n                  id\n                  fixed(width: 80) {\n                    ...GatsbyImageSharpFixed\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  `)\n\n  const nodes = data.allMarkdownRemark.edges\n  console.log(nodes)\n  return (\n    <Container>\n      <Content>最新の投稿</Content>\n      <RecentPostList nodes={nodes} />\n    </Container>\n  )\n}\n\nexport default RecentPost\n","import React from \"react\"\nimport styled from \"styled-components\"\nimport RecentPost from \"../sidebar/RecentPost\"\n\nconst Aside = styled.aside`\n  width: 100%;\n  @media (min-width: 768px) {\n    width: 30%;\n  }\n`\nconst Sidebar = () => {\n  return (\n    <Aside>\n      <RecentPost />\n    </Aside>\n  )\n}\n\nexport default Sidebar\n","import React from \"react\"\nimport Header from \"./header\"\nimport Footer from \"./footer\"\nimport Sidebar from \"./sidebar\"\nimport GlobalStyle from \"./GlobalStyle\"\nimport \"prismjs/themes/prism-twilight.css\"\nimport styled from \"styled-components\"\n\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n  min-height: 100vh;\n`\n\nconst Content = styled.div`\n  padding-top: 100px;\n  padding-bottom: 40px;\n\n  @media (min-width: 768px) {\n    max-width: 1000px;\n    margin: 0 auto;\n    display: flex;\n  }\n`\nconst Main = styled.main`\n  @media (min-width: 768px) {\n    width: 68%;\n    padding-right: 20px;\n  }\n`\nconst LayoutSidebar = props => {\n  return (\n    <Container>\n      <GlobalStyle />\n      <Header />\n      <Content>\n        <Main>{props.children}</Main>\n        <Sidebar />\n      </Content>\n      <Footer />\n    </Container>\n  )\n}\n\nexport default LayoutSidebar\n","import React from \"react\"\nimport { graphql } from \"gatsby\"\nimport Layout from \"../components/layout/layout_sidebar\"\nimport styled from \"styled-components\"\nimport Img from \"gatsby-image\"\nimport PostCardCategoryList from \"../components/post/PostCardCategoryList\"\nimport PostCardDate from \"../components/post/PostCardDate\"\nimport SEO from \"../components/layout/seo\"\n\nconst Article = styled.article`\n  margin: 2em 1em;\n  h2 {\n    font-weight: 700;\n    font-size: 1.5em;\n    padding: 1em 0;\n  }\n\n  h3 {\n    font-weight: 700;\n    font-size: 1.3em;\n  }\n\n  h4 {\n    font-weight: 700;\n    font-size: 1.1em;\n  }\n\n  p {\n    margin: 1em 0;\n    line-height: 1.8em;\n  }\n`\nconst Title = styled.h1`\n  font-size: 2em;\n  font-weight: 700;\n  margin-bottom: 1em;\n`\n\nconst Content = styled.div`\n  margin-top: 1em;\n  .gatsby-resp-image-figcaption {\n    text-align: center;\n    color: gray;\n    font-size: 0.875em;\n    margin-top: 1em;\n  }\n`\n\nexport default function Post({ data }) {\n  const { markdownRemark } = data\n  const { frontmatter } = markdownRemark\n  return (\n    <Layout>\n      <SEO\n        title={frontmatter.title}\n        description={frontmatter.description}\n        image={frontmatter.topImage.childImageSharp.fluid.src}\n        article={true}\n      />\n      <Img fluid={frontmatter.topImage.childImageSharp.fluid} />\n      <Article>\n        <Title>{frontmatter.title}</Title>\n        <PostCardCategoryList categories={frontmatter.categories} />\n        <PostCardDate\n          created_at={frontmatter.created_at}\n          updated_at={frontmatter.updated_at}\n        />\n        <Content dangerouslySetInnerHTML={{ __html: markdownRemark.html }} />\n      </Article>\n    </Layout>\n  )\n}\nexport const query = graphql`\n  query($slug: String!) {\n    markdownRemark(fields: { slug: { eq: $slug } }) {\n      html\n      frontmatter {\n        title\n        categories\n        created_at\n        updated_at\n        description\n        topImage {\n          id\n          childImageSharp {\n            fluid(maxWidth: 680) {\n              ...GatsbyImageSharpFluid\n            }\n          }\n        }\n      }\n    }\n  }\n`\n"],"sourceRoot":""}