component---node-modules-nehalist-gatsby-theme-nehalem-src-templates-page-tsx-b86d67b07e827c8a8c9c.js.map

{"version":3,"sources":["webpack:///./node_modules/@nehalist/gatsby-theme-nehalem/src/components/subheader/index.tsx","webpack:///./node_modules/@nehalist/gatsby-theme-nehalem/src/components/page-sidebar-content/index.tsx","webpack:///./node_modules/@nehalist/gatsby-theme-nehalem/src/templates/page.tsx","webpack:///./node_modules/@nehalist/gatsby-theme-nehalem/src/components/card/style.tsx","webpack:///./node_modules/@nehalist/gatsby-theme-nehalem/src/components/card/index.tsx"],"names":["StyledSubheader","styled","div","props","backgroundColor","textColor","SubheaderTitle","h1","SubheaderSubtitle","small","Subheader","title","subtitle","LatestPosts","Theme","breakpoints","md","PageSidebarContent","posts","useStaticQuery","edges","map","node","post","index","frontmatter","featuredImage","childImageSharp","path","key","compact","meta","time","created","timePretty","createdPretty","tag","tags","length","PageContainer","Container","layout","linkColor","PageSidebar","aside","PageTemplate","pathContext","location","page","bigHeader","description","excerpt","primaryColor","dangerouslySetInnerHTML","__html","html","StyledCard","Link","StyledArticle","article","sm","FeaturedImage","Img","halfImage","CardContent","section","CardMeta","CardTitle","h2","Card","content","style","children","to","fixed","sizes","dateTime"],"mappings":"6FAAA,iDAWMA,EAAkBC,UAAOC,IAAV,iFAAGD,CAAH,oGACC,SAAAE,GAAK,OAAIA,EAAMC,gBAAkBD,EAAMC,gBAAkB,UACpE,SAAAD,GAAK,OAAIA,EAAME,UAAYF,EAAME,UAAY,UAOlDC,EAAiBL,UAAOM,GAAV,gFAAGN,CAAH,2EAQdO,EAAoBP,UAAOQ,MAAV,mFAAGR,CAAH,kDAiBRS,IAXsC,SAAC,GAAD,IAAEC,EAAF,EAAEA,MAAOC,EAAT,EAASA,SAAUR,EAAnB,EAAmBA,gBAAiBC,EAApC,EAAoCA,UAApC,OACnD,kBAACL,EAAD,CAAiBI,gBAAiBA,EAAiBC,UAAWA,GAC5D,kBAAC,IAAD,KACE,kBAACC,EAAD,KACGK,EACD,kBAACH,EAAD,KAAoBI,Q,sJCjCtBC,EAAcZ,UAAOC,IAAV,oFAAGD,CAAH,gLAMMa,IAAMC,YAAYC,IAmE1BC,EA1D+B,WAC5C,IA8BMC,EA9BcC,yBAAe,cA8BTD,MAAME,MAAMC,KAAI,SAAAC,GAAI,OAAIA,EAAKA,QAEvD,OACE,oCACE,4CACA,kBAACT,EAAD,KACGK,EAAMG,KAAI,SAACE,EAAMC,GAAP,OACT,kBAAC,IAAD,CACEb,MAAOY,EAAKE,YAAYd,MACxBe,cAAeH,EAAKE,YAAYC,cAAcC,gBAC9CC,KAAML,EAAKE,YAAYG,KACvBC,IAAKL,EACLM,SAAS,EACTC,KACE,CACEC,KAAMT,EAAKE,YAAYQ,QACvBC,WAAYX,EAAKE,YAAYU,cAC7BC,IAAKb,EAAKE,YAAYY,KAAKC,OAAS,EAAIf,EAAKE,YAAYY,KAAK,GAAK,c,YCpD7EE,EAAgBtC,kBAAOuC,KAAV,sEAAGvC,CAAH,sKAIIa,IAAMC,YAAYC,GAU5BF,IAAM2B,OAAOC,UACD5B,IAAM2B,OAAOC,WAIhCC,EAAc1C,UAAO2C,MAAV,oEAAG3C,CAAH,4DAGMa,IAAMC,YAAYC,IA0B1B6B,UArB4C,SAAC,GAA4B,IAA3BC,EAA2B,EAA3BA,YAAaC,EAAc,EAAdA,SAClEC,EAAOF,EAAYE,KAEzB,OACE,kBAAC,IAAD,CAAQC,WAAW,GACjB,kBAAC,IAAD,CACEtC,MAAOqC,EAAKvB,YAAYd,MACxBuC,YAAaF,EAAKvB,YAAY0B,QAC9BJ,SAAUA,IAEZ,kBAAC,IAAD,CAAWpC,MAAOqC,EAAKvB,YAAYd,MAAOP,gBAAiBU,IAAM2B,OAAOW,eACxE,kBAACb,EAAD,KACE,6BAASc,wBAAyB,CAACC,OAAQN,EAAKO,QAChD,kBAACZ,EAAD,KACE,kBAAC,EAAD,W,sJCpDGa,EAAavD,kBAAOwD,QAAV,uEAAGxD,CAAH,uPAgBVyD,EAAgBzD,UAAO0D,QAAV,0EAAG1D,CAAH,wFAIHa,IAAMC,YAAY6C,IAK5BC,EAAgB5D,kBAAO6D,KAAV,0EAAG7D,CAAH,qGAMtB,SAAAE,GAAK,OAAIA,EAAM4D,UAAN,mJAOYjD,IAAMC,YAAY6C,GAP9B,0LAoBAI,EAAc/D,UAAOgE,QAAV,wEAAGhE,CAAH,uDACX,SAAAE,GAAK,OAAIA,EAAM2B,QAAU,OAAS,UAWlCoC,EAAWjE,UAAOgE,QAAV,qEAAGhE,CAAH,6GASRkE,EAAYlE,UAAOmE,GAAV,sEAAGnE,CAAH,yBC3DToE,EAAqC,SAAC,GAAD,IACG1D,EADH,EACGA,MACAoB,EAFH,EAEGA,KACAH,EAHH,EAGGA,KACAF,EAJH,EAIGA,cACA4C,EALH,EAKGA,QALH,IAMGP,iBANH,aAOGjC,eAPH,SAQGyC,EARH,EAQGA,MACAC,EATH,EASGA,SATH,OAWhD,kBAACd,EAAD,CAAea,MAAOA,GACpB,kBAACf,EAAD,CAAYiB,GAAI7C,GAEZF,GAAiBA,EAAcgD,OACjC,kBAACb,EAAD,CAAea,MAAOhD,EAAcgD,MAAOX,UAAWA,IAEpDrC,GAAiBA,EAAciD,OACjC,kBAACd,EAAD,CAAec,MAAOjD,EAAciD,MAAOZ,UAAWA,IAEtD,kBAACC,EAAD,CAAalC,QAASA,GACnB0C,EACD,gCACGzC,GACD,kBAACmC,EAAD,KACGnC,EAAKK,KAAO,oCAAGL,EAAKK,KACpBL,EAAKC,MACN,0BAAM4C,SAAU7C,EAAKC,MAAOD,EAAKG,aAIlCvB,GACD,kBAACwD,EAAD,KAAYxD,IAGb2D,GACD,uBAAGjB,wBAAyB,CAACC,OAAQgB","file":"component---node-modules-nehalist-gatsby-theme-nehalem-src-templates-page-tsx-b86d67b07e827c8a8c9c.js","sourcesContent":["import React, {FunctionComponent} from \"react\";\nimport styled from \"styled-components\";\nimport {Container} from \"../common\";\n\ninterface SubheaderProps {\n  title: string;\n  subtitle?: string;\n  backgroundColor?: string;\n  textColor?: string;\n}\n\nconst StyledSubheader = styled.div<Pick<SubheaderProps, 'backgroundColor' | 'textColor'>>`\n  background-color: ${props => props.backgroundColor ? props.backgroundColor : '#000'};\n  color: ${props => props.textColor ? props.textColor : '#fff'};\n  display: flex;\n  align-items: center;\n  height: 90px;\n  margin-bottom: 30px;\n`;\n\nconst SubheaderTitle = styled.h1`\n  font-size: 1.2em;\n  font-weight: bold;\n  color: #fff;\n  margin: 0;\n  line-height: 1em;\n`;\n\nconst SubheaderSubtitle = styled.small`\n  font-weight: normal;\n  display: block;\n  opacity: .9;\n`;\n\nconst Subheader: FunctionComponent<SubheaderProps> = ({title, subtitle, backgroundColor, textColor}) => (\n  <StyledSubheader backgroundColor={backgroundColor} textColor={textColor}>\n    <Container>\n      <SubheaderTitle>\n        {title}\n        <SubheaderSubtitle>{subtitle}</SubheaderSubtitle>\n      </SubheaderTitle>\n    </Container>\n  </StyledSubheader>\n);\n\nexport default Subheader;\n","import React, {FunctionComponent} from \"react\";\nimport {graphql, useStaticQuery} from \"gatsby\";\nimport {Card} from \"../card\";\nimport styled from \"styled-components\";\nimport Theme from \"../../styles/theme\";\n\nconst LatestPosts = styled.div`\n  display: grid;\n  grid-template-columns: 1fr;\n  grid-gap: 30px;\n  width: 310px;\n\n  @media (max-width: ${Theme.breakpoints.md}) {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  @media (max-width: 700px) {\n    grid-template-columns: 1fr;\n  }\n`;\n\nconst PageSidebarContent: FunctionComponent = () => {\n  const latestPosts = useStaticQuery(graphql`\n    query {\n      posts: allMarkdownRemark(\n        filter: { fileAbsolutePath: { regex: \"/(posts)/.*\\\\\\\\.md$/\" } }\n        sort: { fields: frontmatter___created, order: DESC }\n        limit: 3\n      ) {\n        edges {\n          node {\n            id\n            frontmatter {\n              title\n              path\n              tags\n              created\n              createdPretty: created(formatString: \"DD MMMM, YYYY\")\n              excerpt\n              featuredImage {\n                childImageSharp {\n                  fixed(width: 315, height: 100) {\n                    ...GatsbyImageSharpFixed\n                  }\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  `);\n  const posts = latestPosts.posts.edges.map(node => node.node);\n\n  return (\n    <>\n      <h3>Latest posts</h3>\n      <LatestPosts>\n        {posts.map((post, index) => (\n          <Card\n            title={post.frontmatter.title}\n            featuredImage={post.frontmatter.featuredImage.childImageSharp}\n            path={post.frontmatter.path}\n            key={index}\n            compact={true}\n            meta={\n              {\n                time: post.frontmatter.created,\n                timePretty: post.frontmatter.createdPretty,\n                tag: post.frontmatter.tags.length > 0 ? post.frontmatter.tags[0] : null,\n              }\n            }\n          />\n        ))}\n      </LatestPosts>\n    </>\n  );\n};\n\nexport default PageSidebarContent;\n","import React, {FunctionComponent} from \"react\";\nimport Layout from \"../components/layout\";\nimport Subheader from \"../components/subheader\";\nimport {Page} from \"../utils/models\";\nimport Theme from \"../styles/theme\";\nimport {Container} from \"../components/common\";\nimport styled from \"styled-components\";\nimport PageSidebarContent from \"../components/page-sidebar-content\";\nimport SEO from \"../components/seo\";\n\ninterface PageTemplateProps {\n  pathContext: {\n    page: Page;\n  };\n  location: Location;\n}\n\nconst PageContainer = styled(Container)`\n  display: flex;\n  justify-content: space-between;\n\n  @media (max-width: ${Theme.breakpoints.md}) {\n    display: block;\n  }\n\n  p:first-child {\n    margin-top: 0;\n  }\n\n  li > a,\n  p > a {\n    color: ${Theme.layout.linkColor};\n    border-bottom: 2px ${Theme.layout.linkColor} solid;\n  }\n`;\n\nconst PageSidebar = styled.aside`\n  margin-left: 50px;\n\n  @media (max-width: ${Theme.breakpoints.md}) {\n    margin-left: 0;\n  }\n`;\n\nconst PageTemplate: FunctionComponent<PageTemplateProps> = ({pathContext, location}) => {\n  const page = pathContext.page;\n\n  return (\n    <Layout bigHeader={false}>\n      <SEO\n        title={page.frontmatter.title}\n        description={page.frontmatter.excerpt}\n        location={location}\n      />\n      <Subheader title={page.frontmatter.title} backgroundColor={Theme.layout.primaryColor}/>\n      <PageContainer>\n        <section dangerouslySetInnerHTML={{__html: page.html}}/>\n        <PageSidebar>\n          <PageSidebarContent />\n        </PageSidebar>\n      </PageContainer>\n    </Layout>\n  );\n};\n\nexport default PageTemplate;\n","import styled from \"styled-components\";\nimport {Link} from \"gatsby\";\nimport Theme from \"../../styles/theme\";\nimport Img from \"gatsby-image\";\nimport {CardProps} from \"./index\";\n\nexport const StyledCard = styled(Link)`\n  display: block;\n  background-color: #fff;\n  border-radius: 3px;\n  box-shadow: 0 1px 1px #e6e6e6, 0 2px 4px #e6e6e6;\n  transition: .5s all;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n\n  &:hover {\n    transform: translate3d(0, -5px, 0);\n    box-shadow: 0 1px 1px #ccc, 0 4px 4px #ccc;\n  }\n`;\n\nexport const StyledArticle = styled.article`\n  display: inline-block;\n  width: 100%;\n\n  @media (max-width: ${Theme.breakpoints.sm}) {\n    grid-area: unset !important;\n  }\n`;\n\nexport const FeaturedImage = styled(Img)<Pick<CardProps, 'halfImage'>>`\n  background-position: center;\n  background-size: cover;\n  max-width: 100%;\n  border-top-left-radius: 3px;\n\n  ${props => props.halfImage ? `\n    width: 50%;\n    float: left;\n    margin-right: 30px;\n    height: 320px;\n    border-bottom-left-radius: 3px;\n\n    @media (max-width: ${Theme.breakpoints.sm}) {\n      width: 100%;\n      float: none;\n      height: 190px;\n    }\n  ` : `\n    height: 190px;\n    max-height: 190px;\n    width: 100%;\n    border-top-right-radius: 3px;\n  `};\n`;\n\nexport const CardContent = styled.section<{ compact: boolean }>`\n  padding: ${props => props.compact ? '10px' : '40px'};\n\n  p {\n    margin: 15px 0;\n  }\n\n  h2 {\n    font-size: 1.2em;\n  }\n`;\n\nexport const CardMeta = styled.section`\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 8px;\n  font-size: .8em;\n  opacity: .8;\n  line-height: 1em;\n`;\n\nexport const CardTitle = styled.h2`\n  margin: 0;\n  padding: 0;\n`;\n","import React, {CSSProperties, FunctionComponent, ReactNode} from \"react\";\nimport {CardContent, CardMeta, CardTitle, FeaturedImage, StyledArticle, StyledCard} from \"./style\";\n\nexport interface CardProps {\n  title?: string;\n  path: string;\n  featuredImage?: any;\n  content?: string;\n  meta?: {\n    time: string;\n    timePretty: string;\n    tag: string | null;\n  };\n  halfImage?: boolean;\n  compact?: boolean;\n  style?: CSSProperties;\n  children?: ReactNode;\n}\n\nexport const Card: FunctionComponent<CardProps> = ({\n                                                     title,\n                                                     meta,\n                                                     path,\n                                                     featuredImage,\n                                                     content,\n                                                     halfImage = false,\n                                                     compact = false,\n                                                     style,\n                                                     children,\n                                                   }) => (\n  <StyledArticle style={style}>\n    <StyledCard to={path}>\n      {/* TODO: Oh boy... */}\n      {(featuredImage && featuredImage.fixed) &&\n      <FeaturedImage fixed={featuredImage.fixed} halfImage={halfImage}/>\n      }\n      {(featuredImage && featuredImage.sizes) &&\n      <FeaturedImage sizes={featuredImage.sizes} halfImage={halfImage}/>\n      }\n      <CardContent compact={compact}>\n        {children}\n        <header>\n          {meta &&\n          <CardMeta>\n            {meta.tag && <>{meta.tag}</>}\n            {meta.time &&\n            <time dateTime={meta.time}>{meta.timePretty}</time>\n            }\n          </CardMeta>\n          }\n          {title &&\n          <CardTitle>{title}</CardTitle>\n          }\n        </header>\n        {content &&\n        <p dangerouslySetInnerHTML={{__html: content}}/>\n        }\n      </CardContent>\n    </StyledCard>\n  </StyledArticle>\n);\n"],"sourceRoot":""}