{"version":3,"file":"components-slpFFHeaderImage-slpFFHeaderImage-03f73d14ba3366cfb3e0.js","mappings":"8MAIe,SAASA,EAAT,GAA4C,IAAD,YAAfC,EAAe,EAAfA,YACnCC,EAAcD,MAAAA,GAAH,UAAGA,EAAaE,cAAhB,aAAG,EAAqBC,QAAO,SAACC,GAC/C,OAAOA,MAAAA,OAAA,EAAAA,EAASC,SAAUC,EAAAA,GAAAA,IAAAA,UAAAA,iBACzB,GACGC,EAAaP,MAAAA,GAAH,UAAGA,EAAaE,cAAhB,aAAG,EAAqBC,QAAO,SAACC,GAC9C,OAAOA,MAAAA,OAAA,EAAAA,EAASC,SAAUC,EAAAA,GAAAA,IAAAA,UAAAA,gBACzB,GAEH,OACE,gBAAC,iBAAD,CAAuBE,SAAUR,MAAAA,GAAF,UAAEA,EAAaS,aAAf,iBAAE,EAAoBC,YAAtB,aAAE,EAA0BC,KACzD,gBAAC,QAAD,KACE,gBAAC,oBAAD,CAA0BC,IAAKX,MAAAA,GAAF,UAAEA,EAAaS,YAAf,aAAE,EAAmBC,MAClD,gBAAC,mBAAD,CAAyBC,IAAKL,MAAAA,GAAF,UAAEA,EAAYG,YAAd,aAAE,EAAkBC,U,iMCd3CE,EAAiBC,EAAAA,QAAAA,IAAAA,WAAH,kFAAGA,CAAH,gIACF,SAACC,GAAD,OAAWA,EAAMP,YAQ7BQ,EAAQF,EAAAA,QAAAA,IAAAA,WAAH,yEAAGA,CAAH,qLAcLG,EAAoBH,EAAAA,QAAAA,IAAAA,WAAH,qFAAGA,CAAH,oFAQjBI,EAAmBJ,EAAAA,QAAAA,IAAAA,WAAH,oFAAGA,CAAH","sources":["webpack://commercial-ultramar/./src/components/slpFFHeaderImage/slpFFHeaderImage.js","webpack://commercial-ultramar/./src/components/slpFFHeaderImage/slpFFHeaderImageStyles.js"],"sourcesContent":["import React from 'react';\nimport { SECTIONS } from '../../constants';\nimport * as Styled from './slpFFHeaderImageStyles';\n\nexport default function slpFFHeaderImage({ sectionData }) {\n  const DesktopData = sectionData?.assets?.filter((section) => {\n    return section?.title === SECTIONS.SLP.FREE_FILL.TITLE_DESKTOP;\n  })[0];\n  const MobileData = sectionData?.assets?.filter((section) => {\n    return section?.title === SECTIONS.SLP.FREE_FILL.TITLE_MOBILE;\n  })[0];\n\n  return (\n    <Styled.TitleContainer $bgImage={sectionData?.image?.file?.url}>\n      <Styled.Title>\n        <Styled.TitleDesktopImage src={DesktopData?.file?.url} />\n        <Styled.TitleMobileImage src={MobileData?.file?.url} />\n      </Styled.Title>\n    </Styled.TitleContainer>\n  );\n}\n","import styled from 'styled-components';\n\nexport const TitleContainer = styled.div`\n  background: #fff url(${(props) => props.$bgImage}) repeat-x bottom center;\n  height: 500px;\n  @media (max-width: 991px) {\n    background-size: cover;\n    height: 300px;\n  }\n`;\n\nexport const Title = styled.div`\n  width: 100%;\n  height: auto;\n  margin: 0 auto;\n  padding: 65px 0px 0px 0px;\n  text-align: center;\n  @media (max-width: 991px) {\n    width: 100%;\n    height: auto;\n    padding: 45px 35px 10px 35px;\n    text-align: center;\n  }\n`;\n\nexport const TitleDesktopImage = styled.img`\n  max-width: 540px;\n  height: auto;\n  @media (max-width: 991px) {\n    display: none !important;\n  }\n`;\n\nexport const TitleMobileImage = styled.img`\n  display: none;\n  @media (max-width: 991px) {\n    display: block;\n    max-width: 310px;\n    width: 100%;\n    height: auto;\n    padding-top: 10px;\n    padding-bottom: 30px;\n    margin: 0 auto;\n  }\n`;\n"],"names":["slpFFHeaderImage","sectionData","DesktopData","assets","filter","section","title","SECTIONS","MobileData","$bgImage","image","file","url","src","TitleContainer","styled","props","Title","TitleDesktopImage","TitleMobileImage"],"sourceRoot":""}