From bc523e3aae0a7f53477ecf62ba8ff7b438f8fca2 Mon Sep 17 00:00:00 2001
From: Paul Melnikow <github@paulmelnikow.com>
Date: Wed, 20 Feb 2019 16:34:50 -0500
Subject: [PATCH] Fix your-badge link (#3058)
Fix #1954
---
.eslintrc.yml | 6 ++++++
frontend/components/usage.js | 4 ++--
frontend/pages/endpoint.js | 2 +-
gatsby-browser.js | 16 ++++++++++++++++
4 files changed, 25 insertions(+), 3 deletions(-)
create mode 100644 gatsby-browser.js
diff --git a/.eslintrc.yml b/.eslintrc.yml
index cef16c65f0..bb4c8a916c 100644
--- a/.eslintrc.yml
+++ b/.eslintrc.yml
@@ -11,6 +11,12 @@ parserOptions:
# though that setting is only for ES6 modules, not CommonJS modules.
sourceType: 'script'
+overrides:
+ files:
+ - gatsby-browser.js
+ parserOptions:
+ sourceType: 'module'
+
plugins:
- mocha
- no-extension-in-require
diff --git a/frontend/components/usage.js b/frontend/components/usage.js
index 427353dd6c..363c7d333f 100644
--- a/frontend/components/usage.js
+++ b/frontend/components/usage.js
@@ -170,7 +170,7 @@ export default class Usage extends React.PureComponent {
<section>
<H2 id="your-badge">Your Badge</H2>
- <H3 id="static-badge">Static</H3>
+ <H3>Static</H3>
<StaticBadgeMaker baseUrl={baseUrl} />
<VerticalSpace />
@@ -215,7 +215,7 @@ export default class Usage extends React.PureComponent {
/>
</p>
- <H3 id="endpoint">Endpoint (Beta)</H3>
+ <H3>Endpoint (Beta)</H3>
<p>
<Snippet
diff --git a/frontend/pages/endpoint.js b/frontend/pages/endpoint.js
index 71cc07282d..0fdaafe7f8 100644
--- a/frontend/pages/endpoint.js
+++ b/frontend/pages/endpoint.js
@@ -87,7 +87,7 @@ const EndpointPage = () => (
<GlobalStyle />
<Meta />
<Header />
- <H3 id="static-badge">Endpoint (Beta)</H3>
+ <H3>Endpoint (Beta)</H3>
<Snippet snippet={`${baseUrl}/badge/endpoint.svg?url=...&style=...`} />
<p>Endpoint response:</p>
<JsonExample
diff --git a/gatsby-browser.js b/gatsby-browser.js
new file mode 100644
index 0000000000..ad8b86ab07
--- /dev/null
+++ b/gatsby-browser.js
@@ -0,0 +1,16 @@
+// Adapted from https://github.com/gatsbyjs/gatsby/issues/8413
+
+function scrollToElementId(id) {
+ const el = document.querySelector(id)
+ if (el) {
+ return window.scrollTo(0, el.offsetTop - 20)
+ } else {
+ return false
+ }
+}
+
+export function onRouteUpdate({ location: { hash } }) {
+ if (hash) {
+ window.setTimeout(() => scrollToElementId(hash), 10)
+ }
+}
--
GitLab