From 5eb511914a1f89671e63cd3848ebd85c58a62728 Mon Sep 17 00:00:00 2001
From: Hugo Di Francesco <HugoDF@users.noreply.github.com>
Date: Mon, 20 Jan 2020 20:35:48 +0000
Subject: [PATCH] add HTML-only back to top link

---
 src/components/header.js | 2 +-
 src/pages/index.js       | 7 +++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/header.js b/src/components/header.js
index bcb0466a..5828752b 100644
--- a/src/components/header.js
+++ b/src/components/header.js
@@ -21,7 +21,7 @@ function Header({ siteTitle, siteDescription, siteUrl }) {
         <meta name="twitter:image" content={`${siteUrl}/twitter-card.png`} />
       </Helmet>
       <div>
-        <h1>
+        <h1 id="top">
           <Link to="/">/uses</Link>
         </h1>
         <p>
diff --git a/src/pages/index.js b/src/pages/index.js
index 54059752..134b94e8 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -7,6 +7,12 @@ import Layout from '../components/layout';
 import Person from '../components/Person';
 import Topics from '../components/Topics';
 
+const BackToTopLink = styled.a`
+  position: fixed;
+  bottom: 10px;
+  right: 10px;
+`;
+
 function IndexPage() {
   const { currentTag } = useContext(FilterContext);
   const { allPerson } = useStaticQuery(graphql`
@@ -43,6 +49,7 @@ function IndexPage() {
           <Person key={person.name} person={person} currentTag={currentTag} />
         ))}
       </People>
+      <BackToTopLink href="#top">&uarr; Back to top</BackToTopLink>
     </Layout>
   );
 }