diff --git a/src/components/footer/index.tsx b/src/components/footer/index.tsx
index 6bfb4a4..49e3879 100644
--- a/src/components/footer/index.tsx
+++ b/src/components/footer/index.tsx
@@ -21,6 +21,11 @@ const Footer = () => (
on SAS Web Apps
.
+
+
+ Cyber Essentials Certified
+
+
Source Code
diff --git a/src/components/herosection/index.tsx b/src/components/herosection/index.tsx
index 0bef502..f484b8a 100644
--- a/src/components/herosection/index.tsx
+++ b/src/components/herosection/index.tsx
@@ -1,7 +1,8 @@
import React from 'react'
import { Link } from 'gatsby'
+import { FaShieldAlt } from 'react-icons/fa'
-import { Hero, HeroHeading, HeroDesc } from './style'
+import { Hero, HeroHeading, HeroDesc, HeroBadge } from './style'
import { BottomSectionArrow, OutlineButton } from '../shared/styledComponents'
import { Container } from '../shared'
@@ -19,9 +20,18 @@ const HeroSection: React.FC = ({
{heading}
{desc}
{location.pathname === pathPrefix + '/' && (
-
- Try Data Controller
-
+ <>
+
+ Cyber Essentials Certified
+
+
+ Try Data Controller
+
+ >
)}
diff --git a/src/components/herosection/style.tsx b/src/components/herosection/style.tsx
index df0a063..ac9e64f 100644
--- a/src/components/herosection/style.tsx
+++ b/src/components/herosection/style.tsx
@@ -17,3 +17,20 @@ export const HeroHeading = styled.h1`
export const HeroDesc = styled.p`
opacity: 0.8;
`
+
+export const HeroBadge = styled.a`
+ display: block;
+ width: fit-content;
+ margin: 0.75rem 0 0;
+ padding: 0.375rem 1rem;
+ font-size: 0.75rem;
+ border: 2px solid rgba(255, 255, 255, 0.5);
+ border-radius: 0.25rem;
+ color: white;
+ text-decoration: none;
+ &:hover {
+ color: white;
+ border-color: white;
+ opacity: 0.9;
+ }
+`