feat: first announcement

src/pages/404.tsx

@@ -14,8 +14,7 @@ const NotFound: React.FC<PageProps<unknown, PageContext>> = ({
   pageContext
 }) => (
   <Layout location={location} heroSection={false}>
-    <Seo title="Page Not Found" />
-    <Section color="black" bgColor="white" bottomArrow={false}>
+        <Section color="black" bgColor="white" bottomArrow={false}>
       <SideBar
         pageContext={pageContext}
         location={location}
@@ -26,3 +25,5 @@ const NotFound: React.FC<PageProps<unknown, PageContext>> = ({
 )
 
 export default NotFound
+
+export const Head = () => <Seo title="Page Not Found" />

src/pages/about.tsx

@@ -17,8 +17,7 @@ const About: React.FC<PageProps<unknown>> = ({ location }) => {
       heading="Behind Data Controller"
       desc="Data Controller is a product of 4GL, a brand of Bowe IO Ltd"
     >
-      <Seo title="About" />
-      <Section color="black" bgColor="white">
+            <Section color="black" bgColor="white">
         <div className="row">
           <div className="offset-md-2 col-md-8">
             <SectionHeading center="no">About Data Controller</SectionHeading>
@@ -46,3 +45,5 @@ const About: React.FC<PageProps<unknown>> = ({ location }) => {
 }
 
 export default About
+
+export const Head = () => <Seo title="About" />

src/pages/contact.tsx

@@ -58,8 +58,7 @@ const Contact: React.FC<PageProps<unknown>> = ({ location }) => {
       heading="Book a Demo"
       desc="Schedule a demonstration of the Data Controller to see our latest features and explore use cases"
     >
-      <Seo title="Contact" />
-      <Section color="black" bgColor="white" bottomArrow={false}>
+            <Section color="black" bgColor="white" bottomArrow={false}>
         <div className="row">
           <div className="col-md-6">
             <SectionHeading center="no">Schedule a Call</SectionHeading>
@@ -193,3 +192,5 @@ Message: ${message}`
 }
 
 export default Contact
+
+export const Head = () => <Seo title="Contact" />

src/pages/faq.tsx

@@ -20,8 +20,7 @@ const Faq: React.FC<PageProps<unknown>> = ({ location }) => {
       heading="Data Controller – FAQ"
       desc="Most common user questions and answers regarding the Data Controller"
     >
-      <Seo title="FAQ" />
-      <Section color="black" bgColor="white">
+            <Section color="black" bgColor="white">
         <div className="row">
           <div className="col-md-8">
             <FAQ
@@ -67,3 +66,5 @@ const Faq: React.FC<PageProps<unknown>> = ({ location }) => {
 }
 
 export default Faq
+
+export const Head = () => <Seo title="FAQ" />

src/pages/index.tsx

@@ -67,8 +67,7 @@ const Home: React.FC<PageProps<IndexPageData>> = ({ data, location }) => {
       heading="Flexible and Secure Data Modification"
       desc="Data Controller for SAS® enables business users to update IT owned source tables, secured by review / approve workflow and full audit trail."
     >
-      <Seo />
-      <Section color="black" bgColor="white">
+            <Section color="black" bgColor="white">
         <div className="row">
           <div className="col-md-3">
             <Art src={leftArt} info="Business Owner" />
@@ -262,3 +261,5 @@ export const pageQuery = graphql`
     }
   }
 `
+
+export const Head = () => <Seo />

src/pages/{MarkdownRemark.frontmatter__slug}.tsx

@@ -40,7 +40,6 @@ const MarkdownPageTemplate: React.FC<
       heading={frontmatter.heading}
       desc={frontmatter.desc}
     >
-      <Seo title={frontmatter.title} />
       <Section color="black" bgColor="white" bottomArrow={false}>
         <StyledMarkdown dangerouslySetInnerHTML={{ __html: html }} />
       </Section>
@@ -50,6 +49,10 @@ const MarkdownPageTemplate: React.FC<
 
 export default MarkdownPageTemplate
 
+export const Head: React.FC<{ data: MarkdownPageData }> = ({ data }) => (
+  <Seo title={data.markdownRemark.frontmatter.title} />
+)
+
 export const pageQuery = graphql`
   query ($id: String!) {
     markdownRemark(id: { eq: $id }) {