{"version":3,"file":"4045e9d4-3c2e561ccd2bfc8af74e.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 } from '@fortawesome/pro-regular-svg-icons';\nimport { Box, Button, Icon, Text, Title, desktopFirstMediaQuery } 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            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            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":["_ref","name","styles","_ref2","_ref3","_ref4","styleHero","css","zIndex","position","top","width","height","display","justifyContent","alignItems","pointerEvents","desktopFirstMediaQuery","mobile","styleHeroOverlay","styleHeroBody","styleHeroPCTitle","marginBottom","styleHeroMobileTitle","styleHeroSubTitle","tablet","fontSize","styleHeroMobileSubTitle","textAlign","p","styleHeroVideo","bottom","left","objectFit","Hero","isPassedHeroSection","useIsPassedHeroSection","buttonText","buttonDisabled","useMainButtonText","___EmotionJSX","Box","React","Fragment","motion","video","id","poster","GATSBY_CDN_URL","autoPlay","loop","muted","playsInline","src","component","opacity","Title","order","className","div","initial","whileInView","viewport","once","transition","delay","times","animate","y","textTransitionInitialOptions","textTransitionTimingFunction","alt","Text","size","color","weight","mb","Button","href","URLS","INFCON_2023_REPLAY","target","radius","variant","leftIcon","Icon","icon","faArrowUpRightFromSquare","disabled"],"sourceRoot":""}