From 4efdc25c100b70b7c63a795b65901ae96a4e6f2f Mon Sep 17 00:00:00 2001
From: Matthew Grove <me@mgrove.uk>
Date: Sun, 12 Dec 2021 22:23:32 +0000
Subject: [PATCH] Add donation buttons

---
 package.json         |  2 +-
 src/Settings.js      | 18 ++++++++++++++++++
 src/css/Donation.css | 17 +++++++++++++++++
 3 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 src/css/Donation.css

diff --git a/package.json b/package.json
index 0972751..8d780ac 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "parandum",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "private": true,
   "dependencies": {
     "@babel/core": "^7.16.0",
diff --git a/src/Settings.js b/src/Settings.js
index cd91892..a7e89eb 100644
--- a/src/Settings.js
+++ b/src/Settings.js
@@ -5,6 +5,7 @@ import Button from "./Button";
 import { withRouter } from "react-router-dom";
 import SettingsContent from "./SettingsContent";
 import Footer from "./Footer";
+import "./css/Donation.css";
 
 export default withRouter(class Settings extends Component {
 	constructor(props) {
@@ -104,6 +105,23 @@ export default withRouter(class Settings extends Component {
 							Save for this session
 						</Button>
 					</div>
+
+					<h1 className="donation-header">Appreciate my work?</h1>
+					<p>Projects like Parandum take a massive amount of time, effort, and money to run! I'm really grateful for all your support.</p>
+					<div className="donation-links">
+						<a href="https://www.buymeacoffee.com/mgrove36" target="_blank" rel="noreferrer">
+							<img
+								src="https://cdn.buymeacoffee.com/buttons/v2/default-green.png"
+								alt="Buy me a coffee"
+							/>
+						</a>
+						<a href="https://www.paypal.com/donate/?hosted_button_id=AW7XJ7KFLC7JG" target="_blank" rel="noreferrer">
+							<img
+								src="https://pics.paypal.com/00/s/M2E5OWQyMjItZWU1My00YmEwLTljNmYtYTA2ZTI1OGUzMjA5/file.PNG"
+								alt="Donate with PayPal"
+							/>
+						</a>
+					</div>
 				</main>
 				<Footer showTerms={true} />
 			</div>
diff --git a/src/css/Donation.css b/src/css/Donation.css
new file mode 100644
index 0000000..b1cfbe1
--- /dev/null
+++ b/src/css/Donation.css
@@ -0,0 +1,17 @@
+.donation-links {
+	display: flex;
+	flex-direction: row;
+	column-gap: 16px;
+	row-gap: 8px;
+	flex-wrap: wrap;
+	margin-top: 12px;
+}
+
+.donation-links img {
+	width: 100%;
+	max-width: 210px;
+}
+
+.donation-header {
+	margin-top: 32px;
+}
\ No newline at end of file