fix non object style in ecologi banner, remove need for company id, now -> vercel

Author: Jeddf

.gitignore

@@ -1,4 +1,5 @@
 node_modules/
 .cache/
 public/
-.env*
+.env*
+.vercel

gatsby-node.js

@@ -20,7 +20,7 @@
   },
   "scripts": {
     "build": "gatsby build",
-    "now-build": "npm run build",
+    "vercel-build": "npm run build",
     "develop": "gatsby develop",
     "start": "npm run develop",
     "test": "echo \"Error: no test specified\" && exit 1"

package.json

@@ -3,20 +3,30 @@ import styled from "styled-components";
 
 const Footer = ({ name, address, companyNumber }) => (
   <>
-  <Row>
-    <a href="https://ecologi.com/diff" target="_blank" rel="noopener noreferrer" title="View our Ecologi profile" style="width:200px;display:inline-block;">
-      <img alt="We offset our carbon footprint via Ecologi" src="https://api.ecologi.com/badges/cpw/5e3fed1c59ec630016e27dd7?black=true&landscape=true" style="width:200px;" />
-    </a>
-  </Row>
-  <Row>
-    <footer>
-      {name} <Em>|</Em>{" "}
-      {Object.values(address || {})
-        .filter(Boolean)
-        .join(", ")}{" "}
-      <Em>|</Em> #{companyNumber}
-    </footer>
-  </Row>
+    <Row>
+      <a
+        href="https://ecologi.com/diff"
+        target="_blank"
+        rel="noopener noreferrer"
+        title="View our Ecologi profile"
+        style={{ width: "200px", display: "inline-block" }}
+      >
+        <img
+          alt="We offset our carbon footprint via Ecologi"
+          src="https://api.ecologi.com/badges/cpw/5e3fed1c59ec630016e27dd7?black=true&landscape=true"
+          style={{ width: "200px" }}
+        />
+      </a>
+    </Row>
+    <Row>
+      <footer>
+        {name} <Em>|</Em>{" "}
+        {Object.values(address || {})
+          .filter(Boolean)
+          .join(", ")}{" "}
+        <Em>|</Em> #{companyNumber}
+      </footer>
+    </Row>
   </>
 );
 

src/components/footer.js

@@ -11,9 +11,9 @@ const NotFoundPage = ({
       description: { description },
       twitterHandle,
       address,
-      companyNumber
-    }
-  }
+      companyNumber,
+    },
+  },
 }) => (
   <Layout {...{ address, companyNumber }}>
     <SEO title="404: Not found" {...{ name, description, twitterHandle }} />
@@ -26,8 +26,8 @@ const NotFoundPage = ({
 );
 
 export const pageQuery = graphql`
-  query FourOhFourQuery($contentfulCompanyId: String!) {
-    contentfulCompany(id: { eq: $contentfulCompanyId }) {
+  query FourOhFourQuery {
+    contentfulCompany(name: { regex: "/diff/i" }) {
       address {
         line1
         city

src/pages/404.js

@@ -15,9 +15,9 @@ const IndexPage = ({
       description: { description },
       twitterHandle,
       address,
-      companyNumber
-    }
-  }
+      companyNumber,
+    },
+  },
 }) => {
   return (
     <Layout {...{ name, address, companyNumber }}>
@@ -39,8 +39,8 @@ const IndexPage = ({
 };
 
 export const pageQuery = graphql`
-  query IndexQuery($contentfulCompanyId: String!) {
-    contentfulCompany(id: { eq: $contentfulCompanyId }) {
+  query IndexQuery {
+    contentfulCompany(name: { regex: "/diff/i" }) {
       type
       byline
       contactEmail

src/pages/index.js

@@ -15,7 +15,6 @@
   "build": {
     "env": {
       "CONTENTFUL_ACCESS_TOKEN": "@contentful-access-token",
-      "CONTENTFUL_COMPANY_ID": "@contentful-company-id",
       "CONTENTFUL_HOST": "@contentful-host",
       "CONTENTFUL_SPACE_ID": "@contentful-space-id"
     }