text: (window.webpackJsonp=window.webpackJsonp||[]).push([[4],{211:function(e,t,a){"use strict";a.r(t);var i=a(0),n=a.n(i),r=a(207),s=(a(213),a(215),a(102),function(e){return n.a.createElement("div",{className:"project"},n.a.createElement("div",{className:"container project__border"},n.a.createElement("a",{href:e.link,target:"blank"}," ",n.a.createElement("img",{className:"project__img",src:e.image,alt:""})," "),n.a.createElement("a",{className:"project__title",href:e.link,target:"blank"}," ",e.title," "),n.a.createElement("p",{className:"project__description"}," ",e.description," "),n.a.createElement("a",{className:"project__link",href:e.github,target:"blank"}," Code on GitHub → ")))}),c=(a(216),a(217)),l=a.n(c),o=function(e){return n.a.createElement("div",{className:"tech"},n.a.createElement("div",{className:"container"},n.a.createElement("h1",{className:"tech__title"}," Technologies "),n.a.createElement("div",{className:"tech__content"},n.a.createElement("div",{className:"tech__logos"},n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon1})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon2})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon3})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon4})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon5})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon6})),n.a.createElement("svg",{className:"tech__logo"},n.a.createElement("use",{xlinkHref:l.a+"#"+e.icon7}))),n.a.createElement("p",{className:"tech__text"},"This portfolio website is built using a static site generator for React.js ",n.a.createElement("img",{className:"tech__text-img",src:"data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNDcgNDIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZm9jdXNhYmxlPSJmYWxzZSI+CiAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSkiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICA8cGF0aCBkPSJNMzAuNSAzNS40NTRjLTMuMTMgMS44MDgtMTAuMjkzLTMuODI3LTE1LjU2Mi0xMi45NTQtNS4yNy05LjEyNy02LjU3LTE4LjE0Ny0zLjQzOC0xOS45NTRDMTQuNjMuNzM4IDIxLjc5MyA2LjM3MyAyNy4wNjIgMTUuNWM1LjI3IDkuMTI3IDYuNTcgMTguMTQ3IDMuNDM4IDE5Ljk1NHptMSAxLjczM2M0LjUyMi0yLjYxIDMuMDctMTIuNjgyLTIuNzA2LTIyLjY4N1MxNS4wMjItMS43OTcgMTAuNS44MTNDNS45NzggMy40MjMgNy40MyAxMy40OTUgMTMuMjA2IDIzLjVTMjYuOTc4IDM5Ljc5NyAzMS41IDM3LjE4N3oiIGZpbGw9IiM2MzkiLz4KICAgIDxwYXRoIGQ9Ik0wIDE5YzAgNS4yMiA5LjQ0OCA5IDIxIDlzMjEtMy43OCAyMS05YzAtNS4yMi05LjQ0OC05LTIxLTlTMCAxMy43OCAwIDE5em0yIDBjMC0zLjYxNiA4LjQ2LTcgMTktN3MxOSAzLjM4NCAxOSA3LTguNDYgNy0xOSA3LTE5LTMuMzg0LTE5LTd6IiBmaWxsPSIjNjM5Ii8+CiAgICA8cGF0aCBkPSJNMjguNzk0IDIzLjVDMzQuNTcgMTMuNDk1IDM2LjAyMiAzLjQyNCAzMS41LjgxMyAyNi45NzgtMS43OTcgMTguOTgyIDQuNDk1IDEzLjIwNiAxNC41IDcuNDMgMjQuNTA1IDUuOTc4IDM0LjU3NiAxMC41IDM3LjE4N2M0LjUyMiAyLjYxIDEyLjUxOC0zLjY4MiAxOC4yOTQtMTMuNjg3em0tMTMuODU2LThDMjAuMjA4IDYuMzczIDI3LjM2OC43MzggMzAuNSAyLjU0NmMzLjEzIDEuODA3IDEuODMyIDEwLjgyNy0zLjQzOCAxOS45NTQtNS4yNyA5LjEyNy0xMi40MyAxNC43NjItMTUuNTYyIDEyLjk1NC0zLjEzLTEuODA3LTEuODMyLTEwLjgyNyAzLjQzOC0xOS45NTR6IiBmaWxsPSIjNjM5Ii8+CiAgICA8cmVjdCBmaWxsPSIjZmZiMjM4IiB4PSIxNyIgeT0iMTUiIHdpZHRoPSI4IiBoZWlnaHQ9IjgiIHJ4PSI0Ii8+CiAgPC9nPgo8L3N2Zz4K",alt:""})," - Gatsby, with it's pre-configured most performant Webpack ",n.a.createElement("img",{className:"tech__text-img",src:"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA3NzQgODc1LjciIGZvY3VzYWJsZT0iZmFsc2UiPgogIDxwYXRoIGZpbGw9IiM2MzkiIGQ9Ik0zODcgMGwzODcgMjE4Ljl2NDM3LjlMMzg3IDg3NS43IDAgNjU2LjhWMjE4LjlMMzg3IDB6Ii8+CiAgPHBhdGggZmlsbD0iI2ZmZiIgZD0iTTcwNC45IDY0MS43TDM5OS44IDgxNC4zVjY3OS45bDE5MC4xLTEwNC42IDExNSA2Ni40em0yMC45LTE4LjlWMjYxLjlsLTExMS42IDY0LjV2MjMybDExMS42IDY0LjR6TTY3LjkgNjQxLjdMMzczIDgxNC4zVjY3OS45TDE4Mi44IDU3NS4zIDY3LjkgNjQxLjd6TTQ3IDYyMi44VjI2MS45bDExMS42IDY0LjV2MjMyTDQ3IDYyMi44em0xMy4xLTM4NC4zTDM3MyA2MS41djEyOS45TDE3Mi41IDMwMS43bC0xLjYuOS0xMTAuOC02NC4xem02NTIuNiAwbC0zMTIuOS0xNzd2MTI5LjlsMjAwLjUgMTEwLjIgMS42LjkgMTEwLjgtNjR6Ii8+CiAgPHBhdGggZmlsbD0iI2ZmYjIzOCIgZD0iTTM3MyA2NDkuM0wxODUuNCA1NDYuMVYzNDEuOEwzNzMgNDUwLjF2MTk5LjJ6bTI2LjggMGwxODcuNi0xMDMuMVYzNDEuOEwzOTkuOCA0NTAuMXYxOTkuMnpNMTk4LjEgMzE4LjJsMTg4LjMtMTAzLjUgMTg4LjMgMTAzLjUtMTg4LjMgMTA4LjctMTg4LjMtMTA4Ljd6Ii8+Cjwvc3ZnPgo=",alt:""}),".  All the previous projects have been created using HTML5, CSS3 and JavaScript. All the dependencies have been installed using node package manager(npm) and all files were combined and injected into appropriate project folders using a task runner - gulp."),n.a.createElement("p",{className:"tech__text"},"Fontination: In the font combination page, the DOM event is defined to change the text content to try the fonts displayed."),n.a.createElement("p",{className:"tech__text"},"Gradient :The DOM manipulation event has been defined to modify and copy the code to paste in the stylesheet."),n.a.createElement("p",{className:"tech__text"},"Currently I am diving deep into advanced concepts of Javascript, and exploring the framework called react. At the same time, I have been keeping myself abreast with the ever improving developers’ world using various platforms such as Medium, Youtube, podcasts and email subscriptions."))))},d=(a(218),function(){return n.a.createElement("div",{className:"gallery"},n.a.createElement("div",{className:"gallery__wrapper"},n.a.createElement("img",{src:a(219),alt:"",className:"gallery__pic"}),n.a.createElement("img",{src:a(220),alt:"",className:"gallery__pic gallery__pic-lands"}),n.a.createElement("img",{src:a(221),alt:"",className:"gallery__pic gallery__pic-lands"}),n.a.createElement("img",{src:a(222),alt:"",className:"gallery__pic"}),n.a.createElement("img",{src:a(223),alt:"",className:"gallery__pic"}),n.a.createElement("img",{src:a(224),alt:"",className:"gallery__pic gallery__pic-lands"})))}),u=a(209),g=(a(225),a(226),a(208)),f=(a(228),function(e){return n.a.createElement("div",{className:"container"},n.a.createElement("div",{className:"mixtape"},n.a.createElement("img",{className:"mixtape__image",src:e.image,alt:"album-cover"}),n.a.createElement("h1",{className:"mixtape__title"},e.title),n.a.createElement("p",{className:"mixtape__text"},e.text),n.a.createElement("a",{className:"mixtape__link",href:e.link,target:"blank"}," Listen now ")))}),m=a(55),p=a(145),h=(a(229),function(){return n.a.createElement("div",{className:"noise-wrapper"},n.a.createElement("div",null,n.a.createElement(p.a,null)),n.a.createElement("div",{className:"hero container"},n.a.createElement("div",{className:"hero__heading"},"Front-end developer"),n.a.createElement("div",{className:"hero__subheading"},"Designer"),n.a.createElement("p",{className:"hero__text"},"Hello. I’m Tausif - a developer, designer and photographer based in London."),n.a.createElement(m.a,{className:"hero__link",to:"me"}," Learn more → ")))});t.default=function(){return n.a.createElement(r.a,null,n.a.createElement(g.a,{title:"Home"}),n.a.createElement(h,null),n.a.createElement("div",{id:"projects"},n.a.createElement(s,{title:"Steel Beauty",link:"http://steelbeauty.london/",image:a(230),description:"Designed and Developed fully functional responsive website based on Business Requirements using HTML5, CSS3(SASS), JavaScript and JQuery, along with branding. Researched industry trends and websites to provide top quality design,  developed a website mock-ups to ensure quality control and client satisfaction before project development phase.  Executed and monitored standards for user interfaces, page design and graphics development.",github:"https://github.com/tausifpatel/steelbeauty"}),n.a.createElement(s,{title:"Fontination",link:"https://tausifpatel.github.io/fontination/",image:a(231),description:"Typography of a website is a very crucial component of its design. It plays an important role expressing message the website wants to convey. From the the UX design perspective, good typography undoubtedly plays a central part. Find some of my favourite google font combinations to make your wesbites standout.",github:"https://github.com/tausifpatel/fontination"}),n.a.createElement(s,{title:"Gradients",link:"https://tausifpatel.github.io/gradients/",image:a(232),description:"Gradients made a comeback in recent years and the trend is expected to be continued, yet diversified. More gradient innovations can be discovered on many modern websites, particularly with the use of bright and vivid colours in combination with a variety of textures. Gradients 2.0 will also include dual tone effects. I have displayed some of my favourite gradients. Pick the css code for the gradient of your choice or modify colors and grab the code. ",github:"https://github.com/tausifpatel/gradients"})),n.a.createElement("div",null,n.a.createElement(o,{icon1:"icon-html5-brands",icon2:"icon-css3-alt-brands",icon3:"icon-js-square-brands",icon4:"icon-react-brands",icon5:"icon-bootstrap-brands",icon6:"icon-figma-brands",icon7:"icon-gulp-brands"})),n.a.createElement("div",null,n.a.createElement(d,null)),n.a.createElement("div",null,n.a.createElement(f,{image:a(233),title:"silver",text:"A collection of some cool tracks",link:"https://open.spotify.com/user/z5r8vo6c3p8rmnbpu3gsg685u/playlist/3ACGKpGIyyVW1dYfTgD5sc?si=niy03wpUQNmKbdK0plOxDw"})),n.a.createElement("div",null,n.a.createElement(u.a,null)))}},213:function(e,t,a){"use strict";a(214)("link",(function(e){return function(t){return e(this,"a","href",t)}}))},214:function(e,t,a){var i=a(1),n=a(8),r=a(36),s=/"/g,c=function(e,t,a,i){var n=String(r(e)),c="<"+t;return""!==a&&(c+=" "+a+'="'+String(i).replace(s,"&quot;")+'"'),c+">"+n+"</"+t+">"};e.exports=function(e,t){var a={};a[e]=t(c),i(i.P+i.F*n((function(){var t=""[e]('"');return t!==t.toLowerCase()||t.split('"').length>3})),"String",a)}},217:function(e,t,a){e.exports=a.p+"static/sprite-7cb556939e2cd566ec9e7081164509a4.svg"},219:function(e,t,a){e.exports=a.p+"static/red-a21d67939412bb19b135724339de6349.jpg"},220:function(e,t,a){e.exports=a.p+"static/gherkin-b0ff5635bb2478934c6942bfb2db2d04.jpg"},221:function(e,t,a){e.exports=a.p+"static/ug-960a5b92488cff9bafa58ef476e0cd80.jpg"},222:function(e,t,a){e.exports=a.p+"static/tower-8ce0d16cc82280b8a99570adc08e779a.jpg"},223:function(e,t,a){e.exports=a.p+"static/lb-106db0422689819c71e3d1400ab15e5d.jpg"},224:function(e,t,a){e.exports=a.p+"static/cab-7a94f1d1a59797edc357990abc864711.jpg"},225:function(e){e.exports=JSON.parse('{"data":{"placeholderImage":{"childImageSharp":{"fluid":{"base64":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsSAAALEgHS3X78AAACYklEQVQ4y42Uy28SQRjA+dM8efDmwYN6qF6qiSY+Y/WgQRMibY00TaWNBSRSCraYQtHl/bR0KyxQWCgWWAqU8izl/Sq7rLNsRHlVJpvJtzPfb77nDIOcZHSoqZSrp4+KtXIziubaLRysMCZiCYqOoVnhjNEi8RcztdxxeTzc6VBfT+5O2Vhpb+vw4wMdZ0ppWvP9xzLeJoDNThf2W+Nz1+XzNxQubSToSKKW+BDc+WOnkshhSVgeCiGpViZMEg1oxc26Knt+ae3bEtJTZwzE1kXLccG0+sOOlrcvZXvsczPkITfsa20vwIKnhsh+BnjUarT74Gb13CY7KBVJMv3z4N1NszQYsMWM62HNrCis/GxXn0iYls23uz5LPBcv0bH8hUH2XRoM85ySXv7JBtO87jMIvWq+H5GoYIHCLA1ZxD6Qap3Ak8IKfW7TJ50lK6uP9E6RgndHaODtCJ6Z5RyHfnE7j6gRbcKlCYNSt+rtETHTpUGgEP8FYmdNqd/Mo7aiVWTfuH2L9xASvfxxlqr01EYkrJszvNkgW9bH0OuFr+99m+y9IOeyU6zIp/Hubp/yMEztlzFPwOhdvq+nIoS1JNn4t2sugCmVsDvPe2KKolnZLCxhOcAKQRDDXTQaVi46lqYhIBwHTrl3oWqhMRDtaJge37lOBMKo4tfbqhVX0J7snTsWps8uZWuoOQY6CcjpSIF55UvmqNgr5wUwtV1IVdnXtnSfPEB2qjDNqnvczRl0m+j6Jn5lXb6nAQJqinmN0ZEBj03YLzghY8PnTRz80o/GRJZpOLCb0PM9BN7pvUEjx28V00WUg9jIVwAAAABJRU5ErkJggg==","aspectRatio":1,"src":"/static/6d91c86c0fde632ba4cd01062fd9ccfa/fdbb0/gatsby-astronaut.png","srcSet":"/static/6d91c86c0fde632ba4cd01062fd9ccfa/e22c9/gatsby-astronaut.png 75w,\\n/static/6d91c86c0fde632ba4cd01062fd9ccfa/d3809/gatsby-astronaut.png 150w,\\n/static/6d91c86c0fde632ba4cd01062fd9ccfa/fdbb0/gatsby-astronaut.png 300w,\\n/static/6d91c86c0fde632ba4cd01062fd9ccfa/b5207/gatsby-astronaut.png 450w,\\n/static/6d91c86c0fde632ba4cd01062fd9ccfa/59139/gatsby-astronaut.png 600w,\\n/static/6d91c86c0fde632ba4cd01062fd9ccfa/af144/gatsby-astronaut.png 800w","sizes":"(max-width: 300px) 100vw, 300px"}}}}}')},226:function(e,t,a){"use strict";a(15),a(16),a(9),a(103),a(142),a(227);var i=a(19);t.__esModule=!0,t.default=void 0;var n,r=i(a(76)),s=i(a(77)),c=i(a(143)),l=i(a(144)),o=i(a(0)),d=i(a(45)),u=function(e){var t=(0,l.default)({},e),a=t.resolutions,i=t.sizes,n=t.critical;return a&&(t.fixed=a,delete t.resolutions),i&&(t.fluid=i,delete t.sizes),n&&(t.loading="eager"),t.fluid&&(t.fluid=N([].concat(t.fluid))),t.fixed&&(t.fixed=N([].concat(t.fixed))),t},g=function(e){var t=e.fluid,a=e.fixed;return(t&&t[0]||a&&a[0]).src},f=Object.create({}),m=function(e){var t=u(e),a=g(t);return f[a]||!1},p="undefined"!=typeof HTMLImageElement&&"loading"in HTMLImageElement.prototype,h="undefined"!=typeof window,b=h&&window.IntersectionObserver,M=new WeakMap;function y(e){return e.map((function(e){var t=e.src,a=e.srcSet,i=e.srcSetWebp,n=e.media,r=e.sizes;return o.default.createElement(o.default.Fragment,{key:t},i&&o.default.createElement("source",{type:"image/webp",media:n,srcSet:i,sizes:r}),o.default.createElement("source",{media:n,srcSet:a,sizes:r}))}))}function N(e){var t=[],a=[];return e.forEach((function(e){return(e.media?t:a).push(e)})),[].concat(t,a)}function I(e){return e.map((function(e){var t=e.src,a=e.media,i=e.tracedSVG;return o.default.createElement("source",{key:t,media:a,srcSet:i})}))}function E(e){return e.map((function(e){var t=e.src,a=e.media,i=e.base64;return o.default.createElement("source",{key:t,media:a,srcSet:i})}))}function j(e,t){var a=e.srcSet,i=e.srcSetWebp,n=e.media,r=e.sizes;return"<source "+(t?"type='image/webp' ":"")+(n?'media="'+n+'" ':"")+'srcset="'+(t?i:a)+'" '+(r?'sizes="'+r+'" ':"")+"/>"}var L=function(e,t){var a=(void 0===n&&"undefined"!=typeof window&&window.IntersectionObserver&&(n=new window.IntersectionObserver((function(e){e.forEach((function(e){if(M.has(e.target)){var t=M.get(e.target);(e.isIntersecting||e.intersectionRatio>0)&&(n.unobserve(e.target),M.delete(e.target),t())}}))}),{rootMargin:"200px"})),n);return a&&(a.observe(e),M.set(e,t)),function(){a.unobserve(e),M.delete(e)}},S=function(e){var t=e.src?'src="'+e.src+'" ':'src="" ',a=e.sizes?'sizes="'+e.sizes+'" ':"",i=e.srcSet?'srcset="'+e.srcSet+'" ':"",n=e.title?'title="'+e.title+'" ':"",r=e.alt?'alt="'+e.alt+'" ':'alt="" ',s=e.width?'width="'+e.width+'" ':"",c=e.height?'height="'+e.height+'" ':"",l=e.crossOrigin?'crossorigin="'+e.crossOrigin+'" ':"",o=e.loading?'loading="'+e.loading+'" ':"",d=e.draggable?'draggable="'+e.draggable+'" ':"";return"<picture>"+e.imageVariants.map((function(e){return(e.srcSetWebp?j(e,!0):"")+j(e)})).join("")+"<img "+o+s+c+a+i+t+r+n+l+d+'style="position:absolute;top:0;left:0;opacity:1;width:100%;height:100%;object-fit:cover;object-position:center"/></picture>'},v=function(e){var t=e.src,a=e.imageVariants,i=e.generateSources,n=e.spreadProps,r=o.default.createElement(T,(0,l.default)({src:t},n));return a.length>1?o.default.createElement("picture",null,i(a),r):r},T=o.default.forwardRef((function(e,t){var a=e.sizes,i=e.srcSet,n=e.src,r=e.style,s=e.onLoad,d=e.onError,u=e.loading,g=e.draggable,f=(0,c.default)(e,["sizes","srcSet","src","style","onLoad","onError","loading","draggable"]);return o.default.createElement("img",(0,l.default)({sizes:a,srcSet:i,src:n},f,{onLoad:s,onError:d,ref:t,loading:u,draggable:g,style:(0,l.default)({position:"absolute",top:0,left:0,width:"100%",height:"100%",objectFit:"cover",objectPosition:"center"},r)}))}));T.propTypes={style:d.default.object,onError:d.default.func,onLoad:d.default.func};var x=function(e){function t(t){var a;(a=e.call(this,t)||this).seenBefore=h&&m(t),a.isCritical="eager"===t.loading||t.critical,a.addNoScript=!(a.isCritical&&!t.fadeIn),a.useIOSupport=!p&&b&&!a.isCritical&&!a.seenBefore;var i=a.isCritical||h&&(p||!a.useIOSupport);return a.state={isVisible:i,imgLoaded:!1,imgCached:!1,fadeIn:!a.seenBefore&&t.fadeIn},a.imageRef=o.default.createRef(),a.handleImageLoaded=a.handleImageLoaded.bind((0,r.default)(a)),a.handleRef=a.handleRef.bind((0,r.default)(a)),a}(0,s.default)(t,e);var a=t.prototype;return a.componentDidMount=function(){if(this.state.isVisible&&"function"==typeof this.props.onStartLoad&&this.props.onStartLoad({wasCached:m(this.props)}),this.isCritical){var e=this.imageRef.current;e&&e.complete&&this.handleImageLoaded()}},a.componentWillUnmount=function(){this.cleanUpListeners&&this.cleanUpListeners()},a.handleRef=function(e){var t=this;this.useIOSupport&&e&&(this.cleanUpListeners=L(e,(function(){var e=m(t.props);t.state.isVisible||"function"!=typeof t.props.onStartLoad||t.props.onStartLoad({wasCached:e}),t.setState({isVisible:!0},(function(){return t.setState({imgLoaded:e,imgCached:!!t.imageRef.current.currentSrc})}))})))},a.handleImageLoaded=function(){var e,t,a;e=this.props,t=u(e),a=g(t),f[a]=!0,this.setState({imgLoaded:!0}),this.props.onLoad&&this.props.onLoad()},a.render=function(){var e=u(this.props),t=e.title,a=e.alt,i=e.className,n=e.style,r=void 0===n?{}:n,s=e.imgStyle,c=void 0===s?{}:s,d=e.placeholderStyle,g=void 0===d?{}:d,f=e.placeholderClassName,m=e.fluid,p=e.fixed,h=e.backgroundColor,b=e.durationFadeIn,M=e.Tag,N=e.itemProp,j=e.loading,L=e.draggable,x=!1===this.state.fadeIn||this.state.imgLoaded,A=!0===this.state.fadeIn&&!this.state.imgCached,w=(0,l.default)({opacity:x?1:0,transition:A?"opacity "+b+"ms":"none"},c),z="boolean"==typeof h?"lightgray":h,D={transitionDelay:b+"ms"},C=(0,l.default)({opacity:this.state.imgLoaded?0:1},A&&D,{},c,{},g),O={title:t,alt:this.state.isVisible?"":a,style:C,className:f};if(m){var _=m,k=_[0];return o.default.createElement(M,{className:(i||"")+" gatsby-image-wrapper",style:(0,l.default)({position:"relative",overflow:"hidden"},r),ref:this.handleRef,key:"fluid-"+JSON.stringify(k.srcSet)},o.default.createElement(M,{style:{width:"100%",paddingBottom:100/k.aspectRatio+"%"}}),z&&o.default.createElement(M,{title:t,style:(0,l.default)({backgroundColor:z,position:"absolute",top:0,bottom:0,opacity:this.state.imgLoaded?0:1,right:0,left:0},A&&D)}),k.base64&&o.default.createElement(v,{src:k.base64,spreadProps:O,imageVariants:_,generateSources:E}),k.tracedSVG&&o.default.createElement(v,{src:k.tracedSVG,spreadProps:O,imageVariants:_,generateSources:I}),this.state.isVisible&&o.default.createElement("picture",null,y(_),o.default.createElement(T,{alt:a,title:t,sizes:k.sizes,src:k.src,crossOrigin:this.props.crossOrigin,srcSet:k.srcSet,style:w,ref:this.imageRef,onLoad:this.handleImageLoaded,onError:this.props.onError,itemProp:N,loading:j,draggable:L})),this.addNoScript&&o.default.createElement("noscript",{dangerouslySetInnerHTML:{__html:S((0,l.default)({alt:a,title:t,loading:j},k,{imageVariants:_}))}}))}if(p){var R=p,Y=R[0],V=(0,l.default)({position:"relative",overflow:"hidden",display:"inline-block",width:Y.width,height:Y.height},r);return"inherit"===r.display&&delete V.display,o.default.createElement(M,{className:(i||"")+" gatsby-image-wrapper",style:V,ref:this.handleRef,key:"fixed-"+JSON.stringify(Y.srcSet)},z&&o.default.createElement(M,{title:t,style:(0,l.default)({backgroundColor:z,width:Y.width,opacity:this.state.imgLoaded?0:1,height:Y.height},A&&D)}),Y.base64&&o.default.createElement(v,{src:Y.base64,spreadProps:O,imageVariants:R,generateSources:E}),Y.tracedSVG&&o.default.createElement(v,{src:Y.tracedSVG,spreadProps:O,imageVariants:R,generateSources:I}),this.state.isVisible&&o.default.createElement("picture",null,y(R),o.default.createElement(T,{alt:a,title:t,width:Y.width,height:Y.height,sizes:Y.sizes,src:Y.src,crossOrigin:this.props.crossOrigin,srcSet:Y.srcSet,style:w,ref:this.imageRef,onLoad:this.handleImageLoaded,onError:this.props.onError,itemProp:N,loading:j,draggable:L})),this.addNoScript&&o.default.createElement("noscript",{dangerouslySetInnerHTML:{__html:S((0,l.default)({alt:a,title:t,loading:j},Y,{imageVariants:R}))}}))}return null},t}(o.default.Component);x.defaultProps={fadeIn:!0,durationFadeIn:500,alt:"",Tag:"div",loading:"lazy"};var A=d.default.shape({width:d.default.number.isRequired,height:d.default.number.isRequired,src:d.default.string.isRequired,srcSet:d.default.string.isRequired,base64:d.default.string,tracedSVG:d.default.string,srcWebp:d.default.string,srcSetWebp:d.default.string,media:d.default.string}),w=d.default.shape({aspectRatio:d.default.number.isRequired,src:d.default.string.isRequired,srcSet:d.default.string.isRequired,sizes:d.default.string.isRequired,base64:d.default.string,tracedSVG:d.default.string,srcWebp:d.default.string,srcSetWebp:d.default.string,media:d.default.string});x.propTypes={resolutions:A,sizes:w,fixed:d.default.oneOfType([A,d.default.arrayOf(A)]),fluid:d.default.oneOfType([w,d.default.arrayOf(w)]),fadeIn:d.default.bool,durationFadeIn:d.default.number,title:d.default.string,alt:d.default.string,className:d.default.oneOfType([d.default.string,d.default.object]),critical:d.default.bool,crossOrigin:d.default.oneOfType([d.default.string,d.default.bool]),style:d.default.object,imgStyle:d.default.object,placeholderStyle:d.default.object,placeholderClassName:d.default.string,backgroundColor:d.default.oneOfType([d.default.string,d.default.bool]),onLoad:d.default.func,onError:d.default.func,onStartLoad:d.default.func,Tag:d.default.string,itemProp:d.default.string,loading:d.default.oneOf(["auto","lazy","eager"]),draggable:d.default.bool};var z=x;t.default=z},227:function(e,t,a){"use strict";a(214)("fixed",(function(e){return function(){return e(this,"tt","","")}}))},230:function(e,t,a){e.exports=a.p+"static/steel-beauty-68b8df4cc702f831932b373e51118629.png"},231:function(e,t,a){e.exports=a.p+"static/fontination-d6df993e94f473ee0ba6b07022e92dcb.png"},232:function(e,t,a){e.exports=a.p+"static/grad-ee02f5d8f512292e34a1f760834ab516.png"},233:function(e,t,a){e.exports=a.p+"static/venyl-ef675f96ecef225d2c486d61255f6ee2.png"}}]);
  //# sourceMappingURL=component---src-pages-index-js-5e1d424449d0476f497f.js.map