42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import React from 'react'
|
|
import { Link } from 'gatsby'
|
|
import { FaShieldAlt } from 'react-icons/fa'
|
|
|
|
import { Hero, HeroHeading, HeroDesc, HeroBadge } from './style'
|
|
import { BottomSectionArrow, OutlineButton } from '../shared/styledComponents'
|
|
import { Container } from '../shared'
|
|
|
|
import { pathPrefix } from '../../../gatsby-config'
|
|
|
|
import type { HeroSectionProps } from '../../types'
|
|
|
|
const HeroSection: React.FC<HeroSectionProps> = ({
|
|
location,
|
|
heading,
|
|
desc
|
|
}) => (
|
|
<Hero bg={location.pathname === pathPrefix + '/'}>
|
|
<Container>
|
|
<HeroHeading>{heading}</HeroHeading>
|
|
<HeroDesc>{desc}</HeroDesc>
|
|
{location.pathname === pathPrefix + '/' && (
|
|
<>
|
|
<HeroBadge
|
|
href="https://sasapps.io/cyber-essentials-certified/"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>
|
|
<FaShieldAlt /> Cyber Essentials Certified
|
|
</HeroBadge>
|
|
<Link to="/contact/">
|
|
<OutlineButton>Try Data Controller</OutlineButton>
|
|
</Link>
|
|
</>
|
|
)}
|
|
</Container>
|
|
<BottomSectionArrow />
|
|
</Hero>
|
|
)
|
|
|
|
export default HeroSection
|