{"version":3,"file":"4045e9d4-69ddc3810d63cccf3e8e.js","mappings":"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","sources":["webpack://inflearn-static/./src/components/infcon-2023/main/sections/Hero/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\nimport { faArrowUpRightFromSquare, faBell, faLink } from '@fortawesome/pro-regular-svg-icons';\nimport { Box, Button, desktopFirstMediaQuery, Icon, Text, Title } from '@inflearn/ds-react';\nimport { motion } from 'framer-motion';\nimport {\n  textTransitionInitialOptions,\n  textTransitionTimingFunction\n} from '../../../../../styles/transitions';\nimport { GATSBY_CDN_URL } from '../../../../../utils/env';\nimport { URLS } from '../../../../../utils/urls';\nimport useMainButtonText from '../../../commons/hooks/useMainButtonText';\nimport useIsPassedHeroSection from './useIsPassedHeroSection';\n\nconst Hero = () => {\n  const { isPassedHeroSection } = useIsPassedHeroSection();\n  const { buttonText, buttonDisabled } = useMainButtonText();\n\n  return (\n    <Box\n      css={{\n        width: '100%',\n        overflowX: 'hidden'\n      }}>\n      {!isPassedHeroSection && (\n        <>\n          <motion.video\n            css={[styleHeroVideo, { [desktopFirstMediaQuery.mobile]: { display: 'none' } }]}\n            id=\"infcon-2023-hero-video\"\n            poster={`${GATSBY_CDN_URL}/infcon/infcon-2023/infcon2023-main-pc.png`}\n            autoPlay\n            loop\n            muted\n            playsInline\n            loading=\"lazy\"\n            src={`${GATSBY_CDN_URL}/infcon/infcon-2023/infcon2023-main-pc.mp4`}\n          />\n          <motion.video\n            css={[\n              styleHeroVideo,\n              {\n                display: 'none',\n                [desktopFirstMediaQuery.mobile]: { display: 'inherit' }\n              }\n            ]}\n            id=\"infcon-2023-hero-video\"\n            poster={`${GATSBY_CDN_URL}/infcon/infcon-2023/infcon2023-main-mo.png`}\n            autoPlay\n            loop\n            muted\n            playsInline\n            loading=\"lazy\"\n            src={`${GATSBY_CDN_URL}/infcon/infcon-2023/infcon2023-main-mo.mp4`}\n          />\n        </>\n      )}\n      <Box component=\"section\" css={[styleHero, { opacity: isPassedHeroSection ? 0 : 100 }]}>\n        <Title order={1} className=\"visually-hidden\">\n          인프콘 2023 메인 페이지\n        </Title>\n        <motion.div\n          initial={{ opacity: 0 }}\n          whileInView={{ opacity: 1 }}\n          viewport={{ once: true }}\n          transition={{\n            delay: 0.3,\n            times: 0.3\n          }}>\n          <Box css={styleHeroOverlay} />\n        </motion.div>\n        <Box css={styleHeroBody}>\n          <motion.div\n            animate={{ y: 0 }}\n            initial={textTransitionInitialOptions}\n            whileInView={{ opacity: 1 }}\n            transition={{\n              ...textTransitionTimingFunction,\n              delay: 0.3\n            }}>\n            <img\n              src={`${GATSBY_CDN_URL}/infcon/infcon-2023/main-hero-title-pc.svg`}\n              alt=\"INFCON 2023\"\n              css={styleHeroPCTitle}\n            />\n            <img\n              src={`${GATSBY_CDN_URL}/infcon/infcon-2023/main-hero-title-mb.svg`}\n              alt=\"INFCON 2023\"\n              css={styleHeroMobileTitle}\n            />\n          </motion.div>\n          <motion.div\n            animate={{\n              y: 0,\n              opacity: 1\n            }}\n            initial={textTransitionInitialOptions}\n            transition={{\n              ...textTransitionTimingFunction,\n              delay: 0.4\n            }}>\n            <Text size={32} color=\"white\" weight=\"bold\" mb={40} css={styleHeroSubTitle}>\n              2023.08.15. 삼성동 COEX 그랜드볼룸 & 아셈볼룸\n            </Text>\n            <Box mb={40} css={styleHeroMobileSubTitle}>\n              <Text size={28} color=\"white\" weight=\"bold\">\n                2023.08.15.\n              </Text>\n              <Text size={28} color=\"white\" weight=\"bold\">\n                삼성동 COEX 그랜드볼룸 & 아셈볼룸\n              </Text>\n            </Box>\n          </motion.div>\n          <motion.div\n            animate={{\n              y: 0,\n              opacity: 1\n            }}\n            initial={textTransitionInitialOptions}\n            transition={{\n              ...textTransitionTimingFunction,\n              delay: 0.6\n            }}>\n            <Button\n              component=\"a\"\n              // TODO: 인프콘 2024에서 부활\n              // href={URLS.INFCON_2023_COURSE_PAGE}\n              href={URLS.INFCON_2023_REPLAY}\n              target=\"_blank\"\n              size=\"xl\"\n              radius=\"xl\"\n              variant=\"filled\"\n              // leftIcon={<Icon icon={faBell} />}\n              leftIcon={<Icon icon={faArrowUpRightFromSquare} css={{ svg: { width: '20px' } }} />}\n              color=\"dark\"\n              css={{\n                pointerEvents: 'all',\n                svg: { width: '20px !important', height: '20px !important' }\n              }}\n              disabled={buttonDisabled}>\n              {buttonText}\n              {buttonText !== '신청 마감' && buttonText !== '인프콘 다시보기' && '하기'}\n            </Button>\n          </motion.div>\n        </Box>\n      </Box>\n      <Box\n        css={{\n          position: 'relative',\n          zIndex: 0,\n          height: 'calc(100vh - 40px)',\n          paddingTop: 'calc(100vh - 40px)'\n        }}\n      />\n    </Box>\n  );\n};\n\nconst styleHero = css({\n  zIndex: 1,\n  position: 'fixed',\n  top: '40px',\n  width: '100%',\n  height: 'calc(100vh - 40px)',\n  display: 'flex',\n  justifyContent: 'center',\n  alignItems: 'center',\n  pointerEvents: 'none',\n\n  [desktopFirstMediaQuery.mobile]: {\n    height: '100vh'\n  }\n});\n\nconst styleHeroOverlay = css({\n  position: 'absolute',\n  left: 0,\n  top: 0,\n  width: '100%',\n  height: '100%',\n  backgroundColor: 'rgba(0, 0, 0, 0.05)'\n});\nconst styleHeroBody = css({\n  zIndex: 1,\n  display: 'flex',\n  alignItems: 'center',\n  flexDirection: 'column',\n  paddingTop: '40px'\n});\n\nconst styleHeroPCTitle = css({\n  marginBottom: 32,\n  [desktopFirstMediaQuery.mobile]: {\n    display: 'none'\n  }\n});\nconst styleHeroMobileTitle = css({\n  display: 'none',\n  marginBottom: 32,\n  [desktopFirstMediaQuery.mobile]: {\n    display: 'block'\n  }\n});\nconst styleHeroSubTitle = css({\n  [desktopFirstMediaQuery.tablet]: {\n    fontSize: 28\n  },\n  [desktopFirstMediaQuery.mobile]: {\n    display: 'none'\n  }\n});\nconst styleHeroMobileSubTitle = css({\n  display: 'none',\n  textAlign: 'center',\n  [desktopFirstMediaQuery.mobile]: {\n    display: 'block',\n    p: {\n      fontSize: 20\n    }\n  }\n});\n\nconst styleHeroVideo = css({\n  zIndex: -1,\n  width: '100%',\n  height: 'calc(100% - 40px)',\n  position: 'fixed',\n  bottom: 0,\n  left: 0,\n  objectFit: 'cover',\n\n  [desktopFirstMediaQuery.mobile]: {\n    height: '100vh'\n  }\n});\n\nexport default Hero;\n"],"names":["styleHero","css","zIndex","position","top","width","height","display","justifyContent","alignItems","pointerEvents","desktopFirstMediaQuery","styleHeroOverlay","styleHeroBody","styleHeroPCTitle","marginBottom","styleHeroMobileTitle","styleHeroSubTitle","fontSize","styleHeroMobileSubTitle","textAlign","p","styleHeroVideo","bottom","left","objectFit","isPassedHeroSection","useIsPassedHeroSection","buttonText","buttonDisabled","useMainButtonText","___EmotionJSX","Box","motion","id","poster","GATSBY_CDN_URL","autoPlay","loop","muted","playsInline","loading","src","component","opacity","Title","order","className","initial","whileInView","viewport","once","transition","delay","times","animate","y","textTransitionInitialOptions","textTransitionTimingFunction","alt","Text","size","color","weight","mb","Button","href","URLS","target","radius","variant","leftIcon","Icon","icon","faArrowUpRightFromSquare","disabled"],"sourceRoot":""}