{"version":3,"file":"components-flex-Cta-CtaShell-d75b03b4ad4e29881f92.js","mappings":"8MAOMA,EAAiBC,EAAAA,QAAAA,IAAAA,WAAH,sEAAGA,CAAH,iGASdC,GAAQD,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,wEAAGF,CAAH,8EAaLG,GAAUH,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,0EAAGF,CAAH,2OACS,qBAAGI,MAAkBC,MAAMC,WAKzC,SAACC,GAAD,OACAA,EAAMC,SACFC,EAAAA,EAAAA,KADJ,sBAIIA,EAAAA,EAAAA,KAJJ,wBAyBFC,EAAOV,EAAAA,QAAAA,IAAAA,WAAH,4DAAGA,CAAH,4GAOc,qBAAGI,MAAkBC,MAAMM,QAkDnD,EAzC8C,SAAC,GAAD,IAAGC,EAAH,EAAGA,OAAH,OAC5C,2BAASC,UAAS,sBAAwBD,EAAOE,KAAgB,GAAT,SACtD,uBAAKD,UAAU,qBACb,uBACEA,UAAS,QACPD,EAAOE,KAAO,sBAAwB,0BAD/B,KAIT,uBAAKD,UAAU,aACZD,EAAOG,OACN,gBAACd,EAAD,CAAOe,QAASJ,EAAOG,MAAOF,UAAU,iBAE1C,uBAAKA,UAAU,OACb,uBACEA,WACED,EAAOE,KAAO,oBAAsB,qBAD7B,KAIT,gBAACf,EAAD,KACE,gBAACI,EAAD,CACEa,QAASJ,EAAOK,YAChBJ,UAAU,aACVL,QAASI,EAAOE,SAItB,uBACED,WACED,EAAOE,KAAO,oBAAsB,qBAD7B,KAIT,gBAAC,IAAD,CAAUI,MAAON,EAAOM,MAAOC,IAAI,UAM5CP,EAAOE,MAAQ,gBAACJ,EAAD,QC3GdX,EAAiBC,EAAAA,QAAAA,IAAAA,WAAH,oEAAGA,CAAH,+FASdC,GAAQD,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,sEAAGF,CAAH,8EAaLG,GAAUH,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,wEAAGF,CAAH,mWACS,qBAAGI,MAAkBC,MAAMC,WA8B3Cc,GAAcpB,EAAAA,EAAAA,SAAOqB,EAAAA,GAAV,4EAAGrB,CAAH,+UAgEjB,EA7B4C,SAAC,GAAD,IAAGY,EAAH,EAAGA,OAAH,OAC1C,2BAASC,UAAU,QACjB,uBAAKA,UAAU,kBACb,uBAAKA,UAAU,8BACb,uBAAKA,UAAU,aACZD,EAAOG,OACN,gBAAC,EAAD,CAAOC,QAASJ,EAAOG,MAAOF,UAAU,iBAE1C,uBAAKA,UAAU,OACb,uBAAKA,UAAU,qBACb,gBAAC,IAAD,CAAUK,MAAON,EAAOM,MAAOC,IAAI,MAErC,uBAAKN,UAAU,qBACb,gBAAC,EAAD,CAAgBA,UAAU,qBACxB,gBAAC,EAAD,CAASG,QAASJ,EAAOK,cACzB,gBAACG,EAAD,CACEF,MAAON,EAAOU,YACdH,IAAI,GACJN,UAAU,8BC5E5B,EArB0C,SAAC,GAA+B,IAA7BD,EAA4B,EAA5BA,OAA4B,IAApBW,SAAAA,OAAoB,MAAT,GAAS,EACjEC,EAAgB,CACpBC,QAASC,EACTC,OAAQC,GAGV,IAAKhB,EAAOiB,YAAcL,EAAIZ,EAAOiB,WACnC,OAAO,KAGT,IAAMC,EAAYN,EAAIZ,EAAOiB,WAE7B,OACE,gBAACC,EAAD,CACEC,IAAG,IAAKR,EAAWA,EAASS,SAAW,QACvCpB,OAAQA,EACRW,SAAUA","sources":["webpack:///./src/components/flex/Cta/CtaDefault.tsx","webpack:///./src/components/flex/Cta/CtaPerson.tsx","webpack:///./src/components/flex/Cta/CtaShell.tsx"],"sourcesContent":["import React from 'react'\nimport styled, { css } from 'styled-components'\n\n// Elements\nimport ParseContent from 'components/shared/ParseContent'\nimport Plaatjie from '@ubo/plaatjie'\n\nconst ContentWrapper = styled.div`\n position: relative;\n z-index: 2;\n @media (min-width: 992px) {\n margin-right: -10rem;\n margin-top: 14rem;\n }\n`\n\nconst Title = styled(ParseContent)`\n & h1,\n & h2,\n & h3,\n & h4,\n & h5,\n & h6 {\n @media (min-width: 992px) {\n font-size: 48px;\n }\n }\n`\n\nconst Content = styled(ParseContent)<{ hasBeam: boolean }>`\n background-color: ${({ theme }) => theme.color.primary};\n & h1,\n & h2 {\n margin-bottom: 1.25rem;\n @media (min-width: 992px) {\n ${(props) =>\n props.hasBeam\n ? css`\n font-size: 48px;\n `\n : css`\n font-size: 40px;\n `}\n }\n @media (max-width: 991px) {\n line-height: 40px;\n }\n }\n & h3,\n & h4,\n & h5,\n & h6 {\n @media (min-width: 992px) {\n font-size: 28px;\n }\n @media (max-width: 991px) {\n font-size: 20px;\n }\n }\n`\n\nconst Beam = styled.div`\n @media (min-width: 992px) {\n position: absolute;\n left: 0;\n bottom: 0;\n right: 0;\n height: 215px;\n background-color: ${({ theme }) => theme.color.grey};\n }\n`\n\ninterface CtaDefaultProps {\n // eslint-disable-next-line\n fields: GatsbyTypes.WpPage_Flexcontent_Flex_Cta\n}\n\nconst CtaDefault: React.FC = ({ fields }) => (\n
\n
\n \n
\n {fields.title && (\n \n )}\n <div className=\"row\">\n <div\n className={`${\n fields.beam ? 'col-md-5 col-lg-3' : 'col-md-6 col-lg-4'\n } `}\n >\n <ContentWrapper>\n <Content\n content={fields.description}\n className=\"p-4 p-sm-5\"\n hasBeam={fields.beam}\n />\n </ContentWrapper>\n </div>\n <div\n className={`${\n fields.beam ? 'col-md-7 col-lg-9' : 'col-md-6 col-lg-8'\n } `}\n >\n <Plaatjie image={fields.image} alt=\"\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n {fields.beam && <Beam />}\n </section>\n)\n\nexport default CtaDefault\n","import React from 'react'\nimport styled from 'styled-components'\n\n// Elements\nimport ParseContent from 'components/shared/ParseContent'\nimport Plaatjie from '@ubo/plaatjie'\n\nconst ContentWrapper = styled.div`\n position: relative;\n z-index: 2;\n @media (min-width: 992px) {\n margin-left: -10rem;\n margin-top: 8rem;\n }\n`\n\nconst Title = styled(ParseContent)`\n & h1,\n & h2,\n & h3,\n & h4,\n & h5,\n & h6 {\n @media (min-width: 992px) {\n font-size: 48px;\n }\n }\n`\n\nconst Content = styled(ParseContent)`\n background-color: ${({ theme }) => theme.color.primary};\n & h1,\n & h2 {\n margin-bottom: 1.25rem;\n @media (min-width: 992px) {\n font-size: 40px;\n }\n @media (max-width: 991px) {\n line-height: 40px;\n }\n }\n & h3,\n & h4,\n & h5,\n & h6 {\n @media (min-width: 992px) {\n font-size: 28px;\n }\n @media (max-width: 991px) {\n font-size: 20px;\n }\n }\n @media (min-width: 992px) {\n padding: 3rem 7rem 3rem 3rem;\n }\n @media (max-width: 991px) {\n padding: 2rem 4rem 2rem 2rem;\n }\n`\n\nconst PersonImage = styled(Plaatjie)`\n @media (min-width: 992px) {\n right: -150px;\n height: 360px;\n width: 300px;\n bottom: 0;\n }\n @media (max-width: 991px) {\n bottom: -2px;\n left: -190px;\n height: 260px;\n width: 200px;\n }\n @media (max-width: 767px) {\n left: unset;\n right: 0;\n height: 260px;\n width: 200px;\n }\n @media (max-width: 575px) {\n height: 180px;\n width: 150px;\n bottom: 0;\n }\n @media (max-width: 375px) {\n height: 120px;\n width: 100px;\n }\n`\n\ninterface CtaPersonProps {\n // eslint-disable-next-line\n fields: GatsbyTypes.WpPage_Flexcontent_Flex_Cta\n}\n\nconst CtaPerson: React.FC<CtaPersonProps> = ({ fields }) => (\n <section className=\"mb-5\">\n <div className=\"container py-5\">\n <div className=\"row justify-content-center\">\n <div className=\"col-lg-10\">\n {fields.title && (\n <Title content={fields.title} className=\"mb-lg-5 pb-4\" />\n )}\n <div className=\"row\">\n <div className=\"col-md-7 col-lg-8\">\n <Plaatjie image={fields.image} alt=\"\" />\n </div>\n <div className=\"col-md-5 col-lg-3\">\n <ContentWrapper className=\"position-relative\">\n <Content content={fields.description} />\n <PersonImage\n image={fields.personimage}\n alt=\"\"\n className=\"position-absolute\"\n />\n </ContentWrapper>\n </div>\n </div>\n </div>\n </div>\n </div>\n </section>\n)\n\nexport default CtaPerson\n","import React from 'react'\n\n// Components\nimport CtaDefault from 'components/flex/Cta/CtaDefault'\nimport CtaPerson from 'components/flex/Cta/CtaPerson'\n\ninterface CtaShellProps {\n // eslint-disable-next-line camelcase\n fields: GatsbyTypes.WpPost_Flexcontent_Flex_Banner\n location?: any\n}\n\ninterface CtaProps {\n [key: string]: any\n}\n\nconst CtaShell: React.FC<CtaShellProps> = ({ fields, location = {} }) => {\n const cta: CtaProps = {\n default: CtaDefault,\n person: CtaPerson,\n }\n\n if (!fields.styletype || !cta[fields.styletype]) {\n return null\n }\n\n const Component = cta[fields.styletype]\n\n return (\n <Component\n key={`${location ? location.pathname : 'flex'}`}\n fields={fields}\n location={location}\n />\n )\n}\n\nexport default CtaShell\n"],"names":["ContentWrapper","styled","Title","ParseContent","Content","theme","color","primary","props","hasBeam","css","Beam","grey","fields","className","beam","title","content","description","image","alt","PersonImage","Plaatjie","personimage","location","cta","default","CtaDefault","person","CtaPerson","styletype","Component","key","pathname"],"sourceRoot":""}