{"version":3,"sources":["webpack:///./src/components/JumpToLink/index.js","webpack:///./src/components/PromotionsBanner/index.js","webpack:///./src/pages/promotions.js"],"names":["JumpTo","children","url","rest","to","href","PromotionsBanner","intl","useIntl","data","useStaticQuery","css","Tablet","Desktop","Container","formatMessage","id","fluid","childImageSharp","imgStyle","objectFit","fadeIn","loading","Activity","promotion","link","title","description","addition","image","pc_image","Blank","height","PromotionsPage","promotions","allPromotions","edges","map","node","filter","locale","Layout","footerForm","footerBlank","SEO","length","en","key"],"mappings":"4JAsBeA,IAnBA,SAAC,GAAqC,IAAnCC,EAAkC,EAAlCA,SAAkC,IAAxBC,WAAwB,WAAXC,EAAW,kCAElD,MAAe,MAAXD,EAAI,GAGJ,YAAC,OAAD,aAAME,GAAIF,GAASC,GAChBF,GAMH,6BAAGI,KAAMH,GAASC,GACfF,K,6MCkHMK,EAvHU,WACvB,IAAMC,EAAOC,oBAMPC,EAAOC,yBAAe,aAW5B,OACE,8BACE,mBACEC,IAAKA,YAAF,4HAYCC,IAZD,kBAgBCC,IAhBD,oBAsBH,YAACC,EAAA,EAAD,CACEH,IAAKA,YAAF,qBAECC,IAFD,OAOH,mBACED,IAAKA,YAAF,kFAMCC,IAND,qDAWCC,IAXD,wDAkBFN,EAAKQ,cAAc,CAAEC,GAAG,6BAG3B,mBACEL,IAAKA,YAAF,uDAKCC,IALD,2BAWCC,IAXD,2BAiBH,YAAC,IAAD,CACEI,MAAOR,EAAI,OAAWS,gBAAgBD,MACtCE,SAAU,CAAEC,UAAW,QACvBC,QAAQ,EACRC,QAAQ,QACRX,IAAKA,YAAF,iCAICC,IAJD,iBASCC,IATD,yB,yQC/FXU,EAAW,SAAC,GAAmB,IAAjBC,EAAgB,EAAhBA,UAClB,OACE,YAACV,EAAA,EAAD,CACEH,IAAG,GAOH,YAAC,IAAD,CAAQT,IAAKsB,EAAUC,MACrB,mBACEd,IAAKA,YAAF,0KAWCC,IAXD,wEAiBCC,IAjBD,2EAyBFW,EAAUE,QAIf,mBACEf,IAAKA,YAAF,yEAKCC,IALD,2EAWCC,IAXD,6EAmBFW,EAAUG,YACX,YAAC,IAAD,CAAQzB,IAAKsB,EAAUC,MACrB,oBACEd,IAAG,GAOFa,EAAUI,YAKjB,YAAC,IAAD,CACE1B,IAAKsB,EAAUC,KACfd,IAAG,GAIH,mBACEA,IAAKA,YAAF,8FAMiBa,EAAUK,MAN3B,gEASCjB,IATD,4CAYmBY,EAAUM,SAZ7B,0CAkBP,YAACC,EAAA,EAAD,CAAOC,OAAQ,CAAC,GAAI,IAAK,SAqFhBC,UAhFQ,WACrB,IAAM1B,EAAOC,oBA0BP0B,EAzBOxB,yBAAe,cAyBJyB,cAAcC,MACnCC,KAAI,SAACC,GAAD,OAAUA,EAAKA,QACnBC,QAAO,SAACf,GAAD,OAAeA,EAAUgB,SAAWjC,EAAKiC,UACnD,OACE,YAACC,EAAA,EAAD,CAAQC,YAAU,EAACC,aAAW,GAC5B,YAACC,EAAA,EAAD,CACElB,MAAOnB,EAAKQ,cAAc,CACxBC,GAAI,2BAGR,YAAC,EAAD,MACA,YAACe,EAAA,EAAD,CAAOC,OAAQ,CAAC,GAAI,IAAK,OAEF,IAAtBE,EAAWW,QACV,mBACElC,IAAKA,YAAF,oHAQCC,IARD,wEAcCC,IAdD,2DAsBD,CACEiC,GAAI,kCACJ,QAAS,eACT,QAAS,gBACTvC,EAAKiC,SAKZN,EAAWW,OAAS,GACnBX,EAAWG,KAAI,SAACb,GACd,OAAO,YAAC,EAAD,CAAUA,UAAWA,EAAWuB,IAAKvB,EAAUR","file":"component---src-pages-promotions-js-1fab620255052f0b128f.js","sourcesContent":["import React from 'react';\nimport { Link } from 'gatsby-plugin-intl';\n\nconst JumpTo = ({ children, url = ``, ...rest }) => {\n  // 该组件用来解决不知道是跳转站内还是站外链接的问题\n  if (url[0] === '/') {\n    // 链接跳转站内\n    return (\n      <Link to={url} {...rest}>\n        {children}\n      </Link>\n    );\n  } else {\n    // 链接跳转站外\n    return (\n      <a href={url} {...rest}>\n        {children}\n      </a>\n    );\n  }\n};\n\nexport default JumpTo;\n","import React from 'react';\nimport Container from '../Container';\nimport BannerBand from '../../svgs/banner-band.svg';\nimport Check from '../../svgs/institutions/check.svg';\nimport { Desktop, Tablet } from '../../constants/responsive';\nimport { css } from '@emotion/core';\nimport { FormattedHTMLMessage, useIntl } from 'gatsby-plugin-intl';\nimport InstitutionsAnimation from '../InstitutionsAnimation';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport Img from 'gatsby-image';\n\nconst PromotionsBanner = () => {\n  const intl = useIntl();\n  const langMap = {\n    en: 'EN',\n    'zh-cn': 'CN',\n    'zh-hk': 'HK',\n  };\n  const data = useStaticQuery(graphql`\n    query {\n      SignUP: file(relativePath: { eq: \"footer/footer-signUp.png\" }) {\n        childImageSharp {\n          fluid(maxWidth: 600) {\n            ...GatsbyImageSharpFluid_noBase64\n          }\n        }\n      }\n    }\n  `);\n  return (\n    <>\n      <div\n        css={css`\n          // background: #f2f2f2;\n          width: 100%;\n          background: #ee2c78;\n          display: flex;\n          justify-content: center;\n\n          // padding-top: 20px;\n          z-index: 1;\n          overflow: hidden;\n          min-width: 320px;\n          height: 200px;\n          ${Tablet} {\n            // padding-top: 30px;\n            height: 220px;\n          }\n          ${Desktop} {\n            // padding-top: 40px;\n            height: 307px;\n          }\n        `}\n      >\n        <Container\n          css={css`\n            position: relative;\n            ${Tablet} {\n            }\n          `}\n        >\n          {/* [字] */}\n          <div\n            css={css`\n              color: #ffffff;\n              font-weight: bold;\n              font-size: 32px;\n              line-height: 36px;\n              margin-top: 79px;\n              ${Tablet} {\n                font-size: 48px;\n                line-height: 52px;\n                margin-top: 84px;\n              }\n              ${Desktop} {\n                font-size: 48px;\n                line-height: 52px;\n                margin-top: 118px;\n              }\n            `}\n          >\n            {intl.formatMessage({ id: `promotions.banner-title` })}\n          </div>\n          {/* [图] */}\n          <div\n            css={css`\n              position: absolute;\n              bottom: 0px;\n              right: -50px;\n              z-index: -1;\n              ${Tablet} {\n                // bottom: -10px;\n                // right: -89px;\n                bottom: 0px;\n                right: 56px;\n              }\n              ${Desktop} {\n                bottom: 0;\n                right: 85px;\n              }\n            `}\n          >\n            <Img\n              fluid={data[`SignUP`].childImageSharp.fluid}\n              imgStyle={{ objectFit: 'fill' }}\n              fadeIn={false}\n              loading='eager'\n              css={css`\n                position: absolute;\n                width: 260px;\n                // transform: translate(-189px, 12px);\n                ${Tablet} {\n                  width: 296px;\n                  // height: 340px;\n                  // transform: translate(-267px, 165px);\n                }\n                ${Desktop} {\n                  width: 420px;\n                  // right: 0;\n                  // transform: translate(-364px, -39px);\n                }\n              `}\n            />\n          </div>\n        </Container>\n      </div>\n    </>\n  );\n};\n\nexport default PromotionsBanner;\n","import { css } from '@emotion/core';\nimport React from 'react';\nimport { useIntl } from 'gatsby-plugin-intl';\nimport Layout from '../components/Layout';\nimport SEO from '../components/SEO';\nimport PromotionsBanner from '../components/PromotionsBanner';\nimport { Desktop, Tablet } from '../constants/responsive';\nimport Container from '../components/Container';\nimport { graphql, useStaticQuery } from 'gatsby';\nimport Blank from '../components/Blank';\nimport JumpTo from '../components/JumpToLink';\n\nconst Activity = ({ promotion }) => {\n  return (\n    <Container\n      css={css`\n        display: flex;\n        flex-direction: column;\n        position: relative;\n      `}\n    >\n      {/* title */}\n      <JumpTo url={promotion.link}>\n        <div\n          css={css`\n            width: fit-content;\n            cursor: pointer;\n            color: #000000;\n\n            font-size: 24px;\n            font-weight: bold;\n            line-height: 1.25;\n            text-decoration: underline;\n            text-underline-offset: 5px;\n            margin-bottom: 20px;\n            ${Tablet} {\n              font-size: 36px;\n              font-weight: 500;\n              line-height: 1.33;\n              margin-bottom: 20px;\n            }\n            ${Desktop} {\n              font-size: 36px;\n              line-height: 33px;\n              font-weight: bold;\n              margin-bottom: 20px;\n            }\n          `}\n        >\n          {promotion.title}\n        </div>\n      </JumpTo>\n      {/* description */}\n      <div\n        css={css`\n          font-size: 14px;\n          font-weight: normal;\n          line-height: 1.71;\n          margin-bottom: 10px;\n          ${Tablet} {\n            font-size: 18px;\n            font-weight: normal;\n            line-height: 1.39;\n            margin-bottom: 20px;\n          }\n          ${Desktop} {\n            font-weight: normal;\n            font-size: 24px;\n            line-height: 33px;\n            margin-bottom: 20px;\n          }\n        `}\n      >\n        {promotion.description}\n        <JumpTo url={promotion.link}>\n          <span\n            css={css`\n              text-decoration: underline;\n              cursor: pointer;\n              color: #000000;\n              text-underline-offset: 5px;\n            `}\n          >\n            {promotion.addition}\n          </span>\n        </JumpTo>\n      </div>\n      {/* 图 */}\n      <JumpTo\n        url={promotion.link}\n        css={css`\n          align-self: center;\n        `}\n      >\n        <div\n          css={css`\n            cursor: pointer;\n            position: relative;\n            border-radius: 8px;\n            width: 295px;\n            height: 428px;\n            background: url(${promotion.image}) no-repeat;\n            background-size: cover;\n            background-position: center;\n            ${Tablet} {\n              width: 674px;\n              height: 329px;\n              background: url(${promotion.pc_image}) no-repeat;\n              background-size: cover;\n            }\n          `}\n        ></div>\n      </JumpTo>\n      <Blank height={[50, 100, 150]} />\n    </Container>\n  );\n};\n\nconst PromotionsPage = () => {\n  const intl = useIntl();\n  const data = useStaticQuery(graphql`\n    query {\n      allPromotions {\n        edges {\n          node {\n            id\n            addition\n            addition_link\n            back_color\n            button_back_color\n            button_text\n            button_text_color\n            description\n            image\n            ipad_image\n            link\n            locale\n            pc_image\n            substract\n            title\n          }\n        }\n      }\n    }\n  `);\n  const promotions = data.allPromotions.edges\n    .map((node) => node.node)\n    .filter((promotion) => promotion.locale === intl.locale);\n  return (\n    <Layout footerForm footerBlank>\n      <SEO\n        title={intl.formatMessage({\n          id: 'promotions.SEO.title',\n        })}\n      />\n      <PromotionsBanner />\n      <Blank height={[50, 100, 150]} />\n      {/* 没有活动 */}\n      {promotions.length === 0 && (\n        <div\n          css={css`\n            color: #000;\n            font-size: 24px;\n            line-height: 1.33;\n            margin-bottom: 200px;\n            max-width: 335px;\n            text-align: center;\n            font-weight: 500;\n            ${Tablet} {\n              font-size: 36px;\n              line-height: 1.33;\n              margin-bottom: 100px;\n              max-width: none;\n            }\n            ${Desktop} {\n              font-size: 36px;\n              line-height: 0.92;\n              margin-bottom: 100px;\n            }\n          `}\n        >\n          {\n            {\n              en: 'Stay tuned for more promotions!',\n              'zh-cn': '活动即将推出，敬请期待！',\n              'zh-hk': '活動即將推出，敬請期待！',\n            }[intl.locale]\n          }\n        </div>\n      )}\n      {/* 最少有一个活动 */}\n      {promotions.length > 0 &&\n        promotions.map((promotion) => {\n          return <Activity promotion={promotion} key={promotion.id} />;\n        })}\n    </Layout>\n  );\n};\nexport default PromotionsPage;\n"],"sourceRoot":""}