{"version":3,"file":"596-5bb70915c802ef68a5da.js","mappings":"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","sources":["webpack://WHU-FrontEnd/./packages/ui/src/elements/Hero/Corner/styles.tsx","webpack://WHU-FrontEnd/./packages/ui/src/elements/Hero/Corner/top-bottom.jsx","webpack://WHU-FrontEnd/./packages/ui/src/elements/Hero/Corner/left-right.jsx","webpack://WHU-FrontEnd/./packages/ui/src/elements/Hero/Corner/index.tsx"],"sourcesContent":["import styled from 'styled-components'\nimport { rgba } from 'polished'\nimport { SImageWrap, SLinkWrap } from 'widgets/Image'\n\nexport const HeroCorner = styled.header<{\n $slim?: boolean\n}>`\n color: ${(props) => props.theme.palette.white};\n padding: 40px 0;\n position: relative;\n overflow: hidden;\n display: flex;\n align-items: flex-end;\n\n min-height: 300px;\n @media (min-width: 768px) {\n min-height: ${(props) => (props.$slim ? '300px' : '600px')};\n }\n`\n\nexport const CornerContainer = styled.div`\n display: flex;\n flex-direction: column;\n`\n\nexport const Corner = styled.div`\n border-width: 3px 3px 0 0;\n border-style: solid;\n padding: 24px 32px;\n border-color: inherit;\n`\n\nexport const CornerHeading = styled.h1`\n font-size: 4rem;\n margin: 0;\n line-height: 1.1;\n font-weight: 400;\n`\n\nexport const CornerSubHeading = styled.h2`\n font-size: 2.4rem;\n border-width: 3px 3px 0 0;\n line-height: 1.3;\n margin: 32px 0 0;\n font-weight: 400;\n display: block;\n`\n\nexport const InfoContainer = styled.div`\n display: flex;\n flex-direction: column;\n padding-left: 32px;\n`\n\nexport const Title = styled.span`\n font-weight: 700;\n margin: 0;\n font-size: 40px;\n line-height: 65px;\n`\n\nexport const Em = styled.span`\n display: block;\n font-size: 2.2rem;\n font-weight: 400;\n margin: 0;\n`\n\nexport const Wrapper = styled.div`\n display: flex;\n justify-content: space-between;\n position: relative;\n max-width: 1300px;\n width: 100%;\n height: 100%;\n margin-left: auto;\n margin-right: auto;\n padding-left: 15px;\n padding-right: 15px;\n z-index: 2;\n`\n\nexport const CTA = styled.div`\n margin-top: 0;\n`\n\nconst maskStart = '5%'\nconst maskSize = '30%'\nexport const BackgroundContainer = styled.div<{ $color: string | undefined }>`\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n position: absolute;\n\n //background: ${(props) => rgba(props.$color ?? '#fff', 0.3)};\n &:before {\n content: '';\n\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n position: absolute;\n width: 100%;\n height: 100%;\n opacity: 0.5;\n\n background: url(${(props) => props.$color}) no-repeat;\n background-size: cover;\n }\n\n // image wrap elem\n > span {\n height: 100%;\n }\n\n ${SLinkWrap} {\n position: absolute;\n top: 0;\n left: 50%;\n transform: translate3d(-50%, 0, 0);\n\n width: 100%;\n height: 100%;\n max-width: 1280px;\n }\n\n ${SImageWrap} {\n height: 100%;\n }\n\n [data-gatsby-image-wrapper] {\n width: 100%;\n min-height: 100%;\n\n margin: 0 auto;\n\n @media screen and (min-width: 1290px) {\n max-width: 1280px;\n\n mask: linear-gradient(\n to left,\n transparent,\n transparent ${maskStart},\n #fff calc(${maskStart} + ${maskSize}),\n #fff calc(100% - (${maskStart} + ${maskSize})),\n transparent calc(100% - ${maskStart})\n );\n\n mask-position: center;\n mask-repeat: no-repeat;\n mask-composite: intersect;\n }\n }\n\n &:before {\n content: '';\n position: absolute;\n left: 0;\n top: 0;\n z-index: 1;\n width: 100%;\n height: 100%;\n opacity: 0.5;\n background-image: linear-gradient(\n to left,\n ${(props) => props.theme.palette.shade},\n ${(props) => props.theme.palette.primary}\n );\n }\n`\n","import styled from 'styled-components'\n\nimport {\n HeroCorner as HC,\n Wrapper as W,\n CornerContainer as CC,\n Corner,\n InfoContainer as IC,\n Title,\n} from './styles'\n\nexport const HeroCorner = styled(HC)`\n align-items: stretch;\n`\n\nexport const Wrapper = styled(W)`\n flex-direction: column;\n height: auto;\n`\n\nexport const CornerContainer = styled(CC)`\n flex-direction: row;\n justify-content: flex-end;\n\n ${Corner} {\n flex: 0 1 45%;\n }\n`\n\nexport const InfoContainer = styled(IC)`\n ${Title} {\n font-size: 4rem;\n }\n`\n","import styled from 'styled-components'\nimport { breakpoint } from '../../ThemeProvider'\n\nimport {\n HeroCorner as HC,\n Wrapper as W,\n CornerContainer as CC,\n InfoContainer as IC,\n Title,\n} from './styles'\n\nexport const HeroCorner = styled(HC)`\n align-items: flex-end;\n`\n\nexport const Wrapper = styled(W)`\n flex-direction: column;\n justify-content: flex-end;\n\n ${breakpoint.md`\n flex-direction: row;\n align-items: flex-end;\n justify-content: space-between;\n `};\n`\n\nexport const CornerContainer = styled(CC)`\n flex: 0 1 35%;\n`\n\nexport const InfoContainer = styled(IC)`\n flex: 0 1 25%;\n align-self: flex-end;\n\n ${Title} {\n font-size: 2.4em;\n }\n`\n","import React, { ReactNode } from 'react'\nimport PropTypes from 'prop-types'\n\nimport * as Generic from './styles'\nimport * as TopBottom from './top-bottom'\nimport * as LeftRight from './left-right'\n\nconst StylesMap = {\n 'top-bottom': TopBottom,\n 'left-right': LeftRight,\n}\n\nconst HeroCorner: React.FC<{\n heading?: string\n subheading?: string | null\n em?: string\n title?: string\n variant?: keyof typeof StylesMap | null\n action?: ReactNode\n background?: ReactNode\n noHeading?: boolean\n backgroundColor: string | undefined\n compact?: boolean\n}> = ({\n heading,\n subheading,\n em,\n title,\n action,\n background,\n variant,\n noHeading,\n backgroundColor,\n slim,\n}) => {\n const S = StylesMap[variant ?? 'top-bottom']\n\n return (\n \n \n {background}\n \n \n \n \n {heading && (\n \n {heading}\n \n )}\n {subheading && (\n \n {subheading}\n \n )}\n \n \n \n {em && {em}}\n {title && {title}}\n {action && {action}}\n \n \n \n )\n}\n\nHeroCorner.propTypes = {\n background: PropTypes.node.isRequired,\n\n heading: PropTypes.string,\n subheading: PropTypes.string,\n\n title: PropTypes.string,\n em: PropTypes.string,\n\n action: PropTypes.node,\n variant: PropTypes.oneOf(['top-bottom', 'left-right']),\n}\n\nHeroCorner.defaultProps = {\n variant: 'top-bottom',\n}\n\nexport default HeroCorner\n"],"names":["HeroCorner","styled","header","withConfig","displayName","componentId","props","theme","palette","white","$slim","CornerContainer","div","Corner","CornerHeading","h1","CornerSubHeading","h2","InfoContainer","Title","span","Em","Wrapper","CTA","maskStart","BackgroundContainer","$color","SLinkWrap","SImageWrap","shade","primary","HC","W","CC","IC","breakpoint","md","StylesMap","TopBottom","LeftRight","_ref","heading","subheading","em","title","action","background","variant","noHeading","backgroundColor","slim","S","React","Generic","as","undefined","defaultProps"],"sourceRoot":""}