{"version":3,"file":"component---src-components-sections-job-description-js-561b671f6ac28c36e2cd.js","mappings":"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","sources":["webpack://gatsby-starter-default/./src/components/buttons/ApplyButton.js","webpack://gatsby-starter-default/./src/components/sections/JobDescription.js"],"sourcesContent":["import React from \"react\"\nimport styled from \"styled-components\"\nimport { ButtonText } from \"../styles/TextStyles\"\n\nexport default function GetStarted(props) {\n  const { title, className } = props\n  \n  return (\n      <Wrapper>\n        <TextWrapper>\n          <Title>{title || \"Download\"}</Title>\n        </TextWrapper>\n      </Wrapper>\n  )\n}\n\nconst Wrapper = styled.div`\n    display: flex;\n    padding: 16px 20px;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    gap: 9px;\n    border-radius: 8px;\n    background: var(--hi-vis, #54C5C0);\n    cursor: pointer;\n\n  @media (max-width: 1354px) {\n    margin-bottom: 32px;\n  }\n\n  @media (max-width: 480px) {\n    width: 100%;\n    margin-bottom: 24px;\n\n  *,\n  & {\n    transition: 1s cubic-bezier(0.075, 0.82, 0.165, 1);\n  }\n\n  :hover {\n    /* box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1),\n      0px 30px 60px rgba(23, 0, 102, 0.5),\n      inset 0px 0px 0px 0.5px rgba(255, 255, 255, 0.5); */\n    transform: translateY(-3px);\n  }\n`\n\nconst TextWrapper = styled.div`\n  display: grid;\n  gap: 4px;\n`\n\nconst Title = styled(ButtonText)`\n    color: var(--white, #FFF);\n    font-size: 13px;\n    font-family: Montserrat;\n    letter-spacing: 1px;\n    font-weight: bold !important;\n    text-transform: uppercase;\n`","import React from 'react';\nimport { Link } from 'gatsby';\nimport Layout from '../layout/layout'\nimport styled, { keyframes } from \"styled-components\";\nimport ApplyButton from \"../buttons/ApplyButton\"\nimport { H2, MediumText } from \"../styles/TextStyles\";\nimport { themes } from \"../styles/ColorStyles\";\n\nconst JobDescription = ({ pageContext }) => {\n  const { id, icon, title, location, description, subtitleOne, headingOne, bulletListOne, headingTwo, bulletListTwo, headingThree, bulletListThree, conclusion } = pageContext;\n\n  return (\n    <Layout>\n      <Wrapper>\n        <ContentWrapper>\n         <HeaderWrapper>\n          <BackLink to={`/careers`}>\n              {/* <FontAwesomeIcon icon={faArrowLeft} /> */}\n              Back to listings\n            </BackLink>\n          <h3>{title}</h3>\n          <span>{location}</span>\n          <a href={`mailto:info@gotradie.com.au?subject=${encodeURIComponent(title)}`} target=\"_blank\" rel=\"noreferrer\">\n              <ApplyButton title=\"Apply now\" />\n          </a>\n         </HeaderWrapper>\n         <JobBody>\n          <AboutSection>\n            <h2>{subtitleOne}</h2>\n            <p>{description}</p>\n          </AboutSection>\n          <BulletSection>\n            <h4>{headingOne}</h4>\n            <Highlights dangerouslySetInnerHTML={{ __html: bulletListOne }} />\n          </BulletSection>\n          <BulletSection>\n            <h4>{headingTwo}</h4>\n            <Highlights dangerouslySetInnerHTML={{ __html: bulletListTwo }} />\n          </BulletSection> \n          <BulletSection>\n            <h4>{headingThree}</h4>\n            <Highlights dangerouslySetInnerHTML={{ __html: bulletListThree }} />\n          </BulletSection> \n          <ConclusionSection>\n            <p>{conclusion}</p>\n          </ConclusionSection>\n          <ButtonWrapper>\n          <a href={`mailto:info@gotradie.com.au?subject=${encodeURIComponent(title)}`} target=\"_blank\" rel=\"noreferrer\">\n              <ApplyButton title=\"Apply now\" />\n          </a>\n          <TextLink>\n          <Link to={`/careers`}>Back</Link>\n          </TextLink>\n           </ButtonWrapper>\n          </JobBody>   \n            \n        </ContentWrapper>\n      </Wrapper>\n    </Layout>\n   \n  );\n};\n\nexport default JobDescription;\n\nconst animation = keyframes`\n  0% { opacity: 0; transform: translateY(-10px); filter: blur(10px); }\n  //80% { opacity: 0.5; transform: translateY(-10px); filter: blur(10px); }\n  100% { opacity: 1; transform: translateY(0px); filter: blur(0px); }\n`\n\nconst Wrapper = styled.div`\n  //background: linear-gradient(180deg, #4316db 0%, #9076e7 100%);\n  overflow: visible;\n`\nconst ContentWrapper = styled.div`\nmax-width: 960px;\nmargin: 0 auto;\npadding: 60px 0px 340px 0px;\ndisplay: block;\ngap: 48px;\n\n> * {\n  opacity: 0;\n  animation: ${animation} 1s forwards;\n\n  :nth-child(1) {\n    animation-delay: 0.s;\n  }\n}\n\n@media (max-width: 1354px) {\n  max-width: 640px;\n  margin: 0 auto;\n  padding: 0px 0px 340px 0px;\n  display: block;\n  gap: 48px;\n}\n\n@media (max-width: 480px) {\n  width: 100%;\n  padding: 0 24px;\n  margin: 0 auto;\n  display: block;\n  gap: 48px;\n}\n`\n\nconst Highlights = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-self: stretch;\n\n  ul {\n    list-style-type: disc; /* Set the list-style-type property to display disc bullets */\n    padding-left: 24px;\n    color: var(--concrete, #E1E9EF);\n    font-size: 14px;\n    font-family: Montserrat;\n    font-weight: 500;\n    line-height: 161%;\n  }\n\n  li {\n    margin-bottom: 0.5rem; /* Add some vertical spacing between the list items */\n  }\n`\n\nconst HeaderWrapper = styled.div`\n  display: flex;\n  padding: 0px 54px 32px 54px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 16px;\n  align-self: stretch;\n\n  h3 {\n    color: var(--white, #FFF);\n    font-size: 24px;\n    font-family: Montserrat;\n    font-weight: 700;\n    line-height: 29px;\n    letter-spacing: -0.48px;\n  }\n  \n  p{\n    color: var(--white, #FFF);\n    font-size: 14px;\n    font-family: Montserrat;\n    font-weight: 500;\n    line-height: 140%;\n  }\n  span{\n    color: var(--white, #789BB6);\n    font-size: 12px;\n    font-family: Montserrat;\n    font-weight: 500;\n    line-height: 13px;\n  }\n\n  @media (max-width: 1354px) {\n    width: 100%;\n    padding: 0px;\n    margin-top: 0px;\n  }\n  \n  @media (max-width: 480px) {\n    width: 100%;\n    padding: 16px;\n    margin-top: 0px;\n  }\n`\n\nconst JobBody = styled.div`\n    display: flex;\n    width: 960px;\n    padding: 54px;\n    flex-direction: column;\n    border-radius: 16px;\n    background: var(--blue-collar, #153549);\n\n    @media (max-width: 1354px) {\n      width: 100%;\n      padding: 32px;\n    }\n    \n    @media (max-width: 480px) {\n      width: 100%;\n      padding: 24px;\n    }\n`\n\nconst AboutSection = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 16px;\n  padding: 0px 0px 32px 0px;\n  flex: 1 0 0;\n\n  h2{\n    color: var(--white, #FFF);\n    font-size: 24px;\n    font-family: Montserrat;\n    font-weight: 700;\n    line-height: 29px;\n    letter-spacing: -0.48px;\n  }\n  p{\n    color: var(--white, #FFF);\n    font-size: 14px;\n    font-family: Montserrat;\n    font-weight: 500;\n    line-height: 140%;\n  }\n`\n\nconst BulletSection = styled.div`\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 0px 0px 32px 0px;\n    flex: 1 0 0;\n\n    h4{\n      color: var(--white, #FFF);\n      font-size: 15px;\n      font-family: Montserrat;\n      font-weight: 600;\n    }\n`\nconst ConclusionSection = styled.div`\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 16px;\n  padding: 0px 0px 32px 0px;\n  flex: 1 0 0;\n\n  h2{\n    color: var(--white, #FFF);\n    font-size: 24px;\n    font-family: Montserrat;\n    font-weight: 700;\n    line-height: 29px;\n    letter-spacing: -0.48px;\n  }\n  p{\n    color: var(--white, #FFF);\n    font-size: 14px;\n    font-family: Montserrat;\n    font-weight: 500;\n    line-height: 140%;\n  }\n`\n\nconst Title = styled(H2)`\n  color: ${themes.dark.text1};\n  text-align: center;\n  span {\n    background: linear-gradient(90deg, #54C5C0 0%, #789BB6 100%);\n    background-clip: text;\n    -webkit-background-clip: text;\n    color: transparent;\n  }\n\n  @media (max-width: 480px) {\n    font-size: 40px;\n    text-align: center;\n  }\n`\nconst ButtonWrapper = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  padding-top: 8px;\n\n  @media (max-width: 1354px) {\n    padding: 0px;\n    display: block;\n    width: 100%;\n  }\n  \n  @media (max-width: 480px) {\n    padding: 0px;\n    display: block;\n    width: 100%;\n  }\n  \n`\n\nconst BackLink = styled(Link)`\n  display: flex;\n  align-items: center;\n  color: #E8B247;\n\n  svg {\n    margin-right: 0.5rem;\n  }\n`\n\nconst TextLink = styled.div`\n  display: flex;\n  justify-content: center;\n`\n\n"],"names":["GetStarted","props","title","className","React","Wrapper","TextWrapper","Title","styled","div","withConfig","displayName","componentId","ButtonText","_ref","pageContext","id","icon","location","description","subtitleOne","headingOne","bulletListOne","headingTwo","bulletListTwo","headingThree","bulletListThree","conclusion","Layout","ContentWrapper","HeaderWrapper","BackLink","to","href","encodeURIComponent","target","rel","ApplyButton","JobBody","AboutSection","BulletSection","Highlights","dangerouslySetInnerHTML","__html","ConclusionSection","ButtonWrapper","TextLink","Link","animation","keyframes","H2","themes","dark","text1"],"sourceRoot":""}