From 4e2327f73f25301d146ffed7cf3b0800c0bab2bc Mon Sep 17 00:00:00 2001
From: Kevin Miller <keveemiller@gmail.com>
Date: Fri, 10 Apr 2020 16:58:36 -0400
Subject: [PATCH] chore: added no-js support

---
 gatsby-browser.js                               |  5 +++++
 gatsby-ssr.js                                   |  5 +++++
 src/components/common/javascript-presence.js    | 12 ++++++++++++
 .../common/javascript-presence.module.scss      | 17 +++++++++++++++++
 4 files changed, 39 insertions(+)
 create mode 100644 gatsby-browser.js
 create mode 100644 gatsby-ssr.js
 create mode 100644 src/components/common/javascript-presence.js
 create mode 100644 src/components/common/javascript-presence.module.scss

diff --git a/gatsby-browser.js b/gatsby-browser.js
new file mode 100644
index 000000000..8eaec5cf7
--- /dev/null
+++ b/gatsby-browser.js
@@ -0,0 +1,5 @@
+exports.onClientEntry = () => {
+  window.addEventListener('load', () => {
+    document.body.className = document.body.className.replace(/\bno-js\b/, '')
+  })
+}
diff --git a/gatsby-ssr.js b/gatsby-ssr.js
new file mode 100644
index 000000000..673d93095
--- /dev/null
+++ b/gatsby-ssr.js
@@ -0,0 +1,5 @@
+exports.onRenderBody = ({ setBodyAttributes }) => {
+  setBodyAttributes({
+    className: 'no-js',
+  })
+}
diff --git a/src/components/common/javascript-presence.js b/src/components/common/javascript-presence.js
new file mode 100644
index 000000000..1dc546662
--- /dev/null
+++ b/src/components/common/javascript-presence.js
@@ -0,0 +1,12 @@
+import React from 'react'
+import noJsStyles from './javascript-presence.module.scss'
+
+const JsEnabled = ({ children }) => (
+  <div className={noJsStyles.jsEnabled}>{children}</div>
+)
+
+const JsDisabled = ({ children }) => (
+  <div className={noJsStyles.jsDisabled}>{children}</div>
+)
+
+export { JsEnabled, JsDisabled }
diff --git a/src/components/common/javascript-presence.module.scss b/src/components/common/javascript-presence.module.scss
new file mode 100644
index 000000000..c404082d1
--- /dev/null
+++ b/src/components/common/javascript-presence.module.scss
@@ -0,0 +1,17 @@
+.js-disabled {
+  display: none;
+}
+
+.js-enabled {
+  display: inline;
+}
+
+.no-js {
+  .js-enabled {
+    display: none;
+  }
+
+  .js-disabled {
+    display: inline;
+  }
+}