feat(nav): active state

src/pages/about.js

@@ -5,7 +5,7 @@ import { Header, Heading, Section, Text } from "../components";
 
 export default function Index({ data }) {
   return (
-    <Layout>
+    <Layout location="/about">
       <Header
         image={data.headerImage.childImageSharp.fluid}
         position="bottom right"

src/pages/contact.js

@@ -49,7 +49,7 @@ export default function Index({ data }) {
       .catch(error => console.log(error));
   };
   return (
-    <Layout>
+    <Layout location="/contact">
       <Header
         image={data.headerImage.childImageSharp.fluid}
         position="bottom right"

src/pages/index.js

@@ -14,7 +14,7 @@ import {
 
 export default function Index({ data }) {
   return (
-    <Layout>
+    <Layout location="/">
       <Header image={data.headerImage.childImageSharp.fluid}>
         <HeaderLogo transition={true} />
       </Header>

src/pages/services/bathrooms.js

@@ -5,7 +5,7 @@ import { Header } from "../../components";
 
 export default function Index({ data }) {
   return (
-    <Layout>
+    <Layout location="/services/bathrooms">
       <Header image={data.headerImage.childImageSharp.fluid}>
         <h1>Bathrooms</h1>
       </Header>

src/pages/services/index.js

@@ -5,7 +5,7 @@ import { Header } from "../../components";
 
 export default function Index({ data }) {
   return (
-    <Layout>
+    <Layout location="/services">
       <Header image={data.headerImage.childImageSharp.fluid}>
         <h1>Services</h1>
       </Header>