From 316b59eeedd58183256af31fcb1098c84da650bc Mon Sep 17 00:00:00 2001
From: Rene Saarsoo <nene@triin.net>
Date: Sun, 4 Oct 2020 16:27:13 +0300
Subject: [PATCH] Add credits footer

---
 src/App.tsx                |  2 ++
 src/components/Credits.tsx | 21 +++++++++++++++++++++
 2 files changed, 23 insertions(+)
 create mode 100644 src/components/Credits.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 5a73454..fabb228 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -7,6 +7,7 @@ import styled from 'styled-components';
 import { CodeEditor } from './components/CodeEditor';
 import { ZwoOutput } from './components/ZwoOutput';
 import logo from "./logo.png";
+import { Credits } from './components/Credits';
 
 const defaultWorkout = `Name: Sample workout
 Description: Try changing it, and see what happens below.
@@ -63,6 +64,7 @@ export function App() {
       {error && <ErrorMessage>{error}</ErrorMessage>}
       <WorkoutStats workout={workout} />
       <ZwoOutput workout={workout} />
+      <Credits />
     </AppContainer>
   );
 }
diff --git a/src/components/Credits.tsx b/src/components/Credits.tsx
new file mode 100644
index 0000000..2bd653f
--- /dev/null
+++ b/src/components/Credits.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import styled from 'styled-components';
+
+const Text = styled.p`
+  font-size: 12px;
+  text-align: center;
+  margin-top: 3em;
+  border-top: 1px solid #eee;
+  padding-top: 1em;
+  color: gray;
+`;
+
+export const Credits: React.FC<{}> = () => (
+  <Text>
+    Built by Rene Saarsoo.
+    ·
+    Graphics inspired by <a href="https://whatsonzwift.com/workouts/">What's on Zwift?</a>
+    &nbsp;·
+    Sweat provided by <a href="https://zwift.com">Zwift</a> :-)
+  </Text>
+)
\ No newline at end of file