https://bravebison.com/component---src-templates-our-works-js-22b74b19b7aeec18cd81.js

1"use strict";(self.webpackChunkgatsby_starter_default=self.webpackChunkgatsby_starter_default||[]).push([[927],{14462:function(e,t,i){i.r(t),i.d(t,{default:function(){return ae}});var a=i(96540),n=i(68719),l=i(22518),r=i(88963),o=i(77810),c=i(63679);const s=c.default.section.withConfig({displayName:"IntroMain",componentId:"sc-9605ln-0"})(["background-color:",";color:",";"],r.T.charcoal,r.T.white),d=c.default.h1.withConfig({displayName:"IntroTitle",componentId:"sc-9605ln-1"})(["max-width:8em;strong{margin-right:10px;}"," br{display:none;}"],(0,o.Ku)(o.w2.heading1Serif,o.w2.superSerif));var p=i(12430),m=i(73517),g=i(64232);var u=e=>{let t=e.title;return a.createElement(s,null,a.createElement(g.A,{size:[120,200]}),a.createElement(m.A,null,a.createElement(d,null,a.createElement(p.A,{content:t,paragraphSize:"heading2Serif",maxWidth:28,offset:"1em",buildOn:!0}))),a.createElement(g.A,{size:[90,290]}))},h=i(54506),f=i(61520),x=i(92106);const w=c.default.div.withConfig({displayName:"MainContainer",componentId:"sc-1h21qdb-0"})(["","{"," ","}background-color:",";.listMain > div:last-child{.caseStudyContainer{border-bottom:none;}}"],f.mq.tabletP,(0,x.o)("padding-left"),(0,x.o)("padding-right"),r.T.white),v=c.default.div.withConfig({displayName:"FilterMain",componentId:"sc-1h21qdb-1"})(["background-color:",";color:",";padding:30px 0;border-bottom:1px solid ",";display:flex;flex-wrap:wrap;gap:20px;","{border-bottom:none;padding:20px 15px;gap:15px;}"],r.T.white,r.T.charcoal,r.T.mist,f.mq.tabletLMax),y=c.default.div.withConfig({displayName:"Title",componentId:"sc-1h21qdb-2"})(["width:100%;margin-bottom:20px;font-size:18px;","{display:none;}"],f.mq.tabletL),b=c.default.div.withConfig({displayName:"MainList",componentId:"sc-1h21qdb-3"})(["background-color:",";color:",";position:relative;> .pin-spacer{height:0 !important;}.gridMain{","{padding:0 15px;}}"],r.T.white,r.T.charcoal,f.mq.tabletPMax);c.default.div.withConfig({displayName:"CMSButtonContainer",componentId:"sc-1h21qdb-4"})(["width:15%;"]);var E=i(81498),C=i(22557);const S=c.default.div.withConfig({displayName:"CaseStudyMain",componentId:"sc-1xr6l4s-0"})(["position:relative;a{text-decoration:none;width:100%;&:before{position:absolute;content:\"\";height:100%;width:100%;left:0;top:0;z-index:1;}}&.grid{margin-bottom:30px;&:after{content:'';position:absolute;left:0;top:0;background:rgba(0,0,0,0.5);height:100%;width:100%;opacity:0;transition:all 0.25s ease;}.caseStudyContainer{width:100%;aspect-ratio:1/1;}.content{padding:40px 30px 40px 40px;opacity:0;color:",";justify-content:flex-end;display:flex;flex-flow:column;}&:hover{&:after{opacity:1;}.content{opacity:1;}}.caseStudyImage{position:absolute;height:100%;width:100%;left:0;top:0;display:flex;justify-content:center;align-items:center;}.gatsby-image-wrapper{position:absolute;height:100% !important;min-width:100%;}}&.list{&:hover{.gatsby-image-wrapper{height:360px !important;}.content{","{transform:translateX(20px);}}}.content{","{padding:40px 30px 40px 0;}width:60%;","{width:100%;}}.caseStudyContainer{display:flex;align-items:center;border-bottom:1px solid ",";}.caseStudyImage{width:25%;aspect-ratio:1/1;max-width:360px;display:flex;justify-content:center;align-items:center;position:relative;margin:-8% 0;","{display:none;}}.gatsby-image-wrapper{position:absolute;transition:height 0.25s ease;height:0 !important;max-height:100%;}}.arrowIcon{width:40px;}"],r.T.white,f.mq.tabletP,f.mq.tabletL,f.mq.tabletPMax,r.T.mist,f.mq.tabletPMax),k=c.default.div.withConfig({displayName:"IconContainer",componentId:"sc-1xr6l4s-1"})(["width:24px;margin:auto 20px 40px auto;","{width:16px;margin:auto 20px 30px auto;}"],f.mq.tabletPMax),I=c.default.div.withConfig({displayName:"CaseStudyImage",componentId:"sc-1xr6l4s-2"})([""]),A=c.default.div.withConfig({displayName:"CaseStudyContent",componentId:"sc-1xr6l4s-3"})(["position:relative;z-index:1;height:100%;","{padding:25px 15px;}p{line-height:30px;}transition:all 0.25s ease;.title{margin-top:10px;strong{font-weight:normal;font-family:Signifier;}","{br{display:none;}

1h4{font-size:14px;}}}"],f.mq.tabletPMax,f.mq.tabletPMax),T=c.default.div.withConfig({displayName:"CaseStudyContainer",componentId:"sc-1xr6l4s-4"})(["width:100%;display:flex;align-items:flex-end;position:relative;"]);var N=i(30398),F=i(5588),M=i(92795),q=i(24499);var z=e=>{let t=e.data,i=e.display;const n=t.slug,l=t.title,r=t.mainImage,o=t.secondaryImage,c=t.heroText,s=t.metadata,d=(t.parentService,r||o);return a.createElement(S,{className:i},a.createElement(N.A,{to:"our-work/"+n,className:"caseStudyImageLink"},a.createElement(T,{className:"caseStudyContainer"},a.createElement(A,{className:"content"},a.createElement(M.GY,{as:"h2",maxWidth:11.3369565217},a.createElement("strong",null,l)),c&&a.createElement(p.A,{content:c,paragraphSize:"heading4Serif",className:"title"}),s.tags.length>0&&a.createElement(a.Fragment,null,a.createElement(g.A,{size:[15,40]}),a.createElement(M.HL,null,s.tags[0].name.split(": ").length>1?s.tags[0].name.split(": ")[1]:s.tags[0].name))),d&&a.createElement(I,{className:"caseStudyImage"},a.createElement(F.G,{image:d.gatsbyImageData,alt:d.description})),"list"===i&&a.createElement(k,null,a.createElement(q.A,null)))))},P=i(70127),L=i(47634);const j=c.default.div.withConfig({displayName:"ServiceFilterMain",componentId:"sc-1vf0ywp-0"})(["position:relative;","{flex:1;}"],f.mq.tabletPMax),D=c.default.div.withConfig({displayName:"ServiceFilterButton",componentId:"sc-1vf0ywp-1"})(["display:flex;align-items:center;padding:8px 10px 8px 25px;border:1px solid ",";border-radius:7rem;cursor:pointer;background:",";max-width:233px;","{margin-left:auto;padding:5px 5px 5px 14px;}svg{margin-right:auto;width:24px;height:26px;}"],r.T.charcoal,r.T.white,f.mq.tabletPMax),W=c.default.div.withConfig({displayName:"ServiceFilterTitle",componentId:"sc-1vf0ywp-2"})(["",";flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-right:10px;line-height:22px;"],(0,L.qE)("font-size",15,22)),B=c.default.div.withConfig({displayName:"ServiceFilterDropdown",componentId:"sc-1vf0ywp-3"})(["position:absolute;max-height:412px;overflow-y:auto;scrollbar-width:thin;top:calc(100% + 12px);border:1px solid #E8E8E8;box-shadow:1px 0px 20px rgba(218,218,218,0.5);background:",";border-radius:4px;z-index:5;transition:all 0.25s ease;opacity:",";transform:",";visibility:",";right:0;width:calc(100vw - 30px);max-width:410px;","{width:412px;left:-20px;}"],r.T.white,e=>e.active?"1":"0",e=>e.active?"translateY(0)":"translateY(-10px)",e=>e.active?"visible":"hidden",f.mq.desk),_=c.default.div.withConfig({displayName:"ServiceFilterItem",componentId:"sc-1vf0ywp-4"})(["padding:20px;cursor:pointer;display:flex;align-items:center;",";&:hover{background:#E8E8E8;}&:not(:last-child){border-bottom:1px solid #E8E8E8;}"],(0,L.qE)("font-size",16,22)),O=c.default.div.withConfig({displayName:"Check",componentId:"sc-1vf0ywp-5"})(["height:20px;width:20px;display:flex;justify-content:center;align-items:center;border:2px solid ",";border-radius:2px;margin-right:10px;background:",";svg{color:",";opacity:",";height:18px;width:18px;stroke-width:3px;position:absolute;}"],r.T.charcoal,e=>e.active?r.T.charcoal:r.T.white,r.T.white,e=>e.active?"1":"0");var Y=i(92583);var U=e=>{let t=e.item,i=e.handleClick,n=e.currentServiceFilter;const l=(0,a.useState)(!1),r=l[0],o=l[1];return(0,a.useEffect)(()=>{n.includes(t.slug)?o(!0):o(!1)},[n]),a.createElement(_,{onClick:()=>i(t.slug)},a.createElement(O,{active:r},a.createElement(Y.A,null)),t.title)},G=i(64726),R=i(15070);var $=e=>{let t=e.items,i=e.setCurrentServiceFilter,n=e.currentServiceFilter;const l=(0,a.useState)(!1),r=l[0],o=l[1],c=e=>{i(e)};return(0,a.useEffect)(()=>{window.addEventListener("mainClicked",e=>{const t=e.detail.targets;if(t&&t!==document.body){(function(e,t){let i=e.parentElement;for(;i&&!i.classList.contains(t);)i=i.parentElement;return i})(t,"sFDrop")||o(!1)}})},[]),a.createElement(j,{className:"sFDrop"},a.createElement(D,{onClick:()=>o(!r)},a.createElement(W,null,n.length>0?"Services Filter ("+n.length+")":"Filter by service"),r?a.createElement(R.A,null):a.createElement(G.A,null)),a.createElement(B,{active:r},t&&t.map((e,t)=>a.createElement(U,{handleClick:c,key:t,currentServiceFilter:n,item:e}))))},H=i(53530);

1const K=c.default.div.withConfig({displayName:"FiltersControls",componentId:"sc-pnc8fe-0"})(["display:flex;flex-wrap:wrap;gap:20px;button{text-transform:capitalize;",";line-height:15px;> div{padding:12px 16px !important;","{border:unset !important;background:transparent !important;color:"," !important;span{display:flex;align-items:center;}}}","{width:100%;padding:12px 5px;cursor:pointer;display:flex;align-items:center;justify-content:flex-start;&:not(:last-child){border-bottom:1px solid #E8E8E8;}}}","{display:block;position:absolute;width:320px;max-width:calc(100vw - 60px);left:0;top:calc(100% + 12px);border:1px solid #E8E8E8;box-shadow:1px 0px 20px rgba(218,218,218,0.5);background:",";border-radius:4px;z-index:5;transition:all 0.25s ease;opacity:",";transform:",";visibility:",";}"],(0,L.qE)("font-size",16,20),f.mq.tabletLMax,r.T.charcoal,f.mq.tabletLMax,f.mq.tabletLMax,r.T.white,e=>e.active?"1":"0",e=>e.active?"translateY(0)":"translateY(-10px)",e=>e.active?"visible":"hidden"),Q=c.default.div.withConfig({displayName:"FiltersContainer",componentId:"sc-pnc8fe-1"})(["position:relative;margin-right:auto;flex:1;"]),V=c.default.div.withConfig({displayName:"FiltersButton",componentId:"sc-pnc8fe-2"})(["display:flex;align-items:center;border:1px solid ",";border-radius:7rem;cursor:pointer;background:",";max-width:233px;padding:5px 5px 5px 14px;svg{margin-right:auto;width:24px;height:26px;}","{display:none;}"],r.T.charcoal,r.T.white,f.mq.tabletL),X=c.default.div.withConfig({displayName:"FiltersTitle",componentId:"sc-pnc8fe-3"})(["font-size:14px;flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-right:10px;line-height:15px;","{text-overflow:clip;}"],f.mq.mobileMax),Z=c.default.div.withConfig({displayName:"Check",componentId:"sc-pnc8fe-4"})(["","{display:none;}

1height:20px;width:20px;display:flex;justify-content:center;align-items:center;border:2px solid ",";border-radius:2px;margin-right:10px;background:",";svg{color:",";opacity:",";height:18px;width:18px;stroke-width:3px;position:absolute;}"],f.mq.tabletL,r.T.charcoal,e=>e.active?r.T.charcoal:r.T.white,r.T.white,e=>e.active?"1":"0");var J=e=>{let t=e.item,i=e.setCurrentFilter,n=e.currentFilter;const l=t.title,r=t.filter;return a.createElement(H.A,{variant:"outline",onClick:()=>{i(r)},color:"filters",disabled:n===r},a.createElement(Z,{active:n===r},a.createElement(Y.A,null)),l)};var ee=e=>{let t=e.changeFilter,i=(e.handleActivateAll,e.currentFilter);const n=(0,a.useState)(),l=n[0],r=n[1],o=e=>{r(!1),t(e)};return a.createElement(Q,null,a.createElement(V,{onClick:()=>r(!l)},a.createElement(X,null,"Business Units"),l?a.createElement(R.A,null):a.createElement(G.A,null)),a.createElement(K,{className:"scroll-container",active:l},[{title:"All",slug:"all",filter:""},{title:"Paid Performance",slug:"paid-performance",filter:"Service: Paid Performance"},{title:"Organic Performance",slug:"organic-performance",filter:"Service: Organic Performance"},{title:"Digital Media Network",slug:"digital-media-network",filter:"Service: Digital Media Network"},{title:"Fan Engagement",slug:"fan-engagement",filter:"Service: Fan Engagement"},{title:"Technology & Experience",slug:"technology-and-experience",filter:"Service: Technology & Experience"},{title:"Social & Influencer",slug:"social-influencer",filter:"Service: Social & Influencer"},{title:"Insights & Consultancy",slug:"insights-consultancy",filter:"Service: Insights & Consultancy"}].map((e,t)=>a.createElement(J,{item:e,setCurrentFilter:o,currentFilter:i,key:t}))))};var te=e=>{let t=e.caseStudies;const i=(0,a.useState)(""),n=i[0],r=i[1],o=(0,a.useState)([]),c=o[0],s=o[1],d=(0,a.useState)(t),p=d[0],m=d[1],u=(0,a.useState)([]),f=u[0],x=u[1],S=(0,l.Pj)(),k=S[0],I=S[1],A=k.displayList,T=e=>e.trim().toLowerCase().replace(/ /g,"_").replace(/[^\w-]+/g,"");(0,a.useEffect)(()=>{const e=localStorage.getItem("display"),i=localStorage.getItem("filter");(0,l.F_)(I,"grid"!==e),r(i||"");const a=t.reduce((e,t)=>t.content&&t.content.length>0?[].concat((0,h.A)(e),(0,h.A)(t.content[0].services)):e,[]);x((0,h.A)(new Set(a)).map(e=>({title:e,slug:T(e)})));const n=window.location.search,o=new URLSearchParams(n);o.get("service")&&(s([o.get("service")]),r(""))},[]),(0,a.useEffect)(()=>{N(c)},[c]);const N=e=>{const i=e.reduce((e,t)=>(e.includes(t)||e.push(t),e),[]);if(i[0]&&i.length>0){const e=t.filter(e=>{if(e.content&&e.content.length>0){const t=e.content[0].services||[];return i.some(e=>{if(e)return t.some(t=>T(t).includes(e))})}});m(e)}else m(t)};return a.createElement(w,{id:"ourWorks"},a.createElement(v,null,a.createElement(y,null,"Filter by:"),a.createElement(ee,{changeFilter:e=>{localStorage.setItem("filter",e),r(e);const t=document.getElementById("ourWorks");window.scrollTo({top:t.offsetTop,left:0,behavior:"smooth"})},handleActivateAll:()=>{localStorage.setItem("filter",""),r("")},currentFilter:n}),a.createElement($,{items:f,setCurrentServiceFilter:e=>{c.includes(e)?s(c.filter(t=>t!==e)):s([].concat((0,h.A)(c),[e]))},currentServiceFilter:c}),a.createElement(P.A,null)),a.createElement(b,{className:"mainPin",id:"displayParent"},a.createElement(g.A,{size:[1,80]}),a.createElement(E.A,{className:A?"listMain":"gridMain",columnCount:12},null==p?void 0:p.map(e=>a.createElement(a.Fragment,null,""!==n?e.metadata.tags.filter(e=>n===e.name).length>0?a.createElement(C.A,{tabletL:A?12:4,key:e.slug},a.createElement(z,{data:e,display:A?"list":"grid"})):null:a.createElement(C.A,{tabletL:A?12:4,key:e.slug},a.createElement(z,{data:e,display:A?"list":"grid"}))))),a.createElement(g.A,{size:[50,A?40:90]}),a.createElement("div",{className:"endTrigger"}),a.createElement(g.A,{size:60})))},ie=i(19175);var ae=e=>{let t=e.data,i=e.location;const o=(0,l.Pj)()[1],c=t.contentfulOurWorks,s=c.seo,d=c.slug,p=c.introText,m=c.footer,g=t.allContentfulCaseStudy.nodes;return(0,a.useEffect)(()=>{(0,l.PP)(o,r.T.white,r.T.charcoal),(0,l.W2)(o,!0),(0,l.VZ)(o,!0)},[o,i]),a.createElement(a.Fragment,null,a.createElement(n.A,{data:s,slug:d}),a.createElement(u,{title:p}),a.createElement(te,{caseStudies:g}),a.createElement(ie.A,{content:m}))}},15070:function(e,t,i){var a=i(96540);t.A=e=>{let t=e.width,i=void 0===t?37:t,n=e.height,l=void 0===n?37:n,r=e.color,o=void 0===r?"currentColor":r,c=e.responsive;const s=void 0===c||c?{}:{width:i,height:l};return a.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 39 39","aria-hidden":"true",focusable:"false",fill:"none",stroke:o,"stroke-width":"1",width:i,height:l},s),a.createElement("g",null,a.createElement("path",{d:"M18.5,1.25c9.51,0,17.25,7.74,17.25,17.25S28.01,35.75,18.5,35.75S1.25,28.01,1.25,18.5S8.99,1.25,18.5,1.25 M18.5,0.25\r C8.42,0.25,0.25,8.42,0.25,18.5S8.42,36.75,18.5,36.75s18.25-8.17,18.25-18.25S28.58,0.25,18.5,0.25L18.5,0.25z"})),a.createElement("g",null,a.createElement("g",{transform:"translate(-1356, -1941)"},a.createElement("g",{transform:"translate(1346, 1925)"},a.createElement("polygon",{fill:o,points:"36.04,34.44 36.04,35.44 20.54,35.44 20.54,34.44 \t\t\t"})))))}},19175:function(e,t,i){i.d(t,{A:function(){return h}});var a=i(96540),n=i(63679),l=i(17657);const r=n.default.section.withConfig({displayName:"PageFooterMain",componentId:"sc-1yf2liy-0"})(["color:",";background-color:",";","{align-items:end;}"],e=>e.color,e=>e.background,l.W),o=n.default.div.withConfig({displayName:"PageFooterWrapper",componentId:"sc-1yf2liy-1"})(["position:relative;"]),c=n.default.div.withConfig({displayName:"CMSButtonContainer",componentId:"sc-1yf2liy-2"})(["display:flex;justify-content:flex-end;"]);var s=i(73517),d=i(88963),p=i(64232),m=i(17203),g=i(24499),u=i(12430);var h=e=>{let t=e.content;t.title;const i=t.text,n=(t.image,t.link),l=t.backgroundColour?t.backgroundColour:d.T.charcoal,h=t.textColour?t.textColour:d.T.white;return a.createElement(r,{color:h,background:l,id:"footerMain"},a.createElement(s.A,null,a.createElement(o,null,a.createElement(p.A,{size:[30,60]}),a.createElement(u.A,{content:i,maxWidth:80,paragraphSize:"heading1Serif"}),a.createElement(p.A,{size:[40,60]}),a.createElement(c,null,a.createElement(m.A,{link:n,className:"contactLink",iconRight:a.createElement(g.A,null),enterFrom:"left"})),a.createElement(p.A,{size:[20,40]}))))}},64726:function(e,t,i){var a=i(96540);t.A=e=>{let t=e.width,i=void 0===t?37:t,n=e.height,l=void 0===n?37:n,r=e.color,o=void 0===r?"currentColor":r,c=e.responsive;const s=void 0===c||c?{}:{width:i,height:l};return a.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 39 39","aria-hidden":"true",focusable:"false",fill:"none",stroke:o,"stroke-width":"1",width:i,height:l},s),a.createElement("g",null,a.createElement("path",{d:"M18.5,1.25c9.51,0,17.25,7.74,17.25,17.25S28.01,35.75,18.5,35.75S1.25,28.01,1.25,18.5S8.99,1.25,18.5,1.25 M18.5,0.25\r C8.42,0.25,0.25,8.42,0.25,18.5S8.42,36.75,18.5,36.75s18.25-8.17,18.25-18.25S28.58,0.25,18.5,0.25L18.5,0.25z"})),a.createElement("g",null,a.createElement("g",{transform:"translate(-1356, -2171)"},a.createElement("g",{transform:"translate(1346, 2162)"},a.createElement("polygon",{fill:o,points:"29,19.75 29,27 36.25,27 36.25,28 29,28 29,35.25 28,35.25 \r 28,28 20.75,28 20.75,27 28,27 28,19.75"})))))}},68719:function(e,t,i){var a=i(54506),n=i(96540),l=i(68154),r=i(64810);t.A=function(e){let t=e.data,i=e.slug,o=e.meta,c=void 0===o?[]:o,s=e.preLoadImages,d=void 0===s?[]:s,p=e.noFollow,m=void 0!==p&&p;const g=t.seoTitle,u=t.seoDescription,h=t.seoImage,f=(0,r.useStaticQuery)("3452395298").contentfulGlobals,x=f.siteUrl,w=f.siteTitle,v=f.siteDescription.siteDescription,y=f.siteShareImage,b=f.twitterUsername,E=x.replace(/\/$/,"")+"/"+(""===i?"":i.replace(/^\/+|\/+$/g,"")+"/"),C=g?g+" | "+w:w,S=(null==u?void 0:u.seoDescription)||v,k=[{name:"description",content:S},{name:"robots",content:m?"noindex, nofollow":"follow, index, max-snippet:-1, max-video-preview:-1, max-image-preview:large"},{property:"og:title",content:C},{property:"og:description",content:S},{property:"og:image",content:"https:"+(h?h.file.url:y.file.url)},{property:"og:type",content:"website"},{property:"og:url",content:E},{name:"twitter:card",content:"summary_large_image"},{name:"twitter:title",content:C},{name:"twitter:description",content:S}];b&&k.push({name:"twitter:site",content:"@"+b});const I=[{rel:"canonical",href:E}],A=d.map(e=>({rel:"preload",href:e.file.url,as:"image",fetchpriority:"high",type:"image/webp"}));return n.createElement(l.m,{htmlAttributes:{lang:"en"},title:C,meta:[].concat(k,(0,a.A)(c)),link:[].concat(I,(0,a.A)(A))})}}}]);
2//# sourceMappingURL=component---src-templates-our-works-js-22b74b19b7aeec18cd81.js.map