{"version":3,"sources":["webpack:///./src/components/Header/CoursesHeader.tsx","webpack:///./src/pages/products.tsx"],"names":["CoursesHeader","smallText","heading","subheading","imageDesktop","imageMob","breadcrumb","breadcrumbURL","imagesCollection","useStaticQuery","breadcrumbData","imgHeader","edges","node","childImageSharp","fluid","src","imgHeaderMob","title","url","Container","MainGrid","noPaddingMobile","noPaddingTablet","Breadcrumb","data","color","TextContainer","SmallText","className","Heading","Body","styled","div","props","p","h1","Products","wpPage","renderedBlocks","LazyBlocksFactory","lazy_data","Layout","map","v"],"mappings":"wLAkGeA,EA/E8C,SAAH,GAQpD,IAPJC,EAAS,EAATA,UACAC,EAAO,EAAPA,QACAC,EAAU,EAAVA,WACAC,EAAY,EAAZA,aACAC,EAAQ,EAARA,SACAC,EAAU,EAAVA,WACAC,EAAa,EAAbA,cAGMC,EAAmBC,yBAAe,aAyClCC,GAZYF,EAAiBG,UAAUC,MAAM,GAAGC,KAAKC,gBAAgBC,MAAMC,IAC5DR,EAAiBS,aAAaL,MAAM,GAAGC,KAAKC,gBAAgBC,MAAMC,IAWhE,CACrB,CACEE,MAAO,OACPC,IAAK,KAEP,CACED,MAAOZ,EACPa,IAAKZ,KAGT,OACE,kBAACa,EAAS,CAACf,SAAUA,EAAUD,aAAcA,GAC3C,kBAACiB,EAAA,EAAQ,CAACC,iBAAe,EAACC,iBAAe,GACvC,kBAACC,EAAA,EAAU,CAACC,KAAMf,EAAgBgB,MAAO,WAE3C,kBAACL,EAAA,EAAQ,KACP,kBAACM,EAAa,KACX1B,GAAa,kBAAC2B,EAAS,CAACC,UAAU,WAAW5B,GAE7CC,GAAW,kBAAC4B,EAAO,KAAE5B,GAErBC,GAAc,kBAAC4B,EAAI,KAAE5B,OAc1BiB,EAAYY,IAAOC,IAAG,+EAAVD,CAAU,wNACF,SAACE,GAAK,OAAKA,EAAM7B,YAMf,SAAC6B,GAAK,OAAKA,EAAM9B,gBAMvCuB,EAAgBK,IAAOC,IAAG,mFAAVD,CAAU,kOAiB1BJ,EAAYI,IAAOG,EAAC,+EAARH,CAAQ,qDAOpBF,EAAUE,IAAOI,GAAE,6EAATJ,CAAS,mFAUnBD,EAAOC,IAAOG,EAAC,0EAARH,CAAQ,kB,sDC1ENK,UAlDE,SAAH,GAAiB,IACrBC,EADc,EAAJb,KACVa,OACFC,EAAiBC,YAAkBF,EAAOG,UAAWH,EAAOpB,OAElE,OACE,kBAACwB,EAAA,EAAM,KACL,kBAAC,EAAa,CACZzC,UAAU,sDACVC,QAAQ,gBACRC,WAAW,mFACXC,aAAcO,IACdN,SAAUY,IACVX,WAAY,WACZC,cAAe,cAGhBgC,EAAeI,KAAI,SAACC,GAAC,OAAKA","file":"component---src-pages-products-tsx-bc3a9095f3d066e1d074.js","sourcesContent":["import React, { FunctionComponent } from 'react'\nimport styled from 'styled-components'\nimport Breadcrumb from '../shared/Breadcrumb/Breadcrumb'\nimport MainGrid from '../styling/MainGrid'\n// import imgHeader from '../../images/courses-header.jpg'\n// import imgHeaderMob from '../../images/courses-header-m.jpg'\n\nimport { graphql,useStaticQuery } from 'gatsby'\n\ninterface CoursesHeaderProps {\n smallText: string\n heading: string\n subheading: string\n imageDesktop: string\n imageMob: string\n breadcrumb: string\n breadcrumbURL: string\n}\n\nconst CoursesHeader: FunctionComponent = ({\n smallText,\n heading,\n subheading,\n imageDesktop,\n imageMob,\n breadcrumb,\n breadcrumbURL,\n}) => {\n\n const imagesCollection = useStaticQuery(graphql`\n\n query img8 {\n imgHeader: allFile(filter: {childrenImageSharp: {elemMatch: {fluid: {originalName: {eq: \"courses-header.jpg\"}}}}}) {\n edges {\n node {\n id\n childImageSharp {\n fluid(maxWidth: 660,toFormat: WEBP) {\n ...GatsbyImageSharpFluid\n }\n }\n }\n }\n },\n imgHeaderMob: allFile(filter: {childrenImageSharp: {elemMatch: {fluid: {originalName: {eq: \"courses-header-m.jpg\"}}}}}) {\n edges {\n node {\n id\n childImageSharp {\n fluid(maxWidth: 660,toFormat: WEBP) {\n ...GatsbyImageSharpFluid\n }\n }\n }\n }\n }\n }\n `)\n const imgHeader = imagesCollection.imgHeader.edges[0].node.childImageSharp.fluid.src\n const imgHeaderMob = imagesCollection.imgHeaderMob.edges[0].node.childImageSharp.fluid.src \n\n const data = {\n smallText: 'Cybersecurity training that works',\n heading: 'Course collection',\n subheading:\n 'Build a culture of cyber learning that reduces human risks, egestas quis lobortis id, efficitur et metus donec ut enim volutpat.',\n imageDesktop: imgHeader,\n imageMob: imgHeaderMob,\n }\n \n const breadcrumbData = [\n {\n title: 'Home',\n url: '/',\n },\n {\n title: breadcrumb,\n url: breadcrumbURL,\n },\n ]\n return (\n \n \n \n \n \n \n {smallText && {smallText}}\n\n {heading && {heading}}\n\n {subheading && {subheading}}\n \n \n \n )\n}\n\nexport default CoursesHeader\n\ninterface ContainerProps {\n imageDesktop: string\n imageMob: string\n}\n\nconst Container = styled.div`\n background-image: url(${(props) => props.imageMob});\n\n background-repeat: no-repeat;\n background-size: auto 100% ;\n background-position: center;\n @media (min-width: 1024px) {\n background-image: url(${(props) => props.imageDesktop});\n background-repeat: no-repeat;\n background-size: cover;\n\n }\n`\nconst TextContainer = styled.div`\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center;\n padding: 126px 0 65px;\n width: 100%;\n max-width: 60rem;\n margin: 0 auto;\n\n @media (min-width: 1024px) {\n padding: 80px 0 84px;\n max-width: 56rem;\n }\n`\n\nconst SmallText = styled.p`\n margin-bottom: 15px;\n font-weight: 300;\n\n color: white;\n`\n\nconst Heading = styled.h1`\n margin-bottom: 16px;\n\n color: white;\n\n @media (min-width: 1024px) {\n margin-bottom: 11px;\n }\n`\n\nconst Body = styled.p`\n color: white;\n`\n","import React from 'react'\nimport TrackVisibility from 'react-on-screen'\nimport Layout from '../components/Layout'\nimport CoursesHeader from '../components/Header/CoursesHeader'\nimport PromotionBannerAnimation from '../components/PromotionBannerAnimation'\n\nimport ProductsCards from '../components/ProductsCards/ProductsCards'\n\nimport imgHeader from '../buildAssets/logos/general/generice-background-lg.png'\nimport imgHeaderMob from '../buildAssets/logos/general/generice-background-sm.png'\nimport icon1 from '../buildAssets/logos/products/up-and-down-arrows.svg'\nimport icon2 from '../buildAssets/logos/products/circle.svg'\nimport icon3 from '../buildAssets/logos/products/bite-sized-training.svg'\nimport icon4 from '../buildAssets/logos/products/create-experiences.svg'\nimport icon5 from '../buildAssets/logos/products/all-devices.svg'\nimport icon6 from '../buildAssets/logos/products/power-on.svg'\n\nimport cardIcon1 from '../buildAssets/logos/compliance/logo-compliance.png'\nimport cardIcon2 from '../buildAssets/logos/culture/logo-culture.png'\nimport cardIcon3 from '../buildAssets/logos/phishing/logo-phishing.png'\nimport cardIcon4 from '../buildAssets/logos/bespoke/logo-bespoke.png'\nimport { graphql } from 'gatsby'\nimport { LazyBlocksFactory } from '../components/LazyBlocksFactory/LazyBlocksFactory'\n\n\n\n\n\nconst Products = ({ data }) => {\n const { wpPage } = data\n const renderedBlocks = LazyBlocksFactory(wpPage.lazy_data, wpPage.title)\n\n return (\n \n \n\n {renderedBlocks.map((v) => v)}\n\n \n \n )\n}\n\nexport const query = graphql`\n query ProductsQuery {\n allWpPost {\n edges {\n node {\n id\n categories {\n nodes {\n id\n name\n slug\n }\n }\n\n title\n slug\n }\n }\n }\n wpPage(title: { eq: \"Products\" }) {\n id\n lazy_data\n title\n }\n }\n`\n\nexport default Products\n"],"sourceRoot":""}