{"version":3,"file":"component---src-pages-faq-js-fd27bea7241f9f793d54.js","mappings":"6IAOA,MAGMA,EAAUC,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,qBAAAC,YAAA,gBAAVF,CAAU,kHAKtBG,GAASA,EAAMC,QAASC,EAAAA,EAAAA,KAAG,qBACbC,IAAA,IAAC,MAAEC,GAAOD,EAAA,OAAKC,EAAMC,WAAWJ,KAAK,MAGnDD,GAASA,EAAMM,UAAWJ,EAAAA,EAAAA,KAAG,4BAItBK,IAAA,IAAC,MAAEH,GAAOG,EAAA,OAAKH,EAAMI,OAAOC,KAAK,IAMtCC,EAAQb,EAAAA,QAAAA,GAAAA,WAAS,CAAAC,YAAA,mBAAAC,YAAA,gBAATF,CAAS,sYAOZc,IAAA,IAAC,MAAEP,GAAOO,EAAA,OAAKP,EAAMQ,KAAKC,OAAO,IAKjCC,IAAA,IAAC,MAAEV,GAAOU,EAAA,OAAKV,EAAMI,OAAOC,KAAK,IAUHM,IAAA,IAAC,MAAEX,GAAOW,EAAA,OAAKX,EAAMC,WAAWW,OAAO,IAAQC,IAAA,IAAC,MAAEb,GAAOa,EAAA,OAAKb,EAAMS,QAAQK,IAAI,IAASC,IAAA,IAAC,MAAEf,GAAOe,EAAA,OAAKf,EAAMC,WAAWW,OAAO,IAQnKI,EAAOvB,EAAAA,QAAAA,EAAAA,WAAQ,CAAAC,YAAA,kBAAAC,YAAA,gBAARF,CAAQ,uCAwBrB,IAlBkBG,GAChBqB,EAAAA,cAACzB,EAAO,CAACU,QAASN,EAAMM,QAASL,MAAOD,EAAMC,OAC5CoB,EAAAA,cAACX,EAAK,KAAC,uCACPW,EAAAA,cAACD,EAAI,KAAC,iHAGNC,EAAAA,cAACC,EAAAA,GAAM,CACLC,GAjEY,mCAkEZC,KAAK,SACLC,OAAO,QACPC,MAAM,YACNC,KAAK,SACN,a,gHCtEE,MAAMC,GAAU/B,EAAAA,EAAAA,SAAOgC,EAAAA,IAASC,WAAA,CAAAhC,YAAA,8BAAAC,YAAA,eAAhBF,CAAgB,4CAInCG,GAASA,EAAM+B,SAAU7B,EAAAA,EAAAA,KAAG,wBAC1B8B,KAMOC,EAAcpC,EAAAA,QAAAA,GAAAA,WAAS,CAAAC,YAAA,kCAAAC,YAAA,eAATF,CAAS,mLAKzBM,IAAA,IAAC,MAAEC,GAAOD,EAAA,OAAKC,EAAMS,QAAQK,IAAI,IAK9BX,IAAA,IAAC,MAAEH,GAAOG,EAAA,OAAKH,EAAM8B,UAAUhB,IAAI,IAQrCP,IAAA,IAAC,MAAEP,GAAOO,EAAA,OAAKP,EAAMQ,KAAKuB,QAAQ,IAIjCH,EAAYnC,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,gCAAAC,YAAA,eAAVF,CAAU,8FAatBuC,EAAWvC,EAAAA,QAAAA,GAAAA,WAAS,CAAAC,YAAA,+BAAAC,YAAA,eAATF,CAAS,4IAMtBiB,IAAA,IAAC,MAAEV,GAAOU,EAAA,OAAKV,EAAMQ,KAAKyB,SAAS,IAKjCC,EAAgBzC,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,oCAAAC,YAAA,eAAVF,CAAU,6BChCvC,MAlBYM,IAA2C,IAA1C,SAAEoC,EAAQ,OAAEC,EAAM,OAAET,GAAS,GAAO5B,EAC/C,MAAM,EAACsC,EAAK,EAACC,IAAWC,EAAAA,EAAAA,UAASZ,GACjC,OACEV,EAAAA,cAACO,EAAO,CAACG,OAAQU,GACfpB,EAAAA,cAACY,EAAW,CAACW,QAASA,IAAMF,GAASD,IACnCpB,EAAAA,cAACwB,EAAAA,GAAI,CACHC,KAAML,EAAO,6BAA+B,4BAC5CM,MAAO,GACPC,OAAQ,GACRC,QAAM,IAEPV,GAEHlB,EAAAA,cAACW,EAAS,CAACkB,wBAAyB,CAAEC,OAAQX,KACtC,E,QCiDd,MAtDgBrC,IAAyB,IAAxB,KAAEiD,EAAI,SAAEC,GAAUlD,EACjC,MAAMmD,EAAUF,EAAKE,QAAQC,aAAe,CAAC,EAEvCC,GADOJ,EAAKE,QAAQG,KACbL,EAAKM,IAAIC,MAAMC,KAAKC,IAC/B,MAAMT,EAAOS,EAAQC,KAAKC,oBAC1B,MAAO,CACLxB,SAAUa,EAAKG,YAAYhB,SAC3ByB,MAAOZ,EAAKG,YAAYS,MACxBxB,OAAQY,EAAKK,KACd,KAEGQ,EAAWb,EAAKc,UAAUP,MAAMC,KAAIC,GAAWA,EAAQC,KAAKC,oBAAoBR,cAChFY,EAAgB,CAAC,EACvBF,EAASG,SAAQP,IACfM,EAAcN,EAAQQ,OAAS,EAAE,IAGnCb,EAAKY,SAAQP,IACXM,EAAcN,EAAQG,OAAOM,KAAKT,EAAQ,IAK5C,OACExC,EAAAA,cAAAA,EAAAA,SAAA,KACEA,EAAAA,cAACkD,EAAAA,GAAG,CACFC,UAAU,QACVH,MAAOf,EAAQe,QAEjBhD,EAAAA,cAACoD,EAAAA,GAAM,CAACC,GAAG,SAASC,OAAO,UACzBtD,EAAAA,cAACuD,EAAAA,GAAY,KACXvD,EAAAA,cAACwD,EAAAA,GAAM,OAETxD,EAAAA,cAACyD,EAAAA,GAAU,KAETzD,EAAAA,cAAC0D,EAAAA,GAAS,KAAEzB,EAAQe,OACpBhD,EAAAA,cAAA,WACC2D,OAAOC,QAAQd,GAAeP,KAAI,CAAArD,EAAsB2E,KAAK,IAAzBb,EAAOc,GAAW5E,EAAA,OACrDc,EAAAA,cAACiB,EAAa,CAAC8C,IAAKF,GAClB7D,EAAAA,cAACe,EAAQ,KAAEiC,GACVc,EAAWvB,KAAI,CAACR,EAAMgC,IAAQ/D,EAAAA,cAACgE,EAAG,CAACD,IAAKA,EAAK7C,SAAUa,EAAKb,SAAUC,OAAQY,EAAKZ,OAAQT,OAAgB,IAARqD,GAAuB,IAAVF,MACnG,IAGlB7D,EAAAA,cAACiE,EAAAA,EAAQ,OAGXjE,EAAAA,cAACkE,EAAAA,GAAY,KACXlE,EAAAA,cAACmE,EAAAA,GAAM,QAGV,C","sources":["webpack://be-landing/./src/components/pre-order/pre-order.js","webpack://be-landing/./src/components/faq-acordeon/faq-acordeon.styled.js","webpack://be-landing/./src/components/faq-acordeon/faq-acordeon.js","webpack://be-landing/./src/pages/faq.js"],"sourcesContent":["import React from \"react\";\nimport styled, { css } from \"styled-components\";\nimport {\n  Button\n} from '../../ui-components';\n\n\nconst ORDER_URL = 'https://my.betriton.com/preorder'\n\n\nconst Wrapper = styled.div`\n  position: relative;\n  text-align: center;\n  padding: 72px 0;\n\n  ${props => props.paper && css`\n    background: ${({ theme }) => theme.background.paper};\n  `}\n\n  ${props => props.sticked && css`\n    margin-bottom: -24px;\n  `}\n\n  @media ${({ theme }) => theme.device.phone}{\n    padding-left: 24px;\n    padding-right: 24px;\n  }\n`;\n\nconst Title = styled.h4`\n  font-family: \"Quantico\", sans-serif;\n  font-weight: 400;\n  text-align: center;\n  font-size: 32px;\n  line-height: 35px;\n  padding-bottom: 12px;\n  color: ${({ theme }) => theme.text.primary};\n\n  position: relative;\n  display: inline-block;\n\n  @media ${({ theme }) => theme.device.phone}{\n    font-size: 24px;\n    line-height: 28px;\n    letter-spacing: 0;\n  }\n\n  &::after{\n    position: absolute;\n    content: \" \";\n    display: block;\n    background: linear-gradient(90deg, ${({ theme }) => theme.background.default} 0%, ${({ theme }) => theme.primary.main} 50%, ${({ theme }) => theme.background.default} 100%);\n    height: 1px;\n    left: 10%;\n    right: 10%;\n    bottom: -5px;\n  }\n`;\n\nconst Body = styled.p`\n  max-width: 520px;\n  margin: 24px auto;\n`;\n\n\nconst PreOrder = (props) => (\n  <Wrapper sticked={props.sticked} paper={props.paper}>\n    <Title>Embrace the spirit of extraordinary</Title>\n    <Body>\n      Be a pioneer and get in the queue for a journey that will create a very special set of emotions and memories!\n    </Body>\n    <Button\n      to={ORDER_URL}\n      type=\"anchor\"\n      target=\"_self\"\n      color=\"secondary\"\n      size=\"large\"\n    >\n      Pre-order\n    </Button>\n  </Wrapper>\n)\n\nexport default PreOrder;\n","\nimport styled, { css } from \"styled-components\";\nimport {\n  ZWrapper,\n} from '../../ui-components';\n\n\nexport const FaqWrap = styled(ZWrapper)`\n  margin-bottom: 1px;\n  text-align: left;\n  \n  ${props => props.isOpen && css`\n    ${FaqAnswer}{\n      display: block;\n    }\n  `};\n`\n\nexport const FaqQuestion = styled.h3`\n  font-family: \"Quantico\", sans-serif;\n  font-size: 18px;\n  padding: 0;\n  margin: 0;\n  color: ${({ theme }) => theme.primary.main};\n  cursor: pointer; \n\n  &:hover{\n    svg{\n      fill: ${({ theme }) => theme.thirdiary.main};\n    }\n  }\n\n  svg {\n    position: relative;\n    top: 2px;\n    margin-right: 4px;\n    fill: ${({ theme }) => theme.text.disabled};\n  }\n`\n\nexport const FaqAnswer = styled.div`\n  position: relative;\n  display: none;\n  padding: 16px;\n  \n\n  p {\n    margin: 0;\n    font-size: 16px;\n    line-height: 21px;\n  }\n`\n\nexport const FaqTitle = styled.h2`\n  font-family: \"Quantico\", sans-serif;\n  font-size: 18px;\n  text-transform: uppercase;\n  line-height: 21px;\n  margin-left: 14px;\n  color: ${({ theme }) => theme.text.secondary};\n  text-align: left;\n`;\n\n\nexport const FaqCollection = styled.div`\n  box-sizing: content-box;\n`","import React, { useState } from \"react\";\nimport {\n  Icon,\n} from '../../ui-components';\nimport {\n  FaqQuestion,\n  FaqAnswer,\n  FaqWrap,\n} from './faq-acordeon.styled';\n\n\n\n\n\nconst Faq = ({ question, answer, isOpen = false }) => {\n  const [open, setOpen] = useState(isOpen);\n  return (\n    <FaqWrap isOpen={open}>\n      <FaqQuestion onClick={() => setOpen(!open)}>\n        <Icon\n          name={open ? \"arrow-ios-downward-outline\" : \"arrow-ios-forward-outline\"}\n          width={18}\n          height={18}\n          noFill\n        />\n        {question}\n      </FaqQuestion>\n      <FaqAnswer dangerouslySetInnerHTML={{ __html: answer }} />\n    </FaqWrap>\n  )\n}\n\nexport default Faq;\n","import React, { useState } from \"react\";\nimport { graphql } from \"gatsby\";\nimport {\n  SEO,\n} from '../components';\nimport {\n  Layout,\n  LayoutHeader,\n  LayoutFooter,\n  LayoutMain,\n  Header,\n  Footer,\n  PageTitle,\n} from '../ui-components';\nimport Faq from \"../components/faq-acordeon/faq-acordeon\";\nimport {\n  FaqTitle,\n  FaqCollection,\n} from \"../components/faq-acordeon/faq-acordeon.styled\";\nimport PreOrder from \"../components/pre-order/pre-order\";\n\n\n\nconst FaqPage = ({ data, location }) => {\n  const content = data.content.frontmatter || {};\n  const html = data.content.html;\n  const faqs = data.faq.edges.map((element) => {\n    const data = element.node.childMarkdownRemark;\n    return {\n      question: data.frontmatter.question,\n      group: data.frontmatter.group,\n      answer: data.html,\n    }\n  })\n  const faqGroup = data.faq_group.edges.map(element => element.node.childMarkdownRemark.frontmatter)\n  const faqCollection = {}\n  faqGroup.forEach(element => {\n    faqCollection[element.title] = []\n  });\n\n  faqs.forEach(element => {\n    faqCollection[element.group].push(element)\n  });\n\n  const openFlag = false;\n\n  return (\n    <>\n      <SEO\n        canonical=\"/faq/\"\n        title={content.title}\n      />\n      <Layout id=\"layout\" layout=\"simple\">\n        <LayoutHeader>\n          <Header />\n        </LayoutHeader>\n        <LayoutMain>\n\n          <PageTitle>{content.title}</PageTitle>\n          <br />\n          {Object.entries(faqCollection).map(([title, collection], index) =>\n            <FaqCollection key={index}>\n              <FaqTitle>{title}</FaqTitle>\n              {collection.map((data, key) => <Faq key={key} question={data.question} answer={data.answer} isOpen={key === 0 && index === 0} />)}\n            </FaqCollection>\n          )}\n\n          <PreOrder />\n\n        </LayoutMain>\n        <LayoutFooter>\n          <Footer />\n        </LayoutFooter>\n      </Layout>\n    </>\n  );\n}\nexport default FaqPage;\n\nexport const pageQuery = graphql`\nquery {\n  site {\n    siteMetadata {\n      title\n    }\n  }\n  content: markdownRemark(fileAbsolutePath: {regex: \"/content/pages/faq.md/\"}) {\n    frontmatter {\n      title\n    }\n    html\n  }\n  faq_group: allFile(filter: {absolutePath: {regex: \"/content/faq_group//\"}}, sort: {fields: childrenMarkdownRemark___frontmatter___order, order: ASC}) {\n    edges {\n      node {\n        childMarkdownRemark {\n          frontmatter {\n            title\n            order\n          }\n        }\n      }\n    }\n  }\n  faq: allFile(filter: {absolutePath: {regex: \"/content/faq//\"}}) {\n    edges {\n      node {\n        childMarkdownRemark {\n          frontmatter {\n            question\n            group\n          }\n          html\n        }\n      }\n    }\n  }\n}  \n`;"],"names":["Wrapper","styled","displayName","componentId","props","paper","css","_ref","theme","background","sticked","_ref2","device","phone","Title","_ref3","text","primary","_ref4","_ref5","default","_ref6","main","_ref7","Body","React","Button","to","type","target","color","size","FaqWrap","ZWrapper","withConfig","isOpen","FaqAnswer","FaqQuestion","thirdiary","disabled","FaqTitle","secondary","FaqCollection","question","answer","open","setOpen","useState","onClick","Icon","name","width","height","noFill","dangerouslySetInnerHTML","__html","data","location","content","frontmatter","faqs","html","faq","edges","map","element","node","childMarkdownRemark","group","faqGroup","faq_group","faqCollection","forEach","title","push","SEO","canonical","Layout","id","layout","LayoutHeader","Header","LayoutMain","PageTitle","Object","entries","index","collection","key","Faq","PreOrder","LayoutFooter","Footer"],"sourceRoot":""}