-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcomponent---src-pages-about-tsx-e392a00717d135082450.js.map
1 lines (1 loc) · 58.9 KB
/
component---src-pages-about-tsx-e392a00717d135082450.js.map
1
{"version":3,"sources":["webpack:///./src/components/AuthorCard.tsx","webpack:///./src/components/PostFullFooter.tsx","webpack:///./src/components/PostFullFooterRight.tsx","webpack:///./src/components/icons/infinity.tsx","webpack:///./src/components/ReadNextCard.tsx","webpack:///./src/templates/post.tsx","webpack:///./src/pages/about.tsx","webpack:///./src/components/PostCard.tsx","webpack:///./src/components/PostContent.tsx","webpack:///./src/components/subscribe/Subscribe.tsx"],"names":["AuthorCardSection","Object","styled_base_browser_esm","target","name","styles","AuthorCardName","colors","darkgrey","AuthorCardContent","midgrey","AuthorCard","_ref","author","core_browser_esm","css","AuthorProfileImage","src","avatar","children","fixed","alt","id","gatsby_browser_entry","to","_","bio","PostFullFoot","PostFullFooter","props","PostFullFooterRightDiv","AuthorCardButton","lighten","blue","PostFullFooterRight","authorId","InfinityIcon","xmlns","viewBox","d","ReadNextCardStyles","coverImage","ReadNextCardHeader","ReadNextCardHeaderSitetitle","ReadNextCardHeaderTitle","ReadNextDivider","ReadNextCardContent","ReadNextCardFooter","ReadNextCard","query","render","header","childImageSharp","fluid","config","title","tags","infinity","relatedPosts","edges","map","n","key","node","frontmatter","fields","slug","totalCount","data","_1676377518","PostTemplate","PostFull","NoImage","PostFullHeader","PostFullMeta","PostFullMetaDate","PostFullTitle","setLightness","PostFullImage","lightgrey","DateDivider","ReadNextFeed","PageTemplate","post","markdownRemark","width","height","image","sizes","split","String","Number","aspectRatio","layouts","className","Helmet","lang","content","excerpt","property","siteUrl","pathContext","date","facebook","twitter","Wrapper","css_browser_esm","outer","SiteHeader","inner","SiteNav","SiteMain","dateTime","userDate","length","react","gatsby_image_default","a","style","PostContent","htmlAst","showSubscribe","Subscribe","components_PostFullFooter","components_AuthorCard","components_PostFullFooterRight","components_ReadNextCard","pageContext","prev","PostCard","next","Footer","About","_emotion_core__WEBPACK_IMPORTED_MODULE_1__","_layouts__WEBPACK_IMPORTED_MODULE_2__","react_helmet__WEBPACK_IMPORTED_MODULE_10___default","_components_Wrapper__WEBPACK_IMPORTED_MODULE_3__","_emotion_css__WEBPACK_IMPORTED_MODULE_0__","_components_header_SiteNav__WEBPACK_IMPORTED_MODULE_4__","_templates_post__WEBPACK_IMPORTED_MODULE_7__","_components_PostContent__WEBPACK_IMPORTED_MODULE_8__","_components_Footer__WEBPACK_IMPORTED_MODULE_9__","PostCardStyles","PostCardImageLink","PostCardImage","_emotion_styled_base__WEBPACK_IMPORTED_MODULE_1__","PostCardContent","PostCardContentLink","PostCardTags","PostCardTitle","PostCardExcerpt","PostCardMeta","AuthorList","AuthorListItem","AuthorNameTooltip","StaticAvatar","ReadingTime","_emotion_core__WEBPACK_IMPORTED_MODULE_2__","gatsby__WEBPACK_IMPORTED_MODULE_3__","gatsby_image__WEBPACK_IMPORTED_MODULE_4___default","timeToRead","PostFullContent","darken","whitegrey","setSaturation","renderAst","RehypeReact","createElement","React","components","Compiler","Ast","ast","_babel_runtime_helpers_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_0___default","properties","_ref2","SubscribeFormSection","_emotion_styled_base__WEBPACK_IMPORTED_MODULE_0__","SubscribeFormTitle","_SubscribeForm__WEBPACK_IMPORTED_MODULE_5__"],"mappings":"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","file":"component---src-pages-about-tsx-e392a00717d135082450.js","sourcesContent":["import { Link } from 'gatsby';\nimport * as _ from 'lodash';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\n\nimport { colors } from '../styles/colors';\nimport { AuthorProfileImage } from '../styles/shared';\n\nconst AuthorCardSection = styled.section`\n display: flex;\n`;\n\nconst AuthorCardName = styled.h4`\n margin: 8px 0 2px 0;\n padding: 0;\n font-size: 2rem;\n\n a {\n color: ${colors.darkgrey};\n font-weight: 700;\n }\n\n a:hover {\n text-decoration: none;\n }\n`;\n\nconst AuthorCardContent = styled.section`\n p {\n margin: 0;\n color: ${colors.midgrey};\n line-height: 1.3em;\n }\n`;\n\nexport interface AuthorCardProps {\n author: any;\n}\n\nconst AuthorCard: React.FC<AuthorCardProps> = ({ author }) => {\n return (\n <AuthorCardSection>\n {/* TODO: default avatar */}\n {/* TODO: author page url */}\n <img css={AuthorProfileImage} src={author.avatar.children[0].fixed.src} alt={author.id} />\n <AuthorCardContent>\n <AuthorCardName>\n <Link to={`/author/${_.kebabCase(author.id)}/`}>{author.id}</Link>\n </AuthorCardName>\n {author.bio ? (\n <p>{author.bio}</p>\n ) : (\n <p>\n Read <Link to={`/author/${_.kebabCase(author.id)}/`}>more posts</Link> by this author.\n </p>\n )}\n </AuthorCardContent>\n </AuthorCardSection>\n );\n};\n\nexport default AuthorCard;\n","import * as React from 'react';\nimport styled from '@emotion/styled';\n\nconst PostFullFoot = styled.footer`\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin: 0 auto;\n padding: 3vw 0 6vw 0;\n max-width: 840px;\n`;\n\nconst PostFullFooter: React.FC = props => <PostFullFoot>{props.children}</PostFullFoot>;\n\nexport default PostFullFooter;\n","import { Link } from 'gatsby';\nimport * as _ from 'lodash';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/core';\nimport { lighten } from 'polished';\n\nimport { colors } from '../styles/colors';\n\nconst PostFullFooterRightDiv = styled.div`\n flex-shrink: 0;\n margin-left: 20px;\n`;\n\nconst AuthorCardButton = css`\n display: block;\n padding: 9px 16px;\n /* border: color(var(--midgrey) l(+20%)) 1px solid; */\n border: ${lighten('0.2', colors.midgrey)} 1px solid;\n color: ${colors.midgrey};\n font-size: 1.2rem;\n line-height: 1;\n font-weight: 500;\n border-radius: 20px;\n transition: all ease 0.2s;\n\n :hover {\n border-color: ${colors.blue};\n color: ${colors.blue};\n text-decoration: none;\n }\n`;\n\nexport interface PostFullFooterRightProps {\n authorId: string;\n}\n\nconst PostFullFooterRight: React.FC<PostFullFooterRightProps> = props => (\n <PostFullFooterRightDiv>\n <Link css={AuthorCardButton} to={`/author/${_.kebabCase(props.authorId)}/`}>\n Read More\n </Link>\n </PostFullFooterRightDiv>\n);\n\nexport default PostFullFooterRight;\n","// tslint:disable:no-http-string\nimport * as React from 'react';\n\nconst InfinityIcon: React.FC = () => (\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M13 14.5s2 3 5 3 5.5-2.463 5.5-5.5S21 6.5 18 6.5c-5 0-7 11-12 11C2.962 17.5.5 15.037.5 12S3 6.5 6 6.5s4.5 3.5 4.5 3.5\" />\n </svg>\n);\nexport default InfinityIcon;\n","import { Link, StaticQuery, graphql } from 'gatsby';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport * as _ from 'lodash';\n\nimport { colors } from '../styles/colors';\nimport InfinityIcon from './icons/infinity';\nimport config from '../website-config';\n\nexport interface ReadNextCardStylesProps {\n coverImage: string;\n}\n\nconst ReadNextCardStyles = styled.article<ReadNextCardStylesProps>`\n position: relative;\n flex: 1 1 300px;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n margin: 0 20px 40px;\n padding: 25px;\n color: #fff;\n background: ${colors.darkgrey} center center;\n background-size: cover;\n border-radius: 5px;\n box-shadow: rgba(39, 44, 49, 0.06) 8px 14px 38px, rgba(39, 44, 49, 0.03) 1px 3px 8px;\n background-image: url(${props => props.coverImage});\n\n :before {\n content: \"\";\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n display: block;\n background: linear-gradient(135deg, rgba(0,40,60,0.8) 0%,rgba(0,20,40,0.7) 100%);\n border-radius: 5px;\n backdrop-filter: blur(2px);\n }\n`;\n\nconst ReadNextCardHeader = styled.header`\n position: relative;\n z-index: 50;\n padding-top: 20px;\n text-align: center;\n`;\n\nconst ReadNextCardHeaderSitetitle = styled.small`\n display: block;\n font-size: 1.3rem;\n line-height: 1.3em;\n opacity: 0.8;\n`;\n\nconst ReadNextCardHeaderTitle = styled.h3`\n margin: 0;\n padding: 0 20px;\n color: #fff;\n font-size: 3rem;\n line-height: 1.2em;\n letter-spacing: 1px;\n\n a {\n color: #fff;\n font-weight: 300;\n text-decoration: none;\n }\n\n a:hover {\n text-decoration: none;\n }\n`;\n\nconst ReadNextDivider = styled.div`\n position: relative;\n display: flex;\n justify-content: center;\n height: 80px;\n\n svg {\n width: 40px;\n fill: transparent;\n stroke: #fff;\n\n stroke-width: 0.5px;\n stroke-opacity: 0.65;\n }\n`;\n\nconst ReadNextCardContent = styled.div`\n position: relative;\n z-index: 50;\n flex-grow: 1;\n display: flex;\n font-size: 1.7rem;\n\n ul {\n display: flex;\n flex-direction: column;\n margin: 0 auto;\n padding: 0;\n text-align: center;\n list-style: none;\n }\n\n li {\n margin: 0;\n padding: 0;\n font-size: 1.6rem;\n line-height: 1.25em;\n font-weight: 200;\n letter-spacing: -0.5px;\n }\n\n li a {\n display: block;\n padding: 20px 0;\n border-bottom: rgba(255, 255, 255, 0.3) 1px solid;\n color: #fff;\n font-weight: 500;\n vertical-align: top;\n transition: opacity 0.3s ease;\n }\n\n li:first-of-type a {\n padding-top: 10px;\n }\n\n li a:hover {\n opacity: 1;\n }\n`;\n\nconst ReadNextCardFooter = styled.footer`\n position: relative;\n margin: 15px 0 3px 0;\n text-align: center;\n\n a {\n color: #fff;\n }\n`;\n\nexport interface ReadNextProps {\n tags: string[];\n relatedPosts: {\n totalCount: number;\n edges: Array<{\n node: {\n timeToRead: number;\n frontmatter: {\n title: string;\n };\n fields: {\n slug: string;\n };\n };\n }>;\n };\n}\n\nexport interface ReadNextQuery {\n header: {\n childImageSharp: {\n fluid: any;\n };\n };\n}\n\nconst ReadNextCard: React.FC<ReadNextProps> = props => {\n return (\n <StaticQuery\n query={graphql`\n query ReadNextQuery {\n header: file(relativePath: { eq: \"img/blog-cover.jpg\" }) {\n childImageSharp {\n # Specify the image processing specifications right in the query.\n # Makes it trivial to update as your page's design changes.\n fluid(maxWidth: 2000) {\n ...GatsbyImageSharpFluid\n }\n }\n }\n }\n `}\n // tslint:disable-next-line:react-this-binding-issue\n render={({ header }: ReadNextQuery) => (\n <ReadNextCardStyles coverImage={header.childImageSharp.fluid.src}>\n <ReadNextCardHeader>\n <ReadNextCardHeaderSitetitle>\n — {config.title} —\n </ReadNextCardHeaderSitetitle>\n <ReadNextCardHeaderTitle>\n <Link to={`/tags/${_.kebabCase(props.tags[0])}/`}>{props.tags[0]}</Link>\n </ReadNextCardHeaderTitle>\n </ReadNextCardHeader>\n <ReadNextDivider>\n <InfinityIcon />\n </ReadNextDivider>\n <ReadNextCardContent>\n <ul>\n {props.relatedPosts.edges.map(n => {\n return (\n <li key={n.node.frontmatter.title}>\n <Link to={n.node.fields.slug}>{n.node.frontmatter.title}</Link>\n </li>\n );\n })}\n </ul>\n </ReadNextCardContent>\n <ReadNextCardFooter>\n <Link to={`/tags/${_.kebabCase(props.tags[0])}/`}>\n {props.relatedPosts.totalCount > 1 &&\n `See all ${props.relatedPosts.totalCount} posts`}\n {props.relatedPosts.totalCount === 1 && '1 post'}\n {props.relatedPosts.totalCount === 0 && 'No posts'} →\n </Link>\n </ReadNextCardFooter>\n </ReadNextCardStyles>\n )}\n />\n );\n};\n\nexport default ReadNextCard;\n","import { graphql, Link } from 'gatsby';\nimport Img from 'gatsby-image';\nimport * as _ from 'lodash';\nimport { setLightness } from 'polished';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/core';\nimport { Helmet } from 'react-helmet';\n\nimport AuthorCard from '../components/AuthorCard';\nimport Footer from '../components/Footer';\nimport SiteNav from '../components/header/SiteNav';\nimport PostCard from '../components/PostCard';\nimport PostContent from '../components/PostContent';\nimport PostFullFooter from '../components/PostFullFooter';\nimport PostFullFooterRight from '../components/PostFullFooterRight';\nimport ReadNextCard from '../components/ReadNextCard';\nimport Subscribe from '../components/subscribe/Subscribe';\nimport Wrapper from '../components/Wrapper';\nimport IndexLayout from '../layouts';\nimport { colors } from '../styles/colors';\nimport { inner, outer, SiteHeader, SiteMain } from '../styles/shared';\nimport config from '../website-config';\n\nconst PostTemplate = css`\n .site-main {\n background: #fff;\n padding-bottom: 4vw;\n }\n .gatsby-resp-image-figcaption {\n font-size: 65%;\n background: #fec;\n line-height: 120%;\n padding: 5px;\n font-family: sans-serif;\n }\n @media (min-width: 768px) {\n .gatsby-resp-image-figcaption {\n text-align: center;\n }\n }\n`;\n\nexport const PostFull = css`\n position: relative;\n z-index: 50;\n`;\n\nexport const NoImage = css`\n .post-full-content {\n padding-top: 0;\n }\n\n .post-full-content:before,\n .post-full-content:after {\n display: none;\n }\n`;\n\nexport const PostFullHeader = styled.header`\n margin: 0 auto;\n padding: 3vw 3vw 3vw;\n max-width: 1040px;\n text-align: center;\n\n @media (max-width: 500px) {\n padding: 14vw 3vw 10vw;\n }\n`;\n\nconst PostFullMeta = styled.section`\n display: flex;\n justify-content: center;\n align-items: center;\n color: ${colors.midgrey};\n font-size: 1.4rem;\n font-weight: 600;\n text-transform: uppercase;\n\n @media (max-width: 500px) {\n font-size: 1.2rem;\n line-height: 1.3em;\n }\n`;\n\nconst PostFullMetaDate = styled.time`\n color: ${colors.blue};\n`;\n\nexport const PostFullTitle = styled.h1`\n margin: 0;\n color: ${setLightness('0.05', colors.darkgrey)};\n @media (max-width: 500px) {\n font-size: 2.9rem;\n }\n`;\n\nconst PostFullImage = styled.figure`\n margin: 0 -10vw -165px;\n height: 400px;\n background: ${colors.lightgrey} center center;\n background-size: cover;\n border-radius: 5px;\n\n @media (max-width: 1170px) {\n margin: 0 -4vw -100px;\n height: 600px;\n border-radius: 0;\n }\n\n @media (max-width: 800px) {\n height: 400px;\n }\n @media (max-width: 500px) {\n margin-bottom: 4vw;\n height: 350px;\n }\n`;\n\nconst DateDivider = styled.span`\n display: inline-block;\n margin: 0 6px 1px;\n`;\n\nconst ReadNextFeed = styled.div`\n display: flex;\n flex-wrap: wrap;\n margin: 0 -20px;\n padding: 40px 0 0 0;\n`;\n\ninterface PageTemplateProps {\n pathContext: {\n slug: string;\n };\n data: {\n logo: {\n childImageSharp: {\n fixed: any;\n };\n };\n markdownRemark: {\n html: string;\n htmlAst: any;\n excerpt: string;\n timeToRead: string;\n frontmatter: {\n title: string;\n date: string;\n userDate: string;\n image: {\n childImageSharp: {\n fluid: any;\n };\n };\n tags: string[];\n author: {\n id: string;\n bio: string;\n avatar: {\n children: Array<{\n fixed: {\n src: string;\n };\n }>;\n };\n };\n };\n };\n relatedPosts: {\n totalCount: number;\n edges: Array<{\n node: {\n timeToRead: number;\n frontmatter: {\n title: string;\n };\n fields: {\n slug: string;\n };\n };\n }>;\n };\n };\n pageContext: {\n prev: PageContext;\n next: PageContext;\n };\n}\n\nexport interface PageContext {\n excerpt: string;\n timeToRead: number;\n fields: {\n slug: string;\n };\n frontmatter: {\n image: {\n childImageSharp: {\n fluid: any;\n };\n };\n title: string;\n date: string;\n draft?: boolean;\n tags: string[];\n author: {\n id: string;\n bio: string;\n avatar: {\n children: Array<{\n fixed: {\n src: string;\n };\n }>;\n };\n };\n };\n}\n\nconst PageTemplate: React.FC<PageTemplateProps> = props => {\n const post = props.data.markdownRemark;\n let width = '';\n let height = '';\n if (post.frontmatter.image && post.frontmatter.image.childImageSharp) {\n width = post.frontmatter.image.childImageSharp.fluid.sizes.split(', ')[1].split('px')[0];\n height = String(Number(width) / post.frontmatter.image.childImageSharp.fluid.aspectRatio);\n }\n\n return (\n <IndexLayout className=\"post-template\">\n <Helmet>\n <html lang={config.lang} />\n <title>{post.frontmatter.title}</title>\n\n <meta name=\"description\" content={post.excerpt} />\n <meta property=\"og:site_name\" content={config.title} />\n <meta property=\"og:type\" content=\"article\" />\n <meta property=\"og:title\" content={post.frontmatter.title} />\n <meta property=\"og:description\" content={post.excerpt} />\n <meta property=\"og:url\" content={config.siteUrl + props.pathContext.slug} />\n {(post.frontmatter.image && post.frontmatter.image.childImageSharp) && (\n <meta property=\"og:image\" content={`${config.siteUrl}${post.frontmatter.image.childImageSharp.fluid.src}`} />\n )}\n <meta property=\"article:published_time\" content={post.frontmatter.date} />\n {/* not sure if modified time possible */}\n {/* <meta property=\"article:modified_time\" content=\"2018-08-20T15:12:00.000Z\" /> */}\n {post.frontmatter.tags && (\n <meta property=\"article:tag\" content={post.frontmatter.tags[0]} />\n )}\n\n {config.facebook && <meta property=\"article:publisher\" content={config.facebook} />}\n {config.facebook && <meta property=\"article:author\" content={config.facebook} />}\n <meta name=\"twitter:card\" content=\"summary_large_image\" />\n <meta name=\"twitter:title\" content={post.frontmatter.title} />\n <meta name=\"twitter:description\" content={post.excerpt} />\n <meta name=\"twitter:url\" content={config.siteUrl + props.pathContext.slug} />\n {(post.frontmatter.image && post.frontmatter.image.childImageSharp) && (\n <meta name=\"twitter:image\" content={`${config.siteUrl}${post.frontmatter.image.childImageSharp.fluid.src}`} />\n )}\n <meta name=\"twitter:label1\" content=\"Written by\" />\n <meta name=\"twitter:data1\" content={post.frontmatter.author.id} />\n <meta name=\"twitter:label2\" content=\"Filed under\" />\n {post.frontmatter.tags && <meta name=\"twitter:data2\" content={post.frontmatter.tags[0]} />}\n {config.twitter && <meta name=\"twitter:site\" content={`@${config.twitter.split('https://twitter.com/')[1]}`} />}\n {config.twitter && <meta\n name=\"twitter:creator\"\n content={`@${config.twitter.split('https://twitter.com/')[1]}`}\n />}\n {width && <meta property=\"og:image:width\" content={width} />}\n {height && <meta property=\"og:image:height\" content={height} />}\n </Helmet>\n <Wrapper css={PostTemplate}>\n <header css={[outer, SiteHeader]}>\n <div css={inner}>\n <SiteNav />\n </div>\n </header>\n <main id=\"site-main\" className=\"site-main\" css={[SiteMain, outer]}>\n <div css={inner}>\n {/* TODO: no-image css tag? */}\n <article css={[PostFull, !post.frontmatter.image && NoImage]}>\n <PostFullHeader>\n <PostFullMeta>\n <PostFullMetaDate dateTime={post.frontmatter.date}>\n {post.frontmatter.userDate}\n </PostFullMetaDate>\n {post.frontmatter.tags &&\n post.frontmatter.tags.length > 0 && (\n <>\n <DateDivider>/</DateDivider>\n <Link to={`/tags/${_.kebabCase(post.frontmatter.tags[0])}/`}>\n {post.frontmatter.tags[0]}\n </Link>\n </>\n )}\n </PostFullMeta>\n <PostFullTitle>{post.frontmatter.title}</PostFullTitle>\n </PostFullHeader>\n\n {(post.frontmatter.image && post.frontmatter.image.childImageSharp) && (\n <PostFullImage>\n <Img\n style={{ height: '100%' }}\n fluid={post.frontmatter.image.childImageSharp.fluid}\n />\n </PostFullImage>\n )}\n <PostContent htmlAst={post.htmlAst} />\n\n {/* The big email subscribe modal content */}\n {config.showSubscribe && <Subscribe title={config.title} />}\n\n <PostFullFooter>\n <AuthorCard author={post.frontmatter.author} />\n <PostFullFooterRight authorId={post.frontmatter.author.id} />\n </PostFullFooter>\n </article>\n </div>\n </main>\n\n {/* Links to Previous/Next posts */}\n <aside className=\"read-next\" css={outer}>\n <div css={inner}>\n <ReadNextFeed>\n {props.data.relatedPosts && (\n <ReadNextCard tags={post.frontmatter.tags} relatedPosts={props.data.relatedPosts} />\n )}\n\n {props.pageContext.prev && <PostCard post={props.pageContext.prev} />}\n {props.pageContext.next && <PostCard post={props.pageContext.next} />}\n </ReadNextFeed>\n </div>\n </aside>\n <Footer />\n </Wrapper>\n </IndexLayout>\n );\n};\n\nexport default PageTemplate;\n\nexport const query = graphql`\n query($slug: String, $primaryTag: String) {\n logo: file(relativePath: { eq: \"img/ghost-logo.png\" }) {\n childImageSharp {\n fixed {\n ...GatsbyImageSharpFixed\n }\n }\n }\n markdownRemark(fields: { slug: { eq: $slug } }) {\n html\n htmlAst\n excerpt\n timeToRead\n frontmatter {\n title\n userDate: date(formatString: \"D MMMM YYYY\")\n date\n tags\n image {\n childImageSharp {\n fluid(maxWidth: 3720) {\n ...GatsbyImageSharpFluid\n }\n }\n }\n author {\n id\n bio\n avatar {\n children {\n ... on ImageSharp {\n fixed(quality: 90) {\n ...GatsbyImageSharpFixed\n }\n }\n }\n }\n }\n }\n }\n relatedPosts: allMarkdownRemark(\n filter: { frontmatter: { tags: { in: [$primaryTag] }, draft: { ne: true } } }\n limit: 3\n ) {\n totalCount\n edges {\n node {\n id\n timeToRead\n excerpt\n frontmatter {\n title\n }\n fields {\n slug\n }\n }\n }\n }\n }\n`;\n","import IndexLayout from '../layouts';\nimport Wrapper from '../components/Wrapper';\nimport SiteNav from '../components/header/SiteNav';\nimport { SiteHeader, outer, inner, SiteMain } from '../styles/shared';\nimport * as React from 'react';\nimport { css } from '@emotion/core';\n\nimport { PostFullHeader, PostFullTitle, NoImage, PostFull } from '../templates/post';\nimport { PostFullContent } from '../components/PostContent';\nimport Footer from '../components/Footer';\nimport Helmet from 'react-helmet';\n\nconst PageTemplate = css`\n .site-main {\n background: #fff;\n padding-bottom: 4vw;\n }\n`;\n\nconst About: React.FC = () => (\n <IndexLayout>\n <Helmet>\n <title>About</title>\n </Helmet>\n <Wrapper css={PageTemplate}>\n <header css={[outer, SiteHeader]}>\n <div css={inner}>\n <SiteNav />\n </div>\n </header>\n <main id=\"site-main\" className=\"site-main\" css={[SiteMain, outer]}>\n <article className=\"post page\" css={[PostFull, NoImage]}>\n <PostFullHeader>\n <PostFullTitle>About</PostFullTitle>\n </PostFullHeader>\n\n <PostFullContent className=\"post-full-content\">\n <div className=\"post-content\">\n <p>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo finibus leo,\n non tempus magna vehicula ac. Maecenas mollis ante finibus pharetra imperdiet.\n Maecenas in aliquam purus. Nam et massa a nulla fermentum dapibus sit amet in neque.\n Ut ipsum ipsum, rhoncus a sodales pellentesque, interdum a elit. Nullam aliquam\n tellus nibh, eget laoreet dui aliquet non. Vestibulum malesuada ante at diam tempus,\n ac interdum risus scelerisque. Sed ipsum neque, vulputate porta diam eget, consequat\n blandit nulla. Integer volutpat velit vitae purus lacinia aliquam. Integer bibendum\n ipsum vitae magna pulvinar, nec vehicula dolor vulputate. Nulla eu massa id orci\n placerat finibus vel sit amet eros. Vestibulum quis consequat massa. Sed sagittis\n sollicitudin massa at commodo. Praesent diam nisi, imperdiet posuere eleifend nec,\n blandit ac massa.\n </p>\n <p>\n Vestibulum semper pretium ipsum nec congue. Ut ac eros nisi. Donec leo sem, aliquam\n mollis sapien ultrices, dapibus congue diam. Proin viverra dapibus blandit. Ut\n mauris tellus, tristique id felis vel, venenatis vestibulum nunc. Nam molestie\n pulvinar nibh, eget egestas augue. Maecenas tellus arcu, mattis ut ipsum non,\n sollicitudin convallis nunc. Donec nec neque tristique, aliquet lacus id, laoreet\n nunc. Cras dapibus nisi nulla, ullamcorper faucibus neque suscipit ac. Donec eget\n orci venenatis justo lobortis volutpat. Proin vel placerat nisl. Integer arcu nunc,\n sodales eu fringilla non, aliquam non diam. Cras placerat, massa et faucibus\n pretium, ante elit tincidunt tellus, tristique ultricies velit quam et massa.\n </p>\n <p>\n In nunc lacus, dapibus vitae lacus sit amet, efficitur iaculis neque. Suspendisse ut\n tellus quis leo vestibulum tincidunt. Aenean nec enim ac dolor lacinia semper. Ut\n sed laoreet libero. Nunc elementum sollicitudin accumsan. Nunc eu augue neque. Proin\n a tortor nibh. Cras eu nisl ornare sapien feugiat pellentesque. Mauris dignissim vel\n quam eu pellentesque. Integer sit amet posuere quam, eu ullamcorper odio. Nullam a\n lacus tempus sapien dignissim ullamcorper. In hac habitasse platea dictumst. Proin\n quis massa aliquam, feugiat tortor sit amet, tincidunt urna. Donec posuere pulvinar\n lectus, ac semper ipsum vulputate quis.\n </p>\n </div>\n </PostFullContent>\n </article>\n </main>\n <Footer />\n </Wrapper>\n </IndexLayout>\n);\n\nexport default About;\n","import { Link } from 'gatsby';\nimport Img from 'gatsby-image';\nimport * as _ from 'lodash';\nimport { lighten } from 'polished';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/core';\n\nimport { colors } from '../styles/colors';\nimport { PageContext } from '../templates/post';\n\nconst PostCardStyles = css`\n flex: 1 1 300px;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n margin: 0 20px 40px;\n min-height: 300px;\n background: #fff center center;\n background-size: cover;\n border-radius: 5px;\n box-shadow: rgba(39, 44, 49, 0.06) 8px 14px 38px, rgba(39, 44, 49, 0.03) 1px 3px 8px;\n transition: all 0.5s ease;\n\n :hover {\n box-shadow: rgba(39, 44, 49, 0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;\n transition: all 0.4s ease;\n transform: translate3D(0, -1px, 0) scale(1.02);\n }\n`;\n\nconst PostCardImageLink = css`\n position: relative;\n display: block;\n overflow: hidden;\n border-radius: 5px 5px 0 0;\n`;\n\nconst PostCardImage = styled.div`\n width: auto;\n height: 200px;\n background: ${colors.lightgrey} no-repeat center center;\n background-size: cover;\n`;\n\nconst PostCardContent = styled.div`\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n`;\n\nconst PostCardContentLink = css`\n position: relative;\n flex-grow: 1;\n display: block;\n padding: 25px 25px 0;\n color: ${colors.darkgrey};\n\n :hover {\n text-decoration: none;\n }\n`;\n\nconst PostCardTags = styled.span`\n display: block;\n margin-bottom: 4px;\n color: ${colors.midgrey};\n font-size: 1.2rem;\n line-height: 1.15em;\n font-weight: 500;\n letter-spacing: 0.5px;\n text-transform: uppercase;\n`;\n\nconst PostCardTitle = styled.h2`\n margin-top: 0;\n`;\n\nconst PostCardExcerpt = styled.section`\n font-family: Georgia, serif;\n`;\n\nconst PostCardMeta = styled.footer`\n display: flex;\n justify-content: space-between;\n align-items: flex-end;\n padding: 0 25px 25px;\n`;\n\nconst AuthorList = styled.ul`\n display: flex;\n flex-wrap: wrap-reverse;\n margin: 0;\n padding: 0;\n list-style: none;\n`;\n\nconst AuthorListItem = styled.li`\n position: relative;\n flex-shrink: 0;\n margin: 0;\n padding: 0;\n\n :nth-of-type(1) {\n z-index: 10;\n }\n :nth-of-type(2) {\n z-index: 9;\n }\n :nth-of-type(3) {\n z-index: 8;\n }\n :nth-of-type(4) {\n z-index: 7;\n }\n :nth-of-type(5) {\n z-index: 6;\n }\n :nth-of-type(6) {\n z-index: 5;\n }\n :nth-of-type(7) {\n z-index: 4;\n }\n :nth-of-type(8) {\n z-index: 3;\n }\n :nth-of-type(9) {\n z-index: 2;\n }\n :nth-of-type(10) {\n z-index: 1;\n }\n :hover .author-name-tooltip {\n opacity: 1;\n transform: translateY(0px);\n }\n`;\n\nconst AuthorNameTooltip = styled.div`\n position: absolute;\n bottom: 105%;\n z-index: 999;\n display: block;\n padding: 2px 8px;\n color: white;\n font-size: 1.2rem;\n letter-spacing: 0.2px;\n white-space: nowrap;\n background: ${colors.darkgrey};\n border-radius: 3px;\n box-shadow: rgba(39, 44, 49, 0.08) 0 12px 26px, rgba(39, 44, 49, 0.03) 1px 3px 8px;\n opacity: 0;\n transition: all 0.3s cubic-bezier(0.4, 0.01, 0.165, 0.99);\n transform: translateY(6px);\n pointer-events: none;\n\n @media (max-width: 650px) {\n display: none;\n }\n`;\n\nconst StaticAvatar = css`\n display: block;\n overflow: hidden;\n margin: 0 -5px;\n width: 34px;\n height: 34px;\n border: #fff 2px solid;\n border-radius: 100%;\n`;\n\nconst AuthorProfileImage = styled.img`\n display: block;\n width: 100%;\n height: 100%;\n /* background: color(var(--lightgrey) l(+10%)); */\n background: ${lighten('0.1', colors.lightgrey)};\n border-radius: 100%;\n object-fit: cover;\n`;\n\nconst ReadingTime = styled.span`\n flex-shrink: 0;\n margin-left: 20px;\n color: ${colors.midgrey};\n font-size: 1.2rem;\n line-height: 33px;\n font-weight: 500;\n letter-spacing: 0.5px;\n text-transform: uppercase;\n`;\n\nexport interface PostCardProps {\n post: PageContext;\n}\n\nconst PostCard: React.FC<PostCardProps> = ({ post }) => {\n return (\n <article\n className={`post-card ${post.frontmatter.image ? '' : 'no-image'}`}\n css={PostCardStyles}\n >\n {post.frontmatter.image && (\n <Link className=\"post-card-image-link\" css={PostCardImageLink} to={post.fields.slug}>\n <PostCardImage className=\"post-card-image\">\n {post.frontmatter.image &&\n post.frontmatter.image.childImageSharp &&\n post.frontmatter.image.childImageSharp.fluid && (\n <Img\n alt={`${post.frontmatter.title} cover image`}\n style={{ height: '100%' }}\n fluid={post.frontmatter.image.childImageSharp.fluid}\n />\n )}\n </PostCardImage>\n </Link>\n )}\n <PostCardContent className=\"post-card-content\">\n <Link className=\"post-card-content-link\" css={PostCardContentLink} to={post.fields.slug}>\n <header className=\"post-card-header\">\n {post.frontmatter.tags && <PostCardTags>{post.frontmatter.tags[0]}</PostCardTags>}\n <PostCardTitle>{post.frontmatter.title}</PostCardTitle>\n </header>\n <PostCardExcerpt>\n <p>{post.excerpt}</p>\n </PostCardExcerpt>\n </Link>\n <PostCardMeta className=\"post-card-meta\">\n <AuthorList>\n <AuthorListItem>\n <AuthorNameTooltip className=\"author-name-tooltip\">\n {post.frontmatter.author.id}\n </AuthorNameTooltip>\n <Link css={StaticAvatar} to={`/author/${_.kebabCase(post.frontmatter.author.id)}/`}>\n <AuthorProfileImage\n src={post.frontmatter.author.avatar.children[0].fixed.src}\n alt={post.frontmatter.author.id}\n />\n </Link>\n </AuthorListItem>\n </AuthorList>\n <ReadingTime>{post.timeToRead} min read</ReadingTime>\n </PostCardMeta>\n </PostCardContent>\n </article>\n );\n};\n\nexport default PostCard;\n","import { lighten, setLightness, darken, setSaturation } from 'polished';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport RehypeReact from 'rehype-react';\n\nimport { colors } from '../styles/colors';\n\nexport const PostFullContent = styled.section`\n position: relative;\n margin: 0 auto;\n padding: 70px 50px 0;\n min-height: 230px;\n font-family: Georgia, serif;\n font-size: 2.0rem;\n line-height: 1.6em;\n background: #fff;\n\n @media (max-width: 1170px) {\n padding: 5vw 7vw 0;\n }\n @media (max-width: 800px) {\n font-size: 1.9rem;\n }\n\n :before {\n content: '';\n position: absolute;\n top: 15px;\n left: -5px;\n z-index: -1;\n display: block;\n width: 20px;\n height: 200px;\n background: rgba(39, 44, 49, 0.15);\n filter: blur(5px);\n transform: rotate(-5deg);\n }\n\n :after {\n content: '';\n position: absolute;\n top: 15px;\n right: -5px;\n z-index: -1;\n display: block;\n width: 20px;\n height: 200px;\n background: rgba(39, 44, 49, 0.15);\n filter: blur(5px);\n transform: rotate(5deg);\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p,\n ul,\n ol,\n dl,\n pre,\n blockquote,\n .post-full-comments,\n .footnotes {\n min-width: 100%;\n }\n\n li {\n word-break: break-word;\n }\n\n li p {\n margin: 0;\n }\n\n a {\n color: #000;\n word-break: break-word;\n box-shadow: ${colors.blue} 0 -1px 0 inset;\n }\n\n a:hover {\n color: ${colors.blue};\n text-decoration: none;\n }\n\n strong,\n em {\n /* color: color(var(--darkgrey) l(-5%)); */\n color: ${darken('0.05', colors.darkgrey)};\n }\n\n small {\n display: inline-block;\n line-height: 1.6em;\n }\n\n li:first-child {\n margin-top: 0;\n }\n\n .gatsby-resp-image-link {\n box-shadow: none;\n }\n\n img,\n video {\n display: block;\n margin: 1.5em auto;\n max-width: 1040px;\n height: auto;\n }\n\n @media (max-width: 1040px) {\n img,\n video {\n width: 100%;\n }\n }\n\n img[src$='#full'] {\n max-width: none;\n width: 100vw;\n }\n\n img + br + small {\n display: block;\n margin-top: -3em;\n margin-bottom: 1.5em;\n text-align: center;\n }\n\n /* Override third party iframe styles */\n iframe {\n margin: 0 auto !important;\n }\n\n blockquote {\n margin: 0 0 1.5em;\n padding: 0 1.5em;\n border-left: #3eb0ef 3px solid;\n }\n\n blockquote p {\n margin: 0 0 1em 0;\n color: inherit;\n font-size: inherit;\n line-height: inherit;\n font-style: italic;\n }\n\n blockquote p:last-child {\n margin-bottom: 0;\n }\n\n code {\n padding: 0 5px 2px;\n font-size: 0.8em;\n line-height: 1em;\n font-weight: 400 !important;\n background: ${colors.whitegrey};\n border-radius: 3px;\n }\n\n p code {\n word-break: break-all;\n }\n\n pre {\n overflow-x: auto;\n /* margin: 1.5em 0 3em; */\n padding: 20px;\n max-width: 100%;\n /* border: color(var(--darkgrey) l(-10%)) 1px solid; */\n border: ${darken('0.01', colors.darkgrey)} 1px solid;\n color: ${colors.whitegrey};\n font-size: 1.4rem;\n line-height: 1.5em;\n /* background: color(var(--darkgrey) l(-3%)); */\n background: ${darken('0.03', colors.darkgrey)};\n border-radius: 5px;\n }\n\n pre code {\n padding: 0;\n font-size: inherit;\n line-height: inherit;\n background: transparent;\n }\n\n pre code :not(span) {\n color: inherit;\n }\n\n /* .fluid-width-video-wrapper { */\n .gatsby-resp-iframe-wrapper {\n margin: 1.5em 0 3em;\n }\n\n hr {\n margin: 4vw 0;\n }\n\n hr:after {\n content: '';\n position: absolute;\n top: -15px;\n left: 50%;\n display: block;\n margin-left: -10px;\n width: 1px;\n height: 30px;\n /* background: color(var(--lightgrey) l(+10%)); */\n background: ${lighten('0.1', colors.lightgrey)};\n box-shadow: #fff 0 0 0 5px;\n transform: rotate(45deg);\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n color: ${setLightness('0.05', colors.darkgrey)};\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,\n 'Open Sans', 'Helvetica Neue', sans-serif;\n }\n\n h1 {\n margin: 0.5em 0 0.2em 0;\n font-size: 4.6rem;\n font-weight: 700;\n }\n @media (max-width: 500px) {\n h1 {\n font-size: 2.8rem;\n }\n }\n\n h2 {\n margin: 0.5em 0 0.2em 0;\n font-size: 3.6rem;\n font-weight: 700;\n }\n @media (max-width: 500px) {\n h2 {\n font-size: 2.6rem;\n }\n }\n\n h3 {\n margin: 0.5em 0 0.2em 0;\n font-size: 2.8rem;\n font-weight: 700;\n }\n @media (max-width: 500px) {\n h3 {\n font-size: 2.2rem;\n }\n }\n\n h4 {\n margin: 0.5em 0 0.2em 0;\n font-size: 2.8rem;\n font-weight: 700;\n }\n @media (max-width: 500px) {\n h4 {\n font-size: 2.2rem;\n }\n }\n\n h5 {\n display: block;\n margin: 0.5em 0;\n padding: 1em 0 1.5em;\n border: 0;\n color: ${colors.blue};\n font-family: Georgia, serif;\n font-size: 3.2rem;\n line-height: 1.35em;\n text-align: center;\n }\n @media (min-width: 1180px) {\n h5 {\n max-width: 1060px;\n }\n }\n @media (max-width: 500px) {\n h5 {\n padding: 0 0 0.5em;\n font-size: 2.2rem;\n }\n }\n\n h6 {\n margin: 0.5em 0 0.2em 0;\n font-size: 2.3rem;\n font-weight: 700;\n }\n @media (max-width: 500px) {\n h6 {\n font-size: 2rem;\n }\n }\n\n /* Tables */\n table {\n display: inline-block;\n overflow-x: auto;\n margin: 0.5em 0 2.5em;\n max-width: 100%;\n width: auto;\n border-spacing: 0;\n border-collapse: collapse;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,\n 'Open Sans', 'Helvetica Neue', sans-serif;\n font-size: 1.6rem;\n white-space: nowrap;\n vertical-align: top;\n }\n\n table {\n -webkit-overflow-scrolling: touch;\n background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0\n center,\n radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 100% center;\n background-attachment: scroll, scroll;\n background-size: 10px 100%, 10px 100%;\n background-repeat: no-repeat;\n }\n\n table td:first-child {\n background-image: linear-gradient(\n to right,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-size: 20px 100%;\n background-repeat: no-repeat;\n }\n\n table td:last-child {\n background-image: linear-gradient(\n to left,\n rgba(255, 255, 255, 1) 50%,\n rgba(255, 255, 255, 0) 100%\n );\n background-position: 100% 0;\n background-size: 20px 100%;\n background-repeat: no-repeat;\n }\n\n table th {\n color: ${colors.darkgrey};\n font-size: 1.2rem;\n font-weight: 700;\n letter-spacing: 0.2px;\n text-align: left;\n text-transform: uppercase;\n /* background-color: color(var(--whitegrey) l(+4%)); */\n background-color: ${lighten('0.04', colors.whitegrey)};\n }\n\n table th,\n table td {\n padding: 6px 12px;\n /* border: color(var(--whitegrey) l(-1%) s(-5%)) 1px solid; */\n border: ${setSaturation('0.05', darken('0.01', colors.whitegrey))} 1px solid;\n text-align: left !important;\n }\n\n @media (max-width: 500px) {\n padding: 0;\n :before {\n display: none;\n }\n :after {\n display: none;\n }\n }\n\n /* Start Syntax Highlighting */\n /* Taken from overreacted https://github.com/gaearon/overreacted.io/blob/942b41555f5e5ccbb5f93f6c26142cd90b314236/src/utils/global.css#L68 */\n code[class*='language-'],\n pre[class*='language-'] {\n background: none;\n font-family: Consolas, Menlo, Monaco, source-code-pro, Courier New, monospace;\n font-feature-settings: normal;\n text-align: left;\n white-space: pre;\n word-spacing: normal;\n word-break: normal;\n word-wrap: normal;\n line-height: 1.5;\n margin-bottom: 0;\n\n -moz-tab-size: 4;\n -o-tab-size: 4;\n tab-size: 4;\n\n -webkit-hyphens: none;\n -moz-hyphens: none;\n -ms-hyphens: none;\n hyphens: none;\n }\n\n /* Code blocks */\n pre[class*='language-'] {\n overflow: auto;\n padding: 1.3125rem;\n }\n\n pre[class*='language-']::-moz-selection {\n /* Firefox */\n background: hsl(207, 4%, 16%);\n }\n\n pre[class*='language-']::selection {\n /* Safari */\n background: hsl(207, 4%, 16%);\n }\n\n /* Text Selection colour */\n pre[class*='language-']::-moz-selection,\n pre[class*='language-'] ::-moz-selection {\n text-shadow: none;\n background: hsla(0, 0%, 100%, 0.15);\n }\n\n pre[class*='language-']::selection,\n pre[class*='language-'] ::selection {\n text-shadow: none;\n background: hsla(0, 0%, 100%, 0.15);\n }\n\n /* Inline code */\n :not(pre) > code[class*='language-'] {\n border-radius: 0.3em;\n background: var(--inlineCode-bg);\n color: var(--inlineCode-text);\n padding: 0.15em 0.2em 0.05em;\n white-space: normal;\n }\n\n .token.attr-name {\n color: rgb(173, 219, 103);\n font-style: italic;\n }\n\n .token.comment {\n color: rgb(128, 147, 147);\n }\n\n .token.string,\n .token.url {\n color: rgb(173, 219, 103);\n }\n\n .token.variable {\n color: rgb(214, 222, 235);\n }\n\n .token.number {\n color: rgb(247, 140, 108);\n }\n\n .token.builtin,\n .token.char,\n .token.constant,\n .token.function {\n color: rgb(130, 170, 255);\n }\n\n .token.punctuation {\n color: rgb(199, 146, 234);\n }\n\n .token.selector,\n .token.doctype {\n color: rgb(199, 146, 234);\n font-style: 'italic';\n }\n\n .token.class-name {\n color: rgb(255, 203, 139);\n }\n\n .token.tag,\n .token.operator,\n .token.keyword {\n color: #ffa7c4;\n }\n\n .token.boolean {\n color: rgb(255, 88, 116);\n }\n\n .token.property {\n color: rgb(128, 203, 196);\n }\n\n .token.namespace {\n color: rgb(178, 204, 214);\n }\n\n pre[data-line] {\n padding: 1em 0 1em 3em;\n position: relative;\n }\n\n .gatsby-highlight-code-line {\n background-color: hsla(207, 95%, 15%, 1);\n display: block;\n margin-right: -1.3125rem;\n margin-left: -1.3125rem;\n padding-right: 1em;\n padding-left: 1.25em;\n border-left: 0.25em solid #ffa7c4;\n }\n\n .gatsby-highlight {\n margin-bottom: 1.75rem;\n margin-left: -1.3125rem;\n margin-right: -1.3125rem;\n border-radius: 10px;\n background: #011627;\n -webkit-overflow-scrolling: touch;\n overflow: auto;\n }\n\n @media (max-width: 672px) {\n .gatsby-highlight {\n border-radius: 0;\n }\n }\n\n .gatsby-highlight pre[class*='language-'] {\n float: left;\n min-width: 100%;\n }\n /* End Syntax Highlighting */\n\n p small {\n display: block !important;\n text-align: center;\n }\n`;\n\nconst renderAst = new RehypeReact({\n createElement: React.createElement,\n // components: { 'interactive-counter': Counter },\n components: {},\n}).Compiler;\n\nconst Ast = ({ ast, ...props }: any) => {\n ast.properties = props;\n return renderAst(ast);\n};\n\nexport interface PostContentProps {\n htmlAst: any;\n}\n\nconst PostContent: React.FC<PostContentProps> = ({ htmlAst }) => {\n return (\n <PostFullContent className=\"post-full-content\">\n {/* TODO: this will apply the class when rehype-react is published https://github.com/rhysd/rehype-react/pull/11 */}\n <Ast className=\"post-content\" ast={htmlAst} />\n </PostFullContent>\n );\n};\n\nexport default PostContent;\n","import { lighten } from 'polished';\nimport * as React from 'react';\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/core';\n\nimport { colors } from '../../styles/colors';\nimport SubscribeForm from './SubscribeForm';\n\n\nconst SubscribeFormSection = styled.section`\n margin: 1.5em 0;\n padding: 6.5vw 7vw 7vw;\n /* border: color(var(--whitegrey) l(+2%)) 1px solid; */\n border: ${lighten('0.02', colors.whitegrey)} 1px solid;\n text-align: center;\n /* background: color(var(--whitegrey) l(+4%)); */\n background: ${lighten('0.04', colors.whitegrey)};\n border-radius: 7px;\n\n p {\n margin-bottom: 1em;\n color: ${colors.midgrey};\n font-size: 2.2rem;\n line-height: 1.55em;\n letter-spacing: 0.2px;\n }\n\n form {\n display: flex;\n justify-content: center;\n align-items: center;\n margin: 0 auto;\n max-width: 420px;\n }\n\n .form-group {\n flex-grow: 1;\n }\n @media (max-width: 650px) {\n p {\n font-size: 1.6rem;\n }\n }\n`;\n\nconst SubscribeFormTitle = css`\n margin: 0 0 3px 0;\n padding: 0;\n color: ${colors.darkgrey};\n font-size: 3.5rem;\n line-height: 1;\n font-weight: 700;\n @media (max-width: 650px) {\n font-size: 2.4rem;\n }\n`;\n\nexport interface SubscribeProps {\n title: string;\n}\n\nconst Subscribe: React.FC<SubscribeProps> = props => {\n return (\n <SubscribeFormSection>\n <h3 css={SubscribeFormTitle}>Subscribe to {props.title}</h3>\n <p>Get the latest posts delivered right to your inbox</p>\n <SubscribeForm />\n </SubscribeFormSection>\n );\n};\n\nexport default Subscribe;\n"],"sourceRoot":""}