{"version":3,"file":"component---src-templates-ambassador-js-70abb61a8bd5bb877c89.js","mappings":"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","sources":["webpack://stox/./src/components/shared/AmbassadorItem.js","webpack://stox/./src/templates/Ambassador.js"],"sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\nimport { desktopVW, mobileVW } from '../../styles'\nimport theme from '../../styles/theme'\nimport { SiteLink } from './SiteLink'\nimport Image from 'gatsby-image'\n\nconst { colors, easeOut, breakPoints, fontFamily, headerHeight } = theme\n\nconst AmbassadorItem = ({ data }) => {\n  const { name, subTitle, seoImage: image, slug } = data ?? {}\n\n  return (\n    <Ambassador>\n      <ImageWrapper>\n        {image && <Img fluid={image.fluid} alt={image.title} />}\n      </ImageWrapper>\n      <Inner>\n        <div>\n          <Title>{name}</Title>\n          <p>{subTitle}</p>\n        </div>\n      </Inner>\n      <Link to={slug} />\n    </Ambassador>\n  )\n}\n\nconst Img = styled(Image)`\n  position: absolute !important;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  transition: 0.3s ease transform;\n`\n\nconst Ambassador = styled.div`\n  position: relative;\n  display: flex;\n  flex-flow: column;\n\n  @media screen and (min-width: ${breakPoints.desktop}) {\n    &:hover ${Img} {\n      transform: scale(1.05);\n    }\n  }\n`\n\nconst ImageWrapper = styled.div`\n  position: relative;\n  background: ${colors.lightGrey};\n  display: flex;\n  overflow: hidden;\n\n  &::before {\n    content: '';\n    width: 100%;\n    padding-top: 100%;\n  }\n`\n\nconst Inner = styled.div`\n  display: flex;\n  align-items: center;\n  font-size: ${mobileVW(14)};\n  color: ${colors.grey};\n  line-height: 1.5;\n  margin-top: ${mobileVW(16)};\n\n  &::after {\n    content: '+';\n    display: block;\n    margin-left: auto;\n    font-size: ${mobileVW(20)};\n  }\n\n  @media screen and (min-width: ${breakPoints.desktop}) {\n    font-size: ${desktopVW(14, 1440)};\n    margin-top: ${desktopVW(16, 1440)};\n\n    &::after {\n      font-size: ${desktopVW(20, 1440)};\n    }\n  }\n`\n\nconst Link = styled(SiteLink)`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  z-index: 5;\n`\n\nconst Title = styled.h6`\n  font-size: ${mobileVW(20)};\n  color: ${colors.black};\n\n  @media screen and (min-width: ${breakPoints.desktop}) {\n    font-size: ${desktopVW(20, 1440)};\n  }\n`\n\nexport default AmbassadorItem\n","import React, { useContext } from 'react'\nimport BlockRenderer from '../components/shared/BlockRenderer'\nimport { graphql } from 'gatsby'\nimport { LayoutContext } from '../contexts'\nimport { useGlobal } from '../hooks/useGlobal'\nimport { SiteLink } from '../components/shared/SiteLink'\nimport BreadCrumb from '../components/shared/BreadCrumb'\nimport { desktopVW, mobileVW } from '../styles'\nimport theme from '../styles/theme'\nimport styled from 'styled-components'\nimport SEO from '../components/SEO'\nimport AmbassadorItem from '../components/shared/AmbassadorItem'\n\nconst { breakPoints, colors } = theme\n\nconst Ambassador = ({\n  location,\n  data: {\n    contentfulPage: {\n      name,\n      seoTitle,\n      seoDescription,\n      seoImage,\n      componentBlocks,\n      layoutType,\n    },\n    relatedAmbassadors,\n    allTrustPilotSummary: {\n      nodes: [\n        {\n          score: { trustpilotStars },\n          totalNumberOfReviews,\n        },\n      ],\n    },\n  },\n}) => {\n  const { node_locale } = useContext(LayoutContext)\n\n  const { layout: dictionary } = useGlobal(['layout'], node_locale)\n\n  return (\n    <>\n      <SEO\n        isPage\n        location={location}\n        title={seoTitle}\n        description={seoDescription}\n        image={seoImage?.file?.url}\n        noIndex={layoutType && layoutType.noIndex}\n        referrer={location.state?.referrer}\n      />\n      <Header>\n        <BreadCrumb>\n          {dictionary?.home && <SiteLink>{dictionary.home}</SiteLink>}\n          {' / '}\n          {dictionary?.ambassadorOverview && (\n            <SiteLink to={dictionary.ambassadorOverview.target?.slug}>\n              {dictionary.ambassadorOverview.title}\n            </SiteLink>\n          )}{' '}\n          / {name}\n        </BreadCrumb>\n      </Header>\n      <div>\n        <BlockRenderer\n          blocks={componentBlocks}\n          location={location}\n          related={relatedAmbassadors.nodes.map((i) => (\n            <AmbassadorItem key={i.id} data={i} />\n          ))}\n          rating={{\n            totalNumberOfReviews,\n            trustpilotStars,\n          }}\n        />\n      </div>\n    </>\n  )\n}\n\nconst Header = styled.div`\n  margin: ${mobileVW(10)} auto;\n  font-size: ${mobileVW(10)};\n  width: 90%;\n  color: ${colors.grey};\n\n  @media screen and (min-width: ${breakPoints.desktop}) {\n    max-width: ${desktopVW(1200, 1440)};\n    font-size: ${desktopVW(12, 1440)};\n    margin: ${desktopVW(40, 1440)} auto;\n  }\n`\n\nexport const pageQuery = graphql`\n  query Ambassador($id: String!, $node_locale: String!) {\n    contentfulPage(id: { eq: $id }) {\n      id\n      name\n      seoTitle\n      seoDescription\n      seoImage {\n        file {\n          url\n        }\n      }\n      layoutType {\n        name\n        noIndex\n      }\n      template\n      componentBlocks {\n        ...pageBlocks\n      }\n    }\n\n    relatedAmbassadors: allContentfulPage(\n      filter: {\n        id: { ne: $id }\n        node_locale: { eq: $node_locale }\n        template: { eq: \"Ambassador\" }\n      }\n      limit: 3\n    ) {\n      nodes {\n        ...ambassadorItem\n      }\n    }\n\n    allTrustPilotSummary {\n      ...pageRatings\n    }\n  }\n`\n\nexport default Ambassador\n"],"names":["colors","theme","breakPoints","Img","styled","Image","Ambassador","desktop","ImageWrapper","lightGrey","Inner","mobileVW","grey","desktopVW","Link","SiteLink","Title","black","data","name","subTitle","image","seoImage","slug","fluid","alt","title","to","Header","location","contentfulPage","seoTitle","seoDescription","componentBlocks","layoutType","relatedAmbassadors","allTrustPilotSummary","nodes","trustpilotStars","score","totalNumberOfReviews","node_locale","useContext","LayoutContext","dictionary","useGlobal","layout","isPage","description","file","url","noIndex","referrer","state","home","ambassadorOverview","target","blocks","related","map","i","key","id","rating"],"sourceRoot":""}