https://webkid.io/component---src-templates-blog-post-js-7f350ed9d3f665b4433b.js

1(self.webpackChunkwbkd_gatsby=self.webpackChunkwbkd_gatsby||[]).push([[2989],{1886:function(e,t,r){"use strict";r.r(t),r.d(t,{default:function(){return z}});var o=r(6156),n=r(1574),i=r(7294),a=r(5444),s=r(8981),c=r(6802),l=r(7821),g=r(1721),u=r(9923),p=r(3311),d=r(1641),m=r(923),f=r(453),h=r(8560),b=r(3497),x=r(9394),j=r(2122),v=r(3153),y=r(120),w=r(4382);function k(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,o)}return r}function O(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?k(Object(r),!0).forEach((function(t){(0,o.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):k(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var X=(0,n.Z)("div",{target:"e1jv8gk4"})(">*{max-width:620px;margin-left:auto!important;margin-right:auto!important;width:100%;padding-left:",(0,m.XJ)(3),";padding-right:",(0,m.XJ)(3),";box-sizing:border-box;}",d.xv,"{margin-bottom:",(0,m.XJ)(3),";margin-top:",(0,m.XJ)(3),";code{background:rgb(246, 248, 250);border-radius:2px;padding:0 3px;}}ul,ol{padding-left:",(0,m.XJ)(5),";}li{margin-bottom:",(0,m.XJ)(2),";}hr{max-width:calc(680px - 32px);}h1{margin-top:",(0,m.XJ)(6),";}h2{margin-top:",(0,m.XJ)(5),";}h3{margin-top:",(0,m.XJ)(4),";}h4{margin-top:",(0,m.XJ)(3),";}h1,h2,h3,h4,h5{a {color:",(function(e){return e.theme.colors.text}),";}}iframe{display:block;width:100%;}.gatsby-resp-image-wrapper{border:1px solid ",(function(e){return e.theme.colors.silver}),";border-radius:2px;overflow:hidden;margin-bottom:",(0,m.XJ)(5),";margin-top:",(0,m.XJ)(5),";}em{.gatsby-resp-image-figure{margin:0;}.gatsby-resp-image-wrapper{margin:20px 0;}.gatsby-resp-image-figcaption{font-style:normal;}}.gatsby-resp-image-figure{max-width:1200px;}.gatsby-resp-image-figcaption{color:",(function(e){return e.theme.colors.textLight}),";margin-top:-",(0,m.XJ)(5),";text-align:center;}a:hover{opacity:0.6;}"),P={h1:(0,n.Z)(d.H1,{target:"e1jv8gk3"})("margin:",(0,m.XJ)(6)," 0 ",(0,m.XJ)(3)," 0;"),h2:(0,n.Z)(d.H2,{target:"e1jv8gk2"})("margin:",(0,m.XJ)(6)," 0 ",(0,m.XJ)(3)," 0;"),h3:(0,n.Z)(d.H3,{target:"e1jv8gk1"})("margin:",(0,m.XJ)(6)," 0 ",(0,m.XJ)(3)," 0;"),h4:(0,n.Z)(d.H4,{target:"e1jv8gk0"})("margin:",(0,m.XJ)(6)," 0 ",(0,m.XJ)(3)," 0;"),p:d.xv,pre:function(e){return(0,w.jsx)("div",e)},code:function(e){var t=e.children,r=e.className,o=(void 0===r?"javascript":r).replace(/language-/,"");return(0,w.jsx)(v.ZP,(0,j.Z)({},v.lG,{theme:y.Z,code:t,language:o}),(function(e){var t=e.className,r=e.style,o=e.tokens,n=e.getLineProps,i=e.getTokenProps;return(0,w.jsx)("pre",{className:t,style:O(O({},r),{},{overflowX:"auto",padding:"20px",borderRadius:"6px",margin:"40px 0 40px 0",fontSize:14})},o.filter((function(e){return e.some((function(e){return e.content}))})).map((function(e,t){return(0,w.jsx)("div",(0,j.Z)({key:t},n({line:e,key:t})),e.map((function(e,t){return(0,w.jsx)("span",(0,j.Z)({key:t},i({token:e,key:t})))})))})))}))}},Z=function(e){var t=e.content,r=void 0===t?null:t;return(0,w.jsx)(b.MDXProvider,{components:P},(0,w.jsx)(X,null,(0,w.jsx)(x.MDXRenderer,null,r)))};function J(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,o)}return r}function D(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?J(Object(r),!0).forEach((function(t){(0,o.Z)(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):J(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var I=(0,n.Z)(s.x,{target:"euhfhka4"})("background:",(function(e){return e.theme.colors.silverLighten60}),";.swiper-wrapper{height:350px;}"),S="620px",W=(0,n.Z)(s.x,{target:"euhfhka3"})("background-image:url(",(function(e){return(0,c.e)(e.image.childImageSharp.gatsbyImageData)}),");background-size:cover;transition:filter 300ms;filter:opacity(0.6) drop-shadow(0 0 0 ",(function(e){return e.theme.colors[e.color]}),");"),H=(0,n.Z)(s.x,{target:"euhfhka2"})("color:",(function(e){return e.theme.colors[e.color]}),";font-weight:700;margin-top:auto;"),B=(0,n.Z)(s.k,{target:"euhfhka1"})("height:100%;border:1px solid ",(0,m.pe)("silver"),";color:",(function(e){return e.theme.colors.text}),";&:hover{",W,"{filter:opacity(0.8) drop-shadow(0 0 0 ",(function(e){return e.theme.colors[e.color]}),");}",H,"{opacity:0.6;}}"),C=(0,n.Z)(d.H3,{target:"euhfhka0"})({name:"cfjpzu",styles:"margin:0px"}),R=function(e){var t=e.slug,r=e.title,o=e.excerpt,n=e.category,i=e.categoryColor,c=e.featuredImage;return(0,w.jsx)(a.Link,{to:t},(0,w.jsx)(B,{color:i},(0,w.jsx)(s.k,{p:4,bg:"white",flexDirection:"column"},(0,w.jsx)(d.xv,{fontWeight:400,color:i},n),(0,w.jsx)(C,{as:"div"},r),(0,w.jsx)(d.xv,{my:3},o),(0,w.jsx)(H,{color:i},"Read more")),c&&(0,w.jsx)(W,{color:i,minWidth:["50px","100px"],image:c})))},z=function(e){var t,r,o,n,a,s,c,b,x,j,v=e.data,y=(0,i.useRef)(),k=(s="undefined"!=typeof window?window.innerWidth:0)<=768?1:s<=1e3?1.5:s<=1400?2:3,O=(0,h.Z)({domNode:y,slidesPerView:k,spaceBetween:16}),X=v.content,P=v.related,J=X.frontmatter,W=J.title,H=J.date,B=J.image,C=J.tags,z=J.author,E=J.featuredImage,L=J.showFeaturedImage,N=J.featuredImageAttribution,M=(0,m.sp)(C),V=P.edges.map((function(e){var t=e.node;return D(D(D({},t.fields),t.frontmatter),{},{id:t.fields.slug,category:(0,f.BV)(t.frontmatter.tags),categoryColor:M,excerpt:t.frontmatter.excerpt||t.excerpt})})),_={title:W+" - webkid blog",author:"Webkid",twitterUsername:"@webk1d",description:X.excerpt,siteUrl:"https://webkid.io"+X.fields.slug,robots:"index,follow",isBlog:!0};null!=E&&null!==(t=E.childImageSharp)&&void 0!==t&&null!==(r=t.gatsbyImageData)&&void 0!==r&&null!==(o=r.images)&&void 0!==o&&null!==(n=o.fallback)&&void 0!==n&&n.src&&(_.image=null==E||null===(c=E.childImageSharp)||void 0===c||null===(b=c.gatsbyImageData)||void 0===b||null===(x=b.images)||void 0===x||null===(j=x.fallback)||void 0===j?void 0:j.src);return(0,w.jsx)(l.Z,{theme:"light",metaTags:_},(0,w.jsx)(g.Z,{maxWidth:S,ref:y},(0,w.jsx)(u.h4,{title:W,date:H,image:B,tags:C,author:z}

1)),L&&(0,w.jsx)(u.Q_,{bgColor:M,image:null==E||null===(a=E.childImageSharp)||void 0===a?void 0:a.gatsbyImageData,attribution:N}),(0,w.jsx)(Z,{contentMaxWidth:S,content:X.body}),V.length>0&&(0,w.jsx)(I,{pt:3,pb:5,mt:[4,5]},(0,w.jsx)(g.Z,{maxWidth:S},(0,w.jsx)(d.H2,{as:"div"},"Further Reading")),null!==O&&(0,w.jsx)(p.Z,{slidesPerView:k,slidesOffsetBefore:O,spaceBetween:16,centeredSlides:!0,items:V,SlideItem:R})))}}}]);
2//# sourceMappingURL=component---src-templates-blog-post-js-7f350ed9d3f665b4433b.js.map