{"version":3,"sources":["webpack:///./src/components/atomic-design/molecules/navigation-cards/post-card/styles.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/post-card/index.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/arrows/styles.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/arrows/previous.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/arrows/next.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/work-card/styles.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/work-card/index.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/careers-card/styles.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/careers-card/index.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/styles.js","webpack:///./src/components/atomic-design/molecules/navigation-cards/index.js","webpack:///./src/components/atomic-design/molecules/work/styles.js","webpack:///./src/components/atomic-design/molecules/work/index.js"],"names":["CardStyled","styled","div","theme","newTheme","color","white","shadow","main","border","radius","medium","props","breakpoints","tabletLandscape","transition","InformationContainer","spacing","maxWidthText","mobile","TopContainerStyled","grey","light","font","weight","regular","text3","size","lineHeight","TitleContainer","TitleStyled","h3","text2","CallToAction","IconContainer","PostCards","post","validateBlogPostEntry","alt","title","contentful_id","hero","fromContentful","padding","width","tabletLandscapeWidth","mobileHeight","smallMobileWidth","smallMobileHeight","height","getCategoryColor","category","slug","name","formatDate","publishedDate","trimEllipsis","key","obj","reqFields","ArrowNextLabelStyled","Link","Text","p","colorText","ArrowPreviousLabelStyled","h4","fonts","family","secondary","primary","PreviousArrow","from","text","colorHover","to","isMobile","useIsMobile","fill","defaultProps","dark","NextArrow","CardContainer","WorkCard","validateCaseStudyEntry","xs","sm","md","lg","thumbnail","subtitle","type","LimitedAbstract","LocationContainer","semiBold","title6","CareersCard","location","NavigationButtonsStyled","colors","NavigationCards","img","CardComponent","previous","next","withArrow","previousTo","nextTo","toLowerCase","arrowText","PostCard","rel","Container","tablet","WorkType","h6","Title","h5","Subtitle","Work","flex"],"mappings":"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","file":"134b56e1b2d4919e9460be5c9ccc4b03293f3b48-fb5d3810a974323c9cd7.js","sourcesContent":["import styled from 'styled-components';\r\n\r\nexport const CardStyled = styled.div`\r\n  background: ${({ theme }) => theme.newTheme.color.white};\r\n  display: flex;\r\n  box-shadow: ${({ theme }) => theme.newTheme.shadow.main};\r\n  border-radius: ${({ theme }) => theme.newTheme.border.radius.medium};\r\n  width: 31.3rem;\r\n  max-width: 31.3rem;\r\n  height: 14.8rem;\r\n  overflow: hidden;\r\n\r\n  @media only screen and (${props => props.theme.breakpoints.tabletLandscape}) {\r\n    display: none;\r\n  }\r\n  &:hover {\r\n    h5 {\r\n      text-decoration: underline;\r\n    }\r\n\r\n    @keyframes zoom {\r\n      from {\r\n        transform: scale(1);\r\n      }\r\n      to {\r\n        transform: scale(1.05);\r\n      }\r\n    }\r\n\r\n    img {\r\n      animation: zoom 0.3s ease-in-out 0s 1;\r\n      transform: scale(1.05);\r\n    }\r\n\r\n    svg {\r\n      transition: ${({ theme }) => theme.newTheme.transition.main};\r\n      transform: translateY(10px);\r\n    }\r\n  }\r\n`;\r\n\r\nexport const InformationContainer = styled.div`\r\n width: 120%;\r\npadding: ${({ theme }) => `${theme.newTheme.spacing(5)} ${theme.newTheme.spacing(6)}`};\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  max-width: ${props => props.maxWidthText};\r\n  height: 100%;\r\n\r\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\r\n    max-width: 100%;\r\n    flex-grow: 1;\r\n\r\n  }\r\n`;\r\n\r\nexport const TopContainerStyled = styled.div`\r\n  display: flex;\r\n  width: 100%;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  max-width: 100%;\r\n  box-shadow: none;\r\n  h4 {\r\n    margin: 0;\r\n    padding: 0;\r\n    color: ${({ theme }) => theme.newTheme.color.grey.light};\r\n    font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\r\n    font-size: ${({ theme }) => theme.newTheme.font.text3.size};\r\n    line-height: ${({ theme }) => theme.newTheme.font.text3.lineHeight};\r\n  }\r\n\r\n  div {\r\n    color: ${({ theme }) => theme.newTheme.color.white};\r\n    font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\r\n    font-size: ${({ theme }) => theme.newTheme.font.text3.size};\r\n    line-height: ${({ theme }) => theme.newTheme.font.text3.lineHeight};\r\n  }\r\n`;\r\n\r\nexport const TitleContainer = styled.div`\r\n  margin: ${({ theme }) => `${theme.newTheme.spacing(7)} 0`};\r\n`;\r\n\r\nexport const TitleStyled = styled.h3`\r\n  -webkit-box-orient: vertical;\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 3;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  color: ${({ theme }) => theme.newTheme.color.grey.main};\r\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.medium} !important;\r\n  font-size: ${({ theme }) => theme.newTheme.font.text2.size} !important;\r\n  line-height: ${({ theme }) => theme.newTheme.font.text2.lineHeight} !important;\r\n  margin: ${({ theme }) => `${theme.newTheme.spacing(3)} 0 0 0`};\r\n  width: 100%;\r\n`;\r\n\r\nexport const CallToAction = styled.div`\r\n  width: 100%;\r\n  height: 10%;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: ${({ theme }) => theme.newTheme.spacing(4)};\r\n  p {\r\n    font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\r\n    font-size: ${({ theme }) => theme.newTheme.font.text3.size};\r\n    line-height: ${({ theme }) => theme.newTheme.font.text3.lineHeight};\r\n    color: ${({ theme }) => theme.newTheme.color.grey.light};\r\n\r\n    @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\r\n      margin: 0;\r\n    }\r\n  }\r\n\r\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\r\n    gap: ${({ theme }) => theme.newTheme.spacing(2)};\r\n  }\r\n  \r\n`;\r\n\r\nexport const IconContainer = styled.div`\r\n  transform: rotate(-90deg);\r\n\r\n  svg {\r\n    transition: ${({ theme }) => theme.newTheme.transition.main};\r\n    height: ${({ theme }) => theme.newTheme.spacing(5)};\r\n  }\r\n`;\r\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Chip from 'atomic-design/atoms/chip';\nimport { formatDate, getCategoryColor } from 'common/helpers';\nimport { trimEllipsis } from 'common/string-helpers';\nimport Image from 'core/image';\nimport { ChevronArrow } from 'ui/svg';\nimport theme from 'styles/theme';\n\nimport {\n  CardStyled,\n  TopContainerStyled,\n  TitleStyled,\n  InformationContainer,\n  TitleContainer,\n  CallToAction,\n  IconContainer\n} from './styles';\nimport MissingDataCard from '../../../atoms/missing-data-card';\nimport { validateBlogPostEntry } from '../../../../../common/validations';\n\nconst PostCards = ({ post }) => {\n  const requiredFields = [\n    'title',\n    'subtitle',\n    'slug',\n    'excerpt',\n    'publishedDate',\n    'hero',\n    'category',\n  ];\n  return (\n    <>\n      {validateBlogPostEntry(post) ?\n      <CardStyled>\n        <Image\n          alt={post.title}\n          contentful_id={post.hero?.contentful_id}\n          fromContentful\n          padding=\"0\"\n          width=\"100%\"\n          tabletLandscapeWidth=\"inherit\"\n          mobileHeight=\"100px\"\n          smallMobileWidth=\"inherit\"\n          smallMobileHeight=\"100px\"\n          height=\"inherit\"\n        />\n        <InformationContainer>\n          <TopContainerStyled>\n            <Chip color={getCategoryColor(post.category.slug)}>{post.category.name }</Chip>\n            <h4>{formatDate(post.publishedDate)}</h4>\n          </TopContainerStyled>\n          <TitleContainer>\n            <TitleStyled color={getCategoryColor(post.category.slug)}>\n              {trimEllipsis(post.title)}\n            </TitleStyled>\n          </TitleContainer>\n          <CallToAction>\n            <p>{'Read the complete article'}</p>\n            <IconContainer>\n              <ChevronArrow color={theme.newTheme.color.grey.light} />\n            </IconContainer>\n          </CallToAction>\n\n        </InformationContainer>\n      </CardStyled>\n      :\n      (<MissingDataCard key={post.slug} obj={post} reqFields={requiredFields}></MissingDataCard>)}\n    </>\n  );\n};\n\nPostCards.propTypes = {\n  post: PropTypes.object.isRequired,\n};\n\nexport default PostCards;\n","import styled from 'styled-components';\nimport Link from 'atomic-design/atoms/link';\n\nexport const ArrowNextLabelStyled = styled(Link)`\n  display: flex;\n  align-items: center;\n  width: 100%;\n  justify-content: flex-end;\n  padding-bottom: 26px;\n`;\n\nexport const Text = styled.p`\n  color: ${props => props.colorText};\n  padding: 0;\n  margin: 0 10px;\n`;\n\nexport const ArrowPreviousLabelStyled = styled(Link)`\n  display: flex;\n  align-items: center;\n  width: 100%;\n  justify-content: flex-start;\n  padding-bottom: 26px;\n`;\n\nexport const CardStyled = styled.div`\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  box-shadow: 0px 4px 5px -3px #888888;\n  border-radius: 9px;\n  width: 100%;\n  height: fit-content;\n  min-height: 162px;\n  width: 333px;\n  max-width: 333px;\n\n  h3 {\n    color: ${props => props.color};\n    padding: 9px 27px 0 27px;\n    font-weight: 500;\n  }\n\n  @media only screen and (${props => props.theme.breakpoints.mobile}) {\n    display: none;\n  }\n`;\n\nexport const TopContainerStyled = styled.div`\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  max-width: 100%;\n  box-shadow: none;\n  padding: 18px;\n  h4 {\n    margin: 0;\n    padding: 0;\n    color: #979797;\n  }\n`;\n\nexport const TitleStyled = styled.h3`\n  color: ${props => props.color};\n  margin: 0;\n`;\n\nexport const TopWork = styled.h4`\n  font-family: ${({ theme }) => theme.fonts.family.secondary};\n  font-style: normal;\n  font-weight: normal;\n  font-size: 20px;\n  line-height: 30px;\n  letter-spacing: -0.02em;\n  color: #bdc7fc;\n`;\n\nexport const TopPosition = styled.h4`\n  font-style: normal;\n  font-weight: normal;\n  font-size: 20px;\n  line-height: 30px;\n  letter-spacing: -0.02em;\n  color: ${({ theme }) => theme.newTheme.color.primary.main};\n`;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { LeftArrow } from 'ui/svg';\nimport theme from 'styles/theme';\nimport { ArrowPreviousLabelStyled, Text } from './styles';\nimport useIsMobile from 'hooks/useIsMobile';\n\nconst PreviousArrow = ({ from, text, colorText, colorHover, to, slug }) => {\n  const isMobile = useIsMobile('mobile');\n  return (\n    <ArrowPreviousLabelStyled to={to} alt={slug}>\n      <LeftArrow width=\"17\" height=\"15\" fill={colorText} />\n      <Text colorText={colorText} colorHover={colorHover}>\n        {text}{!isMobile && (\" \"+from)}\n      </Text>\n    </ArrowPreviousLabelStyled>\n  );\n};\n\nPreviousArrow.propTypes = {\n  text: PropTypes.string.isRequired,\n  from: PropTypes.string,\n  colorText: PropTypes.string,\n  colorHover: PropTypes.string,\n};\n\nPreviousArrow.defaultProps = {\n  colorText: theme.newTheme.color.primary.main,\n  colorHover: theme.newTheme.color.primary.dark,\n  from: '',\n};\n\nexport default PreviousArrow;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { RightArrow } from 'ui/svg';\nimport theme from 'styles/theme';\nimport { ArrowNextLabelStyled, Text } from './styles';\nimport useIsMobile from 'hooks/useIsMobile';\n\n\nconst NextArrow = ({ from, text, colorText, colorHover, to, slug }) => {\n  const isMobile = useIsMobile('mobile');\n\n  return (\n    <ArrowNextLabelStyled to={to} alt={slug}>\n      <Text colorText={colorText} colorHover={colorHover}>\n        {text}{!isMobile && (\" \"+from)}\n      </Text>\n      <RightArrow width=\"17\" height=\"15\" fill={colorText} />\n    </ArrowNextLabelStyled>\n  );\n};\n\nNextArrow.propTypes = {\n  text: PropTypes.string.isRequired,\n  from: PropTypes.string.isRequired,\n  colorText: PropTypes.string,\n  colorHover: PropTypes.string,\n};\n\nNextArrow.defaultProps = {\n  colorText: theme.newTheme.color.primary.main,\n  colorHover: theme.newTheme.color.primary.dark,\n  from: '',\n};\n\nexport default NextArrow;\n","import styled from 'styled-components';\n\nexport const CardContainer = styled.div`\n  display: flex;\n  width: 31.3rem;\n  max-width: 31.3rem;\n  height: 14.8rem;\n\n  @media only screen and (${props => props.theme.breakpoints.tabletLandscape}) {\n    display: none;\n  }\n`;\n\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Work from 'atomic-design/molecules/work';\nimport { CardContainer } from './styles';\nimport MissingDataCard from '../../../atoms/missing-data-card';\nimport { Col } from 'react-grid-system';\nimport { validateCaseStudyEntry } from '../../../../../common/validations';\n\nconst WorkCard = ({ post }) => {\n  const requiredFields = ['title', 'slug', 'LimitedAbstract', 'thumbnail'];\n  return (\n    <>\n      {validateCaseStudyEntry(post) ? (\n        <CardContainer>\n          <Col xs={12} sm={12} md={12} lg={12}>\n            <Work\n              key={post.slug}\n              slug={post.slug}\n              contentful_id={post.thumbnail.contentful_id}\n              title={post.title}\n              subtitle={post.subtitle}\n              type={post.LimitedAbstract}\n              height=\"15rem\"\n              maxWidthText=\"55%\"\n            />\n          </Col>\n        </CardContainer>\n      ) : (\n        <MissingDataCard key={post.slug} obj={post} reqFields={requiredFields}></MissingDataCard>\n      )}\n    </>\n  );\n};\n\nWorkCard.propTypes = {\n  post: PropTypes.object.isRequired,\n};\n\nexport default WorkCard;\n","import styled from 'styled-components';\r\n\r\nexport const CardStyled = styled.div`\r\n  background: ${({ theme }) => theme.newTheme.color.white};\r\n  display: flex;\r\n  box-shadow: ${({ theme }) => theme.newTheme.shadow.main};\r\n  border-radius: ${({ theme }) => theme.newTheme.border.radius.medium};\r\n  overflow: hidden;\r\n  flex-direction: column;\r\n  padding: ${({ theme }) => `${theme.newTheme.spacing(5)} ${theme.newTheme.spacing(10)}`};\r\n  width: ${({ theme }) => `${theme.newTheme.spacing(83)}`};\r\n  @media only screen and (${props => props.theme.breakpoints.tabletLandscape}) {\r\n    display: none;\r\n  }\r\n`;\r\n\r\nexport const LocationContainer = styled.div`\r\n  display: flex;\r\n  width: 100%;\r\n\r\n  max-width: 100%;\r\n  box-shadow: none;\r\n\r\n  padding: ${({ theme }) => `${theme.newTheme.spacing(4)} 0 0`};\r\n\r\n  h4 {\r\n    margin: 0;\r\n    padding: ${({ theme }) => `0 0 0 ${theme.newTheme.spacing(1)}`};\r\n    font-style: normal;\r\n    font-weight: normal;\r\n    font-size: 18px;\r\n    line-height: 30px;\r\n    letter-spacing: -0.02em;\r\n    color: ${({ theme }) => theme.newTheme.color.grey.light};\r\n  }\r\n\r\n  p {\r\n    color: ${({ theme }) => theme.newTheme.color.white};\r\n    font-family: ${({ theme }) => theme.newTheme.font.family};\r\n    font-size: ${({ theme }) => theme.newTheme.font.text3.size};\r\n    padding: 2px 0;\r\n    margin: 0;\r\n\r\n    &:hover {\r\n      color: ${({ theme }) => theme.newTheme.color.white};\r\n    }\r\n  }\r\n`;\r\n\r\nexport const TitleStyled = styled.h3`\r\n  -webkit-box-orient: vertical;\r\n  display: -webkit-box;\r\n  -webkit-line-clamp: 3;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.semiBold};\r\n  font-size: ${({ theme }) => theme.newTheme.font.title6.size};\r\n  line-height: ${({ theme }) => theme.newTheme.font.title6.lineHeight};\r\n  margin: ${({ theme }) => `${theme.newTheme.spacing(3)} 0 0 0`};\r\n  width: 100%;\r\n\r\n  color: ${({ theme }) => theme.newTheme.color.primary.main};\r\n  font-style: normal;\r\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.semiBold};\r\n  margin 0;\r\n`;\r\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { trimEllipsis } from 'common/string-helpers';\nimport { CardStyled, TitleStyled, LocationContainer } from './styles';\n\nconst CareersCard = ({ post }) => (\n  <CardStyled>\n    <TitleStyled>{trimEllipsis(post.title ? post.title : '', 18)}</TitleStyled>\n    <LocationContainer>\n      <h4>{post?.location?.name}</h4>\n    </LocationContainer>\n  </CardStyled>\n);\n\nCareersCard.propTypes = {\n  post: PropTypes.object.isRequired,\n};\n\nexport default CareersCard;\n","import styled from 'styled-components';\n\nexport const NavigationButtonsStyled = styled.div`\n  display: flex;\n  width: 100%;\n  align-items: space-between;\n  justify-content: space-between;\n  padding-bottom: 52px;\n\n  @media only screen and (${props => props.theme.newTheme.breakpoints.tabletLandscape}) {\n    padding-bottom: 0;\n    padding-top: ${({ theme }) => theme.newTheme.spacing(27)};\n  }\n\n  @media only screen and (${props => props.theme.newTheme.breakpoints.mobile}) {\n    padding-bottom: 0;\n    padding-top: ${({ theme }) => theme.newTheme.spacing(14)};\n  }\n`;\n\nexport const CardContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  cursor: pointer;\n  z-index: 4;\n  color: ${props => props.color};\n\n  &:hover {\n    h3 {\n      text-decoration: ${props => (props.slug === 'service' ? 'none' : 'underline')};\n      color: ${props => (props.slug === 'service' ? '#ffffff' : '')};\n    }\n    p {\n      color: ${({ theme }) => theme.newTheme.color.primary.dark};\n    }\n    h6 {\n      color: ${({ theme }) => theme.newTheme.color.primary.dark};\n    }\n    background: ${props => (props.slug === 'service' ? props.theme.colors.primary : '')};\n    border-radius: ${props => (props.slug === 'service' ? '9px' : '')};\n\n    @keyframes zoom {\n      from {\n        transform: scale(1);\n      }\n      to {\n        transform: scale(1.05);\n      }\n    }\n\n    img {\n      animation: zoom 0.3s ease-in-out 0s 1;\n      transform: scale(1.05);\n    }\n  }\n  &:active {\n    p {\n      color: #5d73f5;\n    }\n  }\n`;\n\nexport const ArrowNextLabelStyled = styled.div`\n  display: flex;\n  align-items: center;\n  width: 100%;\n  justify-content: flex-end;\n  p {\n    color: #979797;\n  }\n`;\n\nexport const ArrowPreviousLabelStyled = styled.div`\n  display: flex;\n  align-items: center;\n  width: 100%;\n  justify-content: flex-start;\n  p {\n    color: #979797;\n  }\n`;\n\nexport const ArrowStyled = styled.img`\n  width: 33px;\n  height: 30px;\n`;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport Link from 'atomic-design/atoms/link';\nimport PostCard from './post-card';\nimport PreviousArrow from './arrows/previous';\nimport NextArrow from './arrows/next';\nimport WorkCard from './work-card';\nimport CareersCard from './careers-card';\nimport { NavigationButtonsStyled, CardContainer } from './styles';\n\nconst NavigationCards = ({ previous, next, from, withArrow, previousTo, nextTo }) => {\n  let CardComponent;\n  const slug = from && from.toLowerCase();\n  let arrowText = '';\n\n  switch (from) {\n    case 'Work':\n      CardComponent = WorkCard;\n      arrowText = 'portfolio item';\n      break;\n    case 'Post':\n      CardComponent = PostCard;\n      arrowText = 'blog post';\n      break;\n    case 'Careers':\n      CardComponent = CareersCard;\n      arrowText = 'opening';\n      break;\n    case 'Guide':\n      CardComponent = PostCard;\n      arrowText = 'guide';\n      break;\n    default:\n      CardComponent = PostCard;\n      break;\n  }\n\n  return (\n    <>\n      {withArrow ? (\n        <NavigationButtonsStyled>\n          <CardContainer to={previousTo} slug={slug}>\n            <Link to={previousTo} rel=\"noreferrer\">\n              <PreviousArrow to={previousTo} slug={slug} from={arrowText} text=\"Previous\" />\n              <CardComponent post={previous} from={from} />\n            </Link>\n          </CardContainer>\n          <CardContainer to={nextTo} slug={slug}>\n            <Link to={nextTo} rel=\"noreferrer\">\n              <NextArrow to={nextTo} slug={slug} from={arrowText} text=\"Next\" />\n              <CardComponent post={next} from={from} />\n            </Link>\n          </CardContainer>\n        </NavigationButtonsStyled>\n      ) : (\n        <CardComponent\n          slug={slug}\n          previous={previous}\n          previousTo={previousTo}\n          next={next}\n          nextTo={nextTo}\n          from={from}\n        />\n      )}\n    </>\n  );\n};\n\nNavigationCards.propTypes = {\n  previous: PropTypes.string,\n  next: PropTypes.string,\n  from: PropTypes.string.isRequired,\n  withArrow: PropTypes.bool,\n};\n\nNavigationCards.defaultProps = {\n  withArrow: false,\n};\nexport default NavigationCards;\n","import styled from 'styled-components';\n\nexport const Container = styled.div`\n  display: flex;\n  margin: ${({ theme }) => theme.newTheme.spacing(5)} 0;\n  border-radius: ${({ theme }) => theme.newTheme.border.radius.medium};\n  overflow: hidden;\n  box-shadow: ${({ theme }) => theme.newTheme.shadow.main};\n  height: ${props => props.height};\n  background-color: ${({ theme }) => theme.newTheme.color.white};\n\n  &:hover {\n    h5 {\n      text-decoration: underline;\n    }\n\n    @keyframes zoom {\n      from {\n        transform: scale(1);\n      }\n      to {\n        transform: scale(1.05);\n      }\n    }\n\n    img {\n      animation: zoom 0.3s ease-in-out 0s 1;\n      transform: scale(1.05);\n    }\n\n    svg {\n      transition: ${({ theme }) => theme.newTheme.transition.main};\n      transform: translateY(10px);\n    }\n  }\n\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.tablet}) {\n    height: inherit;\n  }\n\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\n    flex-direction: column;\n    height: inherit;\n  }\n`;\n\nexport const WorkType = styled.h6`\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\n  font-size: ${({ theme }) => theme.newTheme.font.text2.size};\n  line-height: ${({ theme }) => theme.newTheme.font.text2.lineHeight};\n  color: ${({ theme }) => theme.newTheme.color.primary.main};\n  margin: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: 1;\n  line-clamp: 1;\n  -webkit-box-orient: vertical;\n`;\nexport const Title = styled.h5`\n  color: ${({ theme }) => theme.newTheme.color.grey.main};\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.medium};\n  font-size: ${({ theme }) => theme.newTheme.font.text2.size};\n  line-height: ${({ theme }) => theme.newTheme.font.text2.lineHeight};\n  margin: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  line-clamp: 3;\n  -webkit-box-orient: vertical;\n\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.tablet}) {\n    margin: ${({ theme }) => theme.newTheme.spacing(5)} 0;\n  }\n`;\nexport const Subtitle = styled.p`\n  margin: 0;\n  color: ${({ theme }) => theme.newTheme.color.grey.main};\n  font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\n  font-size: ${({ theme }) => theme.newTheme.font.text3.size};\n  line-height: ${({ theme }) => theme.newTheme.font.text3.lineHeight};\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  -webkit-box-orient: vertical;\n`;\n\nexport const InformationContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  padding: ${({ theme }) => theme.newTheme.spacing(6)};\n  max-width: ${props => props.maxWidthText};\n  height: 100%;\n\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\n    max-width: 100%;\n    flex-grow: 1;\n    ${Subtitle} {\n      display: none;\n    }\n  }\n`;\n\nexport const CallToAction = styled.div`\n  width: 100%;\n  height: 10%;\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.newTheme.spacing(4)};\n  p {\n    font-weight: ${({ theme }) => theme.newTheme.font.weight.regular};\n    font-size: ${({ theme }) => theme.newTheme.font.text3.size};\n    line-height: ${({ theme }) => theme.newTheme.font.text3.lineHeight};\n    color: ${({ theme }) => theme.newTheme.color.grey.light};\n\n    @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\n      margin: 0;\n    }\n  }\n\n  @media only screen and (${({ theme }) => theme.newTheme.breakpoints.mobile}) {\n    gap: ${({ theme }) => theme.newTheme.spacing(2)};\n  }\n`;\n\nexport const IconContainer = styled.div`\n  transform: rotate(-90deg);\n\n  svg {\n    transition: ${({ theme }) => theme.newTheme.transition.main};\n    height: ${({ theme }) => theme.newTheme.spacing(5)};\n  }\n`;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport theme from 'styles/theme';\nimport { ChevronArrow } from 'ui/svg';\nimport Link from 'atomic-design/atoms/link';\nimport Image from 'core/image';\nimport {\n  Container,\n  InformationContainer,\n  WorkType,\n  Title,\n  Subtitle,\n  CallToAction,\n  IconContainer,\n} from './styles';\n\nconst Work = ({ slug, contentful_id, title, subtitle, type, height, maxWidthText }) => (\n  <Link to={`/work/${slug}`} rel={slug}>\n    <Container height={height}>\n      <Image\n        alt={title}\n        contentful_id={contentful_id}\n        fromContentful\n        mobileHeight=\"180px\"\n        smallMobileHeight=\"180px\"\n        height=\"inherit\"\n        padding=\"0\"\n        flex=\"1\"\n      />\n      <InformationContainer maxWidthText={maxWidthText}>\n        <WorkType>{type}</WorkType>\n        <Title>{title}</Title>\n        <CallToAction>\n          <p>Read the case study</p>\n          <IconContainer>\n            <ChevronArrow color={theme.newTheme.color.grey.light} />\n          </IconContainer>\n        </CallToAction>\n      </InformationContainer>\n    </Container>\n  </Link>\n);\n\nWork.propTypes = {\n  slug: PropTypes.string.isRequired,\n  title: PropTypes.string.isRequired,\n  subtitle: PropTypes.string.isRequired,\n  contentful_id: PropTypes.string.isRequired,\n  height: PropTypes.string,\n  maxWidthText: PropTypes.string,\n};\n\nWork.defaultProps = {\n  height: '',\n  maxWidthText: '100%',\n};\n\nexport default Work;\n"],"sourceRoot":""}