fix: miscellaneous compatibility and a11y fixes

gatsby-browser.js

@@ -0,0 +1,6 @@
+exports.onClientEntry = async () => {
+  // If required — e.g. Safari — add the IntersectionObserver polyfill.
+  if (typeof IntersectionObserver === 'undefined') {
+    await import('intersection-observer');
+  }
+};

package.json

@@ -30,6 +30,7 @@
     "gatsby-source-filesystem": "next",
     "gatsby-transformer-remark": "next",
     "gatsby-transformer-sharp": "next",
+    "intersection-observer": "^0.5.0",
     "lodash.template": "^4.4.0",
     "prop-types": "^15.6.0",
     "ramda": "^0.25.0",

src/components/Contact/Form.js

@@ -61,18 +61,18 @@ const ContactForm = ({ action, name }) => (
     data-netlify="true"
   >
     <HoneyPot>
-      <Label for="full-name">
+      <Label htmlFor="full-name">
         Don’t fill out this field if you’re a human.
       </Label>
       <Input type="text" id="full-name" name="full-name" />
     </HoneyPot>
-    <Label for="fname">Name</Label>
+    <Label htmlFor="fname">Name</Label>
     <Input type="text" id="fname" name="name" required />
-    <Label for="email">Email</Label>
+    <Label htmlFor="email">Email</Label>
     <Input type="email" id="email" name="email" required />
-    <Label for="phone">Phone Number</Label>
+    <Label htmlFor="phone">Phone Number</Label>
     <Input type="tel" id="phone" name="phone" required />
-    <Label for="message">Message</Label>
+    <Label htmlFor="message">Message</Label>
     <Textarea id="message" name="message" required />
     <Submit type="submit">
       <span>Send Message</span>

src/components/Footer/Footer.js

@@ -6,7 +6,7 @@ import { color, font } from '../../utils/style';
 
 const Footer = styled('footer')`
   background-color: ${color.accentLight};
-  color: ${color.textLight};
+  color: ${color.textDefault};
   font-family: ${font.default};
   font-size: 11px;
   margin-top: 4rem;

yarn.lock

@@ -6709,6 +6709,10 @@ interpret@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
 
+intersection-observer@^0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/intersection-observer/-/intersection-observer-0.5.0.tgz#9fe8bee3953c755b1485c38efd9633d535775ea6"
+
 invariant@^2.2.0, invariant@^2.2.1, invariant@^2.2.2, invariant@^2.2.4:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"